Tag: code

Introduction

Let’s face it: long URLs are the bane of the internet. They’re unsightly, cumbersome, and frankly, nobody enjoys dealing with them. Every time I encounter a URL that stretches longer than a Monday morning, I can’t help but cringe. But here’s the silver lining: you don’t have to endure the tyranny of endless web addresses any longer. Introducing YOURLS—the ultimate weapon in your arsenal against the plague of elongated URLs!

Imagine having the power to create your own URL shortening service, hosted right on your own domain, complete with every feature you could possibly desire. And the best part? It’s free, open-source, and infinitely customizable. So gear up, because we’re about to transform your domain into a sleek, efficient, URL-shortening powerhouse!

The Problem with Long URLs

Before we dive into the solution, let’s talk about why long URLs are such a headache. Not only do they look messy, but they can also be problematic when sharing links on social media, in emails, or on printed materials. Long URLs can break when sent via text message, and they’re nearly impossible to remember. They can also be a security risk, revealing sensitive query parameters. In a digital age where brevity and aesthetics matter, shortening your URLs isn’t just convenient—it’s essential.

Meet YOURLS: Your URL Shortening Hero

Enter YOURLS (Your Own URL Shortener), an open-source project that hands you the keys to your own URL kingdom. YOURLS lets you run your very own URL shortening service on your domain, giving you full control over your links and data. No more relying on third-party services that might go down, change their terms, or plaster your links with ads. With YOURLS, you’re in the driver’s seat.

Why YOURLS Should Be Your Go-To URL Shortener

YOURLS isn’t just another URL shortening tool—it’s a game-changer. Here’s why:

• Full Control Over Your Data: Since YOURLS is self-hosted, you own all your data. No more worrying about data privacy or third-party data breaches.
• Customizable Links: Create custom short URLs that match your branding, making your links not only shorter but also more professional and trustworthy.
• Powerful Analytics: Get detailed insights into your link performance with historical click data, visitor geo-location, referrer tracking, and more. Understanding your audience has never been easier.
• Developer-Friendly API: Automate your link management with YOURLS’s robust API, allowing you to integrate URL shortening into your applications seamlessly.
• Extensible Through Plugins: With a rich plugin architecture, you can enhance YOURLS with additional features like spam protection, social sharing, and advanced analytics. Tailor the tool to fit your exact needs.

How YOURLS Stacks Up Against Other URL Shorteners

While YOURLS offers a fantastic solution, it’s worth considering how it compares to other popular URL shorteners out there.

• Bitly: One of the most well-known services, Bitly offers a free plan with basic features and paid plans for advanced analytics and custom domains. However, you’re dependent on a third-party service, and your data resides on their servers.
• TinyURL: A simple, no-frills URL shortener that’s been around for ages. It doesn’t offer analytics or customization options, making it less suitable for professional use.
• Rebrandly: Focused on custom-branded links, Rebrandly offers advanced features but comes with a price tag. Again, your data is stored externally.
• Short.io: Allows custom domains and offers analytics, but the free tier is limited, and you’ll need to pay for more advanced features.

Why Choose YOURLS Over the Others?

• Cost-Effective: YOURLS is free and open-source. No subscription fees or hidden costs.
• Privacy and Security: Since you host it yourself, you have complete control over your data’s privacy and security.
• Unlimited Customization: Modify and extend YOURLS to your heart’s content without any limitations imposed by third-party services.
• Community Support: As an open-source project, YOURLS has a vibrant community that contributes plugins, support, and enhancements.

Getting Started with YOURLS

Now that you’re sold on YOURLS, let’s dive into how you can set it up and start conquering those unwieldy URLs.

Step 1: Setting Up YOURLS with Docker Compose

To make the installation process smooth and straightforward, we’ll use Docker Compose. This method ensures that all the necessary components are configured correctly and allows for easy management of your YOURLS instance. If you’re new to Docker, don’t worry—it’s simpler than you might think, and it’s a valuable tool to add to your arsenal.

Creating the docker-compose.yml File

The docker-compose.yml file orchestrates the services required for YOURLS to run. Here’s the template you’ll use:

services:
  yourls:
    image: yourls:latest
    container_name: yourls
    ports:
      - "8081:80" # YOURLS accessible at http://localhost:8081
    environment:
      - YOURLS_SITE=https://yourdomain.com
      - YOURLS_DB_HOST=mysql-yourls
      - YOURLS_DB_USER=${YOURLS_DB_USER}
      - YOURLS_DB_PASS=${YOURLS_DB_PASS}
      - YOURLS_DB_NAME=yourls_db
      - YOURLS_USER=${YOURLS_USER}
      - YOURLS_PASS=${YOURLS_PASS}
    depends_on:
      - mysql-yourls
    volumes:
      - ./yourls_data:/var/www/html/user # Persist YOURLS data
    networks:
      - yourls-network

  mysql-yourls:
    image: mysql:latest
    container_name: mysql-yourls
    environment:
      - MYSQL_ROOT_PASSWORD=${MYSQL_ROOT_PASSWORD}
      - MYSQL_DATABASE=yourls_db
      - MYSQL_USER=${YOURLS_DB_USER}
      - MYSQL_PASSWORD=${YOURLS_DB_PASS}
    volumes:
      - ./mysql_data:/var/lib/mysql # Persist MySQL data
    networks:
      - yourls-network

networks:
  yourls-network:
    driver: bridge

Let’s break down what’s happening in this file:

• Services:
• yourls: This is the YOURLS application container. It exposes port 8081 and connects to the MySQL database.
• mysql-yourls: The MySQL database container that stores all your URL data.
• Environment Variables: These variables configure your YOURLS and MySQL instances. We’ll store sensitive information in a separate .env file for security.
• Volumes: Mounts directories on your host machine to persist data even when the containers are recreated.
• Networks: Defines a bridge network for the services to communicate securely.

Step 2: Securing Your Credentials with an .env File

To keep your sensitive information safe, we’ll use an .env file to store environment variables. Create a file named .env in the same directory as your docker-compose.yml file and add the following:

YOURLS_DB_USER=yourls_db_user
YOURLS_DB_PASS=yourls_db_password
YOURLS_USER=admin_username
YOURLS_PASS=admin_password
MYSQL_ROOT_PASSWORD=your_mysql_root_password

Pro Tip: Generate strong passwords using the command openssl rand -base64 32. Security is paramount when running web services.

Step 3: Launching YOURLS

With your configuration files in place, you’re ready to bring your YOURLS instance to life. Run the following command in your terminal:

docker compose up -d

This command tells Docker Compose to start your services in the background (-d for detached mode). Once the containers are up and running, you can access the YOURLS admin interface by navigating to http://yourdomain.com:8081/admin in your web browser. Log in using the credentials you specified in your .env file, and follow the setup wizard to complete the installation.

Step 4: Securing Your YOURLS Installation with SSL

Security should never be an afterthought. Protecting your YOURLS installation with SSL encryption ensures that data transmitted between your users and your server remains private.

Using Let’s Encrypt for Free SSL Certificates

• Install Certbot: The Let’s Encrypt client that automates certificate issuance.
• Obtain a Certificate: Run certbot with appropriate options to get your SSL certificate.
• Configure Your Reverse Proxy: Set up Nginx or Caddy to handle SSL termination.

My Personal Setup

I use Nginx Proxy Manager in conjunction with an Origin CA certificate from Cloudflare. This setup provides a user-friendly interface for managing SSL certificates and reverse proxy configurations. For some info on Nginx Proxy Manager check out my other post!

Using the YOURLS API to Automate Your Workflow

One of YOURLS’s standout features is its robust API, which allows you to integrate URL shortening into your applications, scripts, or websites. Automate link generation, expansion, and statistics retrieval without manual intervention.

Examples of Using the YOURLS API with Bash Scripts

Shortening a URL

#!/bin/bash

YOURLS_API="https://yourpage.com/yourls-api.php"
API_SIGNATURE="SECRET_SIGNATURE"

# Function to shorten a URL
shorten_url() {
local long_url="$1"
  echo "Shortening URL: $long_url"
  curl -X GET "${YOURLS_API}?signature=${API_SIGNATURE}&action=shorturl&format=json&url=${long_url}"
echo -e "\n"
}

shorten_url "https://example.com"

Expanding a Short URL

#!/bin/bash

YOURLS_API="https://yourpage.com/yourls-api.php"
API_SIGNATURE="SECRET_SIGNATURE"

# Function to expand a short URL
expand_url() {
local short_url="$1"
  echo "Expanding short URL: $short_url"
  curl -X GET "${YOURLS_API}?signature=${API_SIGNATURE}&action=expand&format=json&shorturl=${short_url}"
echo -e "\n"
}

expand_url "https://yourpage.com/2"

Retrieving URL Statistics

#!/bin/bash

YOURLS_API="https://yourpage.com/yourls-api.php"
API_SIGNATURE="SECRET_SIGNATURE"

# Function to get URL statistics
get_url_stats() {
local short_url="$1"
  echo "Getting statistics for: $short_url"
  curl -X GET "${YOURLS_API}?signature=${API_SIGNATURE}&action=url-stats&format=json&shorturl=${short_url}"
echo -e "\n"
}

get_url_stats "https://yourpage.com/2"

Creating Short URLs with Custom Keywords

#!/bin/bash

YOURLS_API="https://yourpage.com/yourls-api.php"
API_SIGNATURE="SECRET_SIGNATURE"

# Function to shorten a URL with a custom keyword
shorten_url_custom_keyword() {
local long_url="$1"
  local keyword="$2"
  echo "Shortening URL: $long_url with custom keyword: $keyword"
  curl -X GET "${YOURLS_API}?signature=${API_SIGNATURE}&action=shorturl&format=json&url=${long_url}&keyword=${keyword}"
echo -e "\n"
}

shorten_url_custom_keyword "https://example.com" "customkeyword"

Integrating YOURLS API in Other Languages

While bash scripts are handy, you might prefer to use the YOURLS API with languages like Python, JavaScript, or PHP. There are libraries and examples available in various programming languages, making integration straightforward regardless of your tech stack.

Supercharging YOURLS with Plugins

YOURLS’s plugin architecture allows you to extend its functionality to meet your specific needs. Here are some popular plugins to consider:

• Spam and Abuse Protection
• reCAPTCHA: Adds Google reCAPTCHA to your public interface to prevent bots.
• Akismet: Uses the Akismet service to filter out spam URLs.
• Advanced Analytics
• Clicks Counter: Provides detailed click statistics and visualizations.
• GeoIP Tracking: Adds geographical data to your click analytics.
• Social Media Integration
• Share via Twitter: Adds a button to share your short links directly on Twitter.
• Facebook Open Graph: Ensures your short links display correctly on Facebook.
• Custom URL Keywords and Patterns
• Random Keyword Generator: Creates more secure and hard-to-guess short URLs.
• Reserved Keywords: Allows you to reserve certain keywords for special purposes.

You can find a comprehensive list of plugins in the YOURLS Plugin Repository. Installing plugins is as simple as placing them in the user/plugins directory and activating them through the admin interface.

Alternative Self-Hosted URL Shorteners

While YOURLS is a fantastic option, it’s not the only self-hosted URL shortener available. Here are a few alternatives you might consider:

• Polr: An open-source, minimalist URL shortener with a modern interface. Offers a robust API and can be customized with themes.
• Kutt: A free and open-source URL shortener with advanced features like custom domains, password-protected links, and detailed statistics.
• Shlink: A self-hosted URL shortener that provides detailed analytics, QR codes, and REST APIs.

Each of these alternatives has its own set of features and advantages. Depending on your specific needs, one of them might be a better fit for your project. Based on my experience, YOURLS is by far the easiest and simplest option. I tried the others as well but ultimately chose it.

Conclusion: Take Back Control of Your URLs Today

Long URLs have overstayed their welcome, and it’s time to show them the door. With YOURLS, you have the tools to not only shorten your links but to own and control every aspect of them. No more compromises, no more third-party dependencies—just pure, unadulterated control over your online presence.

So what are you waiting for? Join the revolution against long URLs, set up your YOURLS instance, and start sharing sleek, professional, and memorable links today!

In the fast-paced world of software development, flexibility and efficiency are paramount. Enter code-server, an innovative tool that allows you to run Visual Studio Code (VS Code) in your browser, bringing a seamless and consistent development environment to any device, anywhere.

Whether you’re working on a powerful desktop, a modest laptop, or even a tablet (pls don’t!), code-server ensures you have access to your development environment at all times. Here’s an in-depth look at what makes code-server a game-changer.

What is code-server ?

code-server is an open-source project that enables you to run VS Code on a remote server and access it via your web browser. This means you can:

• Work on any device with an internet connection.

• Leverage the power of cloud servers to handle resource-intensive tasks.

• Maintain a consistent development environment across devices.

With over 69.2k stars on GitHub, code-server has gained significant traction among developers, teams, and organizations looking for efficient remote development solutions.

Why would you use code-server ?

1. Flexibility Across Devices

Imagine coding on your laptop, switching to a tablet, or even a Chromebook, without missing a beat. With code-server, your development environment follows you wherever you go—seamlessly.

2. Offloading Performance to the Server

Running resource-intensive tasks on a server instead of your local machine? Yes, please! Whether you’re working on complex builds or handling large datasets, code-server takes the heavy lifting off your device and onto the server.

3. Bringing Your Dev Environment Closer to LLMs

With the rise of large language models (LLMs), working near powerful servers hosting these models has become a necessity. No more downloading terabytes of data just to test integrations locally. Code-server simplifies this by placing your environment right where the action is.

4. Because I Can! 🥳

As a coder and IT enthusiast, sometimes the best reason is simply: Because I can! Sure, you could run local VSCode with “Remote Development” extensions or install it directly on a Chromebook—but where’s the fun in that? 😉

5. Streamlined Backup and File Management

One of my favorite aspects? Developing directly on a remote system where my regular backup processes already take care of everything. No extra steps, no worries—just peace of mind knowing my work is secure.

I just did it to do it, I use code-server to manage all my Proxmox scrips and develop little Sysadmin tools. You also get a nice web shell.

Installation

Requirements

Before diving in, make sure your system meets the minimum requirements:

• Linux machine with WebSockets enabled. (this is important to know when you use a reverse proxy)

• At least 1 GB RAM and 2 vCPUs.

I think you can get away with 1 CPU, mine is bored most of the time, obviously running resource intensive code will eat more.

Check out the full requirements here.

Installation

There are multiple ways to get started with code-server, but I choose the easiest one:

curl -fsSL https://code-server.dev/install.sh | sh

This script ensures code-server is installed correctly and even provides instructions for starting it. Never run script like this from the internet before checking it.

Configuration

After installation, you can customize code-server for your needs. Explore the setup and configuration guide to tweak settings, enable authentication, and enhance your workflow.

nano ~/.config/code-server/config.yaml

That is where you will find the password to access code-server and you can also change the port:

bind-addr: 127.0.0.1:8080
password: 5f89a538c9c849b439d0f866
cert: false

You can disable auth by commenting out password. Personally I use SSO through Authentik for authentication.

Now you have an awesome way to code in your browser:

Resources

• GitHub Repository

• Setup Guide

• Frequently Asked Questions