Skip to content
This repository has been archived by the owner on Mar 19, 2024. It is now read-only.
/ rapide Public archive

WIP! do not use just yet - Opinionated Vite + Alpine.js starter PWA template

License

Notifications You must be signed in to change notification settings

rehhouari/rapide

Repository files navigation

Rapide (fast) ⚡ 🏔️ 🌲

Opinionated Alpine.js starter template, with file based routing, PWA, components auto-loading, and more!

Mock up Rapide (fast) Alpine.js web apps.


Live Demo


NOTICE:

Update: check out astro.build instead!

it works but you need to make some changes:

it have potential, or had. it came make spinning up a web app with alpine v2 really quick but there are some problems. i tried documeting everything but the vite plugin isn't documented.

I don't think anyone would bother but if you're bored feel free, I'll try to accept pull requests too, and it's MIT so you can fork all parts i made (router, i18n, vite plugin) and make a better template. good luck and sorry.

Features


Pre-packed

UI Frameworks

Icons

Plugins

Coding Style

Dev tools

Try it now!

GitHub Template

Create a repo from this template on GitHub.

Clone to local

If you prefer to do it manually with the cleaner git history

npx degit rehhouari/rapide my-rapide-app
cd my-rapide-app
pnpm i # If you don't have pnpm installed, run: npm install -g pnpm

Checklist

When you use this template, try to follow this checklist to update your info properly

  • Rename name field in package.json
  • Change the author name in LICENSE
  • Change the title in index.html
  • Change the icons in public/images/icons
  • Remove the .github folder which contains the funding info
  • Clean up the READMEs and remove routes & handlers

And, enjoy :)

Usage

Development

Just run and visit http://localhost:3000

pnpm dev

Build

To build the App, run

pnpm build

And you will see the generated file in dist that ready to be served (test it with pnpm serve).

Deploy on Netlify

Go to Netlify and select your clone, OK along the way, and your App will be live in a minute.

Same for Vercel.

Why

This template is heavily inspired by and based on @antfu's Vitesse for Vue. I wanted to bring a similar development experience to Alpine.js and show how it can be used to make web apps as well and not just as a JQuery alternative. So I been building plugins for Alpine.js & Vite to bridge the gap that made it difficult to accomplish that.

Before I found Vitesse, I've based this on @ryangjchandler's experiment on code organization. When I saw it I felt it has potential, and I wanted to make it more accessible. hopefully I did now.