TODO - LEPTOS

Introduction

This is a simple Todo app, as POC for an Leptos (WASM) application-

The application contains the basic CRUD elements including the create/update handled by a modal window. The application uses the Signal features currently from the nightly build version for an better development experience.

As bonus, the POC uses Tailwind to prettify the application. Trunk includes the Tailwind engine, so no need to install the JavaScript or Standalone version. Also available a small article from my part in French: https://www.sfeir.dev/front/explorer-linnovation-rust-et-webassembly/

Tools

• https://www.rust-lang.org/ (nightly build)

• https://trunkrs.dev/

Commands

Start the service with live reload for development:

trunk serve --open --port=8080

Build a release candidate (artifacts in /dist)

trunk build --release

or for GitHub

trunk build --release --public-url "/todo-leptos"

Running application

The application is deployed on GitHub Pages.

Playwright

Prerequisites

Node.js 18+ (recommended LTS) and npm

Quick start

0) Install Node dependencies (first time only; optional because test scripts will auto-install) - npm install

1) Install browsers and ensure deps are installed - npm run pw:install

2) Run tests (headless by default) - npm run test:e2e

3) Run headed (see the browser) - npm run test:e2e:headed

4) Explore last HTML report - npm run test:e2e:report

Next steps

How to continue, perhaps have a look on one of these:

• Router

• Serverside rendering

• Leptos, Islands

• …​