lemmy-ui-next

Alternative frontend for Lemmy. Built with Next.js.

Discussions & announcements: !lemmy_ui_next@lemm.ee

Screenshots (desktop & mobile)

Goals

• Drop-in replacement for lemmy-ui
• Minimalistic design, following in the footsteps of other timeless link aggregator UIs
• Fast!
• Super basic NextJS architecture, taking advantage of features like the app router & server actions

Motivation

The original lemmy-ui has been extremely important for the growth of Lemmy, and the new lemmy-ui-leptos also looks quite interesting. One issue with both of these is that they are built using quite obscure technologies (Inferno and Leptos).

This project was created as an alternative for contributors who are already familiar with NextJs and want to use those skills on Lemmy. The beauty of open source is that anybody can build what they want, and all these alternative projects can happily coexist!

Current status

The project is in its initial setup phase and not open to PRs yet. PRs will be welcome once the basic structure is in place and there is at least one staging environment running the code.

Running

Prerequisites: You only need nodejs. Check the .nvmrc file in this repo to find out the exact version we are developing against. Optionally, you can use nvm to automate downloading & setting up the correct nodejs version for you (it automatically checks the .nvmrc file and sets everything up for you).

Locally

# Install dependencies
npm i
# Configure Lemmy backend
echo "LEMMY_BACKEND=https://lemm.ee" > .env.local
# Start dev server with hot-reload
npm run dev

Open http://localhost:3000 with your browser to see the result.

In production

# Install deps
npm ci --omit=dev --ignore-scripts
# Build
npm run build
# Start
LEMMY_BACKEND=https://<your lemmy api> LEMMY_UI_NEXT_PUBLIC_URL=https://<url where this frontend is accessible> npm run start

At this point, you will have lemmy-ui-next listening on 0.0.0.0:3000, and you can point your nginx or any other reverse proxy at it. You can improve performance at least a little by pointing lemmy-ui-next directly at your Lemmy backend process. For example, if running on the same host, you can use something like LEMMY_BACKEND=https://localhost:8536.

Sample systemd service file will be coming soon. It's on the to-do list 😅. Alternatively, a sample Dockerfile is provided.