🔗 LittleLink-Server

LittleLink is a lightweight DIY alternative to services like Linktree and many.link.

Inspired by littlelink.

👇 What is LittleLink-Server?

LittleLink-Server is based on the great work from littlelink, a lightweight DIY alternative to services like Linktree and many.link. LittleLink and LittleLink-Server is built using Skeleton, a dead simple, responsive boilerplate—we just stripped out some additional code you wouldn't need and added in branded styles for popular services. 😊

It takes the same simple approach to a link page and hosts it within a NodeJS server with React Server Side Rendering, containerized for you to use. Now, customizing LittleLink with littlelink-server is as easy as passing in some environment variables. If you need help configuring this, please see this video at explains everything and a live example at links.technotim.com.

⭐ Features

• Over 60+ brand buttons with more able to be requested
• Customisable Themes
• Analytics Support
• Health Check Support
• A fully customisable docker-compose

🚀 Getting Started

Check the docker-compose.yml file for all supported buttons and configuration!

The example below will generate a site exactly like

Using Docker-Compose

version: "3.0"
services:
  littlelink-server:
    image: ghcr.io/timothystewart6/littlelink-server:latest
    # dockerhub is also supported timothystewart6/littlelink-server
    # image: timothystewart6/littlelink-server:latest
    container_name: littlelink-server
    environment:
      - META_TITLE=Techno Tim
      - META_DESCRIPTION=Software Engineer | Gamer | Twitch Streamer | Content Creator on YouTube | Homelab | 🇺🇸 🇯🇵  | Full Nerd
      - META_AUTHOR=Techno Tim
      - META_KEYWORDS=HomeLab, HTML, CSS, Engineering
      - LANG=en
      - METAINDEXSTATUS=all
      - OGSITENAME=Techno Tim
      - OG_TITLE=Techno Tim
      - OG_DESCRIPTION=The home of Techno Tim
      - OG_URL=https://technotim.com
      - OGIMAGE=https://pbs.twimg.com/profileimages/1286144221217316864/qIAsKOpB_400x400.jpg
      - OGIMAGEWIDTH=400
      - OGIMAGEHEIGHT=400
      - GATRACKINGID=G-XXXXXXXXXX
      - THEME=Dark
      - FAVICONURL=https://pbs.twimg.com/profileimages/1286144221217316864/qIAsKOpB_200x200.jpg
      - AVATARURL=https://pbs.twimg.com/profileimages/1286144221217316864/qIAsKOpB_200x200.jpg
      - AVATAR2XURL=https://pbs.twimg.com/profileimages/1286144221217316864/qIAsKOpB400x400.jpg
      - AVATAR_ALT=Techno Tim Profile Pic
      - NAME=TechnoTim
      - BIO=Software Engineer | Gamer | Twitch Streamer | Content Creator on YouTube | Homelab | 🇺🇸 🇯🇵 | Full Nerd
      # use ENV variable names for order, listed buttons will be boosted to the top
      - BUTTONORDER=YOUTUBE,TWITCH,TWITTER,GITHUB,INSTAGRAM,LINKEDIN,DISCORD,FACEBOOK,TIKTOK,PATREON,GEAR,DOCUMENTATION
      # you can render an unlimited amount of custom buttons by adding 
      # the CUSTOMBUTTON* variables and by using a comma as a separator.
      - CUSTOMBUTTONTEXT=Documentation,Recommended Gear
      - CUSTOMBUTTONURL=https://l.technotim.com/docs,https://l.technotim.com/gear
      - CUSTOMBUTTONCOLOR=#000000,#000000
      - CUSTOMBUTTONTEXT_COLOR=#ffffff,#ffffff
      - CUSTOMBUTTONALT_TEXT=Tech documentation site for my videos and more,Recommended Gear
      - CUSTOMBUTTONNAME=DOCUMENTATION,GEAR
      - CUSTOMBUTTONICON=fas file-alt,fas fa-cog
      - GITHUB=https://l.technotim.com/github
      - TWITTER=https://l.technotim.com/twitter
      - INSTAGRAM=https://l.technotim.com/instagram
      - LINKED_IN=https://l.technotim.com/linkedin
      - YOUTUBE=https://l.technotim.com/subscribe
      - TWITCH=https://l.technotim.com/twitch
      - DISCORD=https://l.technotim.com/discord
      - TIKTOK=https://l.technotim.com/tiktok
      - FACEBOOK=https://l.technotim.com/facebook
      - PATREON=https://l.technotim.com/patreon
      - FOOTER=Techno Tim © 2022
    ports:
      - 8080:3000
    restart: unless-stopped
    security_opt:
      - no-new-privileges:true

Using Docker

docker run -d \
  --name=littlelink-server \
  -p 8080:3000 \
  -e META_TITLE='Techno Tim' \
  -e META_DESCRIPTION='Techno Tim Link page' \
  -e META_AUTHOR='Techno Tim' \
  -e META_KEYWORDS='HomeLab, HTML, CSS, Engineering' \
  -e LANG=en \
  -e METAINDEXSTATUS='noindex' \
  -e THEME='Dark' \
  -e FAVIC \
  -e AVATARURL='https://pbs.twimg.com/profileimages/1286144221217316864/qIAsKOpB_200x200.jpg' \
  -e AVATAR2XURL='https://pbs.twimg.com/profileimages/1286144221217316864/qIAsKOpB400x400.jpg' \
  -e AVATAR_ALT='Techno Tim Profile Pic' \
  -e NAME='TechnoTim' \
  -e BIO='Software Engineer | Gamer | Twitch Streamer | Content Creator on YouTube | Homelab | 🇺🇸 🇯🇵 | Full Nerd' \
  -e GITHUB='https://l.technotim.com/github' \
  -e TWITTER='https://l.technotim.com/twitter' \
  -e INSTAGRAM='https://www.instagram.com/techno.tim' \
  -e LINKED_IN='https://l.technotim.com/linkedin' \
  -e YOUTUBE='https://l.technotim.com/subscribe' \
  -e TWITCH='https://l.technotim.com/twitch' \
  -e DISCORD='https://l.technotim.com/discord' \
  -e TIKTOK='https://l.technotim.com/discord' \
  -e KIT='https://l.technotim.com/gear' \
  -e FOOTER=Techno Tim © 2022 \
  --restart unless-stopped \
  ghcr.io/timothystewart6/littlelink-server:latest

Using Kubernetes

Unofficial helm chart provided by k8s-at-home

helm repo add k8s-at-home https://k8s-at-home.com/charts/
helm repo update
helm install littlelink-server \
  --set env.TZ="America/New York" \
  --set env.META_TITLE="TechnoTim"
    k8s-at-home/littlelink-server

Or use a values.yaml files

helm install littlelink-server k8s-at-home/littlelink-server -f values.yaml

🔧 Configuration

Analytics Support

Google Analytics

See Getting Started with Analytics. After getting your GA Tracking Id, use your tracking Id as environment variable like GATRACKING_ID=G-XXXXXXXXXX (See the example below)

All buttons clicked will be tracked automatically if GATRACKINGID exists.

Sample event for YouTube button.

window.gtag('event', 'youtube-button');

Umami

See Adding a website & Collecting data page to add and generate your tracking code.

Generated tracking code should look like:

Use data-website-id as environment variable UMAMIWEBSITEID. Take the initial root host of src as UMAMIAPPURL, and the name of the script (i.e. umami.js or script.js) as UMAMISCRIPTNAME.

Sample event for YouTube button.

window.umami.track('youtube-button');

Matomo

See Installing Matomo fo how to configure analytics and how to find your site id

Use MATOMOURL for your URL and MATOMOSITE_ID for your site id

Sample event for YouTube button.

window._paq.push(['trackEvent', 'youtube-button']]);

Health Check

A health check endpoint exists on /healthcheck. If healthy, it will return with a 200 and the following response:

{
  "status": "ok"
}

To skip express from logging these calls, add the environment variable:

SKIPHEALTHCHECK_LOGS=true