/free-the-web-apps

Turn any website into an app in seconds!

Primary LanguageVueGNU General Public License v3.0GPL-3.0

FTWA Screenshot

Free The Web Apps

FTWA is an utility to free your web apps from their browser's frame. So you don't need to wait for Arc Browser on Linux to have great looking webapps!

  • Native Feel. Don't wait for native desktop apps, most frontend developpers already did an amazing job.
  • Quick Access. Find your apps in the App Launcher, Rofi, Wofi, dmenu, Spotlight and more.
  • Support Extentions. Apps keep browser data: cookies, storage, extentions, ...
  • App Gallery. Discover dozen of web apps that work especially well in a frameless browser.

Apps Gallery • How it works • Suggest an app

Note

Feel free to contribute and suggest apps you find useful!

How it works

Chromium browsers

FTWA uses the --app='https://app.example' parameter with Chromium-based browsers to launch a website in "app mode". Similar to kiosk-mode, this mode launches the website without the typical browser interface, such as tabs, the address bar, or navigation buttons, making the website look and feel more like a standalone application.

Firefox

Previously the --ssb parameter (Site Specific Browser) provided similar behavior as --app in chrome, but it was discontinued in 2021. FTWA create a new firefox profile with custom CSS and settings, inspired by this reddit comment.

On linux

When choosing linux as target OS, FTWA generate a shell script that will create a .desktop file and it's icons.

On Windows

TODO: Not implemented yet. But will use shortcuts.

On Macos

Creating a .app folder in /Applications containing an icon (.icns) and a bash script that run the browser command.

How to install an app

  1. Make sure to select your environment options.

    settings

  2. Either create your own app or click the copy icon on any app from the gallery.

  3. Paste the code in your terminal of choice.

    • It's good practice to check a script content before running it.
    • Example: 
      sh -ec "$(curl -fsSL 'https://ftwa.mathix.dev/v/excalidraw?os=linux&bw=chrome&path=%2Fusr%2Fbin%2Fgoogle-chrome-stable')"
      Just curl the link or open it in a browser to see the script content. 
      curl -fsSL 'https://ftwa.mathix.dev/v/excalidraw?os=linux&bw=chrome&path=%2Fusr%2Fbin%2Fgoogle-chrome-stable'

Currently this will only work if you have a chromium browser installed. If you're not using google-chrome make sure to either edit the .desktop file to point to your executable, or make /usr/bin/google-chrome an alias to your chromium browser.

What to expect using swayfx

Using swayfx as window manager (corner_radius: 12, blur_radius: 5)

  • Chrome, Todo Mate, YT Music (My current every-day setup) image

  • YouTube Music, Todo Mate, Notion image

  • YouTube Music image

  • Notion, Cron Notion Calendar image

Ressources to find logos

Web Dev

Look at Nuxt docs, Nuxt UI, Nuxt Hub and Tailwind UI to learn more.

Setup

Make sure to install the dependencies:

bun install

Development Server

Start the development server on http://localhost:3000:

bun run dev
# or
bun run dev --host

Production

Build the application for production:

bun run build

Locally preview production build:

bun run preview

Check out the deployment documentation for more information.