A scaffolding tool for creating full-stack Gleam applications with Lustre, featuring client-server hydration.
- π Full-stack Gleam/Lustre application setup
- π Client-server hydration out of the box
- β¨ Optimistic UI updates using the
optimistpackage - π¦ Separate client, server, and shared modules
- β‘ Vite for fast client-side development
- π§ͺ Test setup for all modules
npm create gleam-lustre-fullstack@latestnpx create-gleam-lustre-fullstack@latestpnpm create gleam-lustre-fullstack@latestyarn create gleam-lustre-fullstackThe scaffolded project includes:
-
Client: Lustre frontend application with Vite
- Hot module replacement
- TypeScript declarations
- CSS styling
- Optimistic UI updates for better UX
-
Server: Gleam backend server
- Static file serving
- API endpoints ready
-
Shared: Common code between client and server
- Shared types and logic
- Reusable utilities
your-project/
βββ client/
β βββ src/
β β βββ {name}_client.gleam
β β βββ main.js
β β βββ main.css
β βββ test/
β βββ gleam.toml
β βββ package.json
β βββ vite.config.js
βββ server/
β βββ src/
β β βββ {name}_server.gleam
β β βββ manifest.gleam
β βββ test/
β βββ priv/
β βββ gleam.toml
βββ shared/
βββ src/
β βββ shared.gleam
βββ test/
βββ gleam.toml
After scaffolding your project:
cd your-project
# Start development servers
# Terminal 1 - Start the client dev server
cd client && npm install && npm run dev
# Terminal 2 - Start the server
cd server && gleam run
# Or build for production
cd client && npm install && npm run build
cd server && gleam run- Gleam installed
- Node.js 16+ and npm
- Erlang/OTP 23+ (for Gleam)
- Inspired by create-gleam by Enderchief
- Based on a simplified version of the Lustre Full-Stack Applications Guide example
MIT
Contributions are welcome! Please feel free to submit a Pull Request.
If you find any bugs or have feature requests, please file an issue on the GitHub repository.