Experiment writing a fullstack application in Gleam
Find a file
2025-12-31 16:05:24 -05:00
.continue/rules rename testing rules 2025-12-26 15:17:47 -05:00
.github/workflows write tests for shared library, add birdie snapshots, update rules, update github workflow 2025-12-26 00:14:24 -05:00
client add simple CSS file for styling, add Just commands to manage running the application, update readmes 2025-12-31 16:05:24 -05:00
server add simple CSS file for styling, add Just commands to manage running the application, update readmes 2025-12-31 16:05:24 -05:00
shared add simple CSS file for styling, add Just commands to manage running the application, update readmes 2025-12-31 16:05:24 -05:00
.dockerignore add simple CSS file for styling, add Just commands to manage running the application, update readmes 2025-12-31 16:05:24 -05:00
.gitignore add continue dev agent rules, write tests for server 2025-12-25 23:49:34 -05:00
.tool-versions add simple CSS file for styling, add Just commands to manage running the application, update readmes 2025-12-31 16:05:24 -05:00
Dockerfile add docker container for deployment, update readme 2025-12-26 00:53:00 -05:00
justfile add simple CSS file for styling, add Just commands to manage running the application, update readmes 2025-12-31 16:05:24 -05:00
README.md add simple CSS file for styling, add Just commands to manage running the application, update readmes 2025-12-31 16:05:24 -05:00

Fullstack Gleam

  1. client/: Contains all client-side code written in Gleam that compiles to JavaScript.

    • src/main.gleam: The entry point for the client application
    • Other modules contain UI components, state management, and client logic
    • Uses the Lustre framework for Elm-like components with reactive state management
  2. server/: Contains server-side code written in Gleam that compiles to Erlang.

    • src/main.gleam: The entry point for the server application
    • Other modules contain API endpoints, business logic, and database interactions
    • Uses Wisp/Mist for routing and API handling
  3. shared/: Contains code shared between client and server.

    • Typically includes type definitions, utility functions, and constants
    • Ensures consistent data structures across both environments

Dependencies

Install asdf, and add the erlang, gleam, and just plugins. Then run the following in the root of this repository:

asdf install

Development

You can build the client code and run the fullstack development environment with the following:

just dev-server

Gleam doesn't officially support Erlang's hot code reloading, so you'll need to stop and restart the server for any changes made in the client/server/shared code.

However, if you're only iterating over client-side code, you can run it standalone with lustre_dev_tools's hot code reloading with the following:

just dev-client

There won't be hot code reloading for your server/shared code. and won't be served by your server project.

Running Tests

just test-all

Check the test folder in server/client/shared to see how to write tests for each one.

Deployment

just deploy

Then follow Lustre's Full Stack Deployments Guide.