ReactFlux

ReactFlux

Read in other languages: Deutsch, Español, Français, 日本語, 简体中文

Overview

ReactFlux is a third-party web frontend for Miniflux, aimed at providing a more user-friendly reading experience.

Supported Miniflux versions: 2.3.2 and higher.

Key features include:

• Modern interface design
• Responsive layout with touch gestures, long-press context menus, and collapsible navigation
• Support for dark mode and custom themes
• Customizable reading experience:
  • Column, list, and card layouts with configurable covers and summaries
  • Font family and size settings
  • Article width adjustment
  • Title alignment options
  • Image viewer with zoom, fullscreen, and image navigation
  • Article attachments with image previews and audio/video playback
  • Footnotes enhancement
  • Code syntax highlighting
  • Estimated reading time
  • Configurable browsing direction and source-link behavior
• Article and feed management:
  • Miniflux full-text search with phrases, OR, and exclusions
  • Filter articles by read status and publish date
  • Batch operations for feeds
  • Per-account homepages targeting built-in views, categories, or feeds
  • Full-text fetching support
  • De-duplicate articles by hash, title, or URL
  • Auto mark articles as read while scrolling
• Advanced features:
  • Keyboard shortcuts (customizable)
  • Settings backup import and export
  • Batch update the host of filtered subscription URLs (useful for replacing RSSHub instances)
  • Batch refresh errored subscriptions
  • Save articles to third-party services
• I18n supports (Deutsch / English / Español / Français / 日本語 / 简体中文)
• Other features waiting for you to discover...

Online Demo & Screenshots

Try ReactFlux with our online demo instance.

See how ReactFlux looks in different themes:

Quick Start

1. Ensure you have a working Miniflux instance
2. Directly use our online demo instance or deploy ReactFlux using one of the methods below
3. Log in using your Miniflux username and password or API key (recommended)

Deployment

Cloudflare Pages

ReactFlux is built with React and generates a set of static web files after building, which can be directly deployed on Cloudflare Pages.

You can deploy it on Cloudflare Pages by selecting Framework preset as Create React App.

Using Pre-built Files

You can download the pre-built files from the gh-pages branch and deploy them to any static hosting service that supports single-page applications (SPA).

The files in gh-pages are built for this repository's GitHub Pages path (/ReactFlux/). If your deployment uses a different path, build from source with VITE_BASE_PATH as described below.

Make sure to configure URL rewriting to redirect all requests to index.html.

If you are deploying using Nginx, you might need to add the following configuration:

location / {
    try_files $uri $uri/ /index.html;
}

Or using Caddy, you might need to add the following configuration:

try_files {path} {path}/ /index.html

Deploying Under a Subpath

The public path is embedded in the frontend bundle at build time, so changing it requires a rebuild. Set VITE_BASE_PATH to / or to an absolute path that starts and ends with /. Path segments may contain ASCII letters, numbers, ., _, ~, and -:

VITE_BASE_PATH=/reactflux/ pnpm run build

Make the contents of build available at the same URL path and route SPA deep links to that path's index.html. For example, if the files are stored in /srv/reactflux, Caddy can serve them with:

root * /srv
try_files {path} {path}/ /reactflux/index.html
file_server

The Docker image can be built for the same path; its bundled Caddy configuration places and serves the files automatically:

docker build --build-arg VITE_BASE_PATH=/reactflux/ -t reactflux:subpath .
docker run -p 2000:2000 reactflux:subpath
# Open http://localhost:2000/reactflux/

A reverse proxy must preserve the configured prefix.

Vercel

Docker

docker run -p 2000:2000 electh/reactflux

Or using Docker Compose:

docker-compose up -d

Translation Guide

To help us translate ReactFlux into your language, please contribute to the locales folder and send a pull request.

Additionally, you need to add a README file for the respective language and reference it in all existing README files.

You should also modify parts of the source code to include the i18n language packages for Arco Design and Day.js.

For detailed changes, please refer to the modifications in PR #145.

Current Translators

Language	Translator
Deutsch	DonkeeeyKong
Español	Victorhck
Français	MickGe
日本語	hogehige
简体中文	Neko Aria

Contributors

Thanks to all the contributors who have made this project more awesome!

Made with contrib.rocks.

Star History