create-gleam-lustre-fullstack
Version:
Scaffold a fullstack Gleam/Lustre app with client-server hydration
126 lines (90 loc) โข 2.78 kB
Markdown
# create-gleam-lustre-fullstack
A scaffolding tool for creating full-stack Gleam applications with Lustre, featuring client-server hydration.
## Features
- ๐ Full-stack Gleam/Lustre application setup
- ๐ Client-server hydration out of the box
- โจ Optimistic UI updates using the `optimist` package
- ๐ฆ Separate client, server, and shared modules
- โก Vite for fast client-side development
- ๐งช Test setup for all modules
## Usage
### Using npm create (recommended)
```bash
npm create gleam-lustre-fullstack@latest
```
### Using npx
```bash
npx create-gleam-lustre-fullstack@latest
```
### Using pnpm
```bash
pnpm create gleam-lustre-fullstack@latest
```
### Using yarn
```bash
yarn create gleam-lustre-fullstack
```
## What's Included
The 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
## Project Structure
```
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
```
## Getting Started
After scaffolding your project:
```bash
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
```
## Requirements
- [Gleam](https://gleam.run/) installed
- [Node.js](https://nodejs.org/) 16+ and npm
- [Erlang/OTP](https://www.erlang.org/) 23+ (for Gleam)
## Credits
- Inspired by [create-gleam](https://github.com/Enderchief/create-gleam) by Enderchief
- Based on a simplified version of the [Lustre Full-Stack Applications Guide](https://hexdocs.pm/lustre/guide/06-full-stack-applications.html) example
## License
MIT
## Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
## Issues
If you find any bugs or have feature requests, please file an issue on the [GitHub repository](https://github.com/dvic/create-gleam-lustre-fullstack/issues).