Skip to content

Demonstrates how to use Rust as the single server and runtime needed to serve up a React Single Page Application (SPA) written in TypeScript backed by a Postgres database and meilisearch search service.

Notifications You must be signed in to change notification settings

siryancealot-enterprises/rust-react-app-hello-world

Repository files navigation

rust-react-app-hello-world

This demonstrates how to use Rust as the single server and runtime needed to serve up a React Single Page Application (SPA) written in TypeScript backed by a Postgres DB and meilisearch search service.

The SPA talks to APIs on the Rust server, which talks to the Postgres DB or Search service.

We do not use another server for serving the React app (such as Node.js), rather the single Rust server serves up the statically generated React application files to the requesting client. We still use Node to compile the React SPA and generate its static files.

Key technologies and libraries used:

  • Rust's Axum web application server framework
  • Postgres DB with Rust's sqlx toolkit for client interaction and other DB utilities
  • Meilisearch with its Rust SDK
  • Docker Desktop and Compose

Some best practices implemented:

  • Added Rust unit and integration tests for most Rust code
  • A basic GitHub workflow defined to start our core services, run tests, run Rust's formatter (rustfmt), and run Rust's linter (clippy)
  • Enforces the most strict linting and code formatting for Rust and TypeScript code configured in VSCode and GitHub Action workflow
  • Basic logging and tracing enabled
  • Proper environment variable support (with .toml config files in the .cargo directory)
  • Automated DB schema creation and upgrade script execution
  • Using Docker Desktop and Docker Compose (using the compose.yaml in the project's base directory) to easily automate the initalization and setup of the database and search services the application relies on. You can still roll your own Postgres and meilisearch local setup, but why?
  • VSCode launch configurations for running and debugging
  • And many more (i.e. db connection pooling, etc. etc.)

How to build

Requirements

The instructions below assume you have the following installed locally:

  1. Git (v2.39.3+)
  2. Rust (v1.80+)
  3. Node (v20.16.0+)
  4. Docker Desktop (v4.32+)
  5. VSCode (v1.90+ with "rust-analyzer" and "ESLint" extensions installed). This is optional, but highly recommended.

Note: Postgres and meilisearch will automatically be installed and initialized by our automated local build process using Docker Compose and a local environment initialization script.

See the Dev Environment Setup section for instructions on how to install any of the above.

Instructions

With those requirements fulfilled, see the Sync the Repo and Build the App section on how to build this project and run the app.

** Or QUICKSTART **

[ In a terminal ]

  1. git clone https://github.com/siryancealot-enterprises/rust-react-app-hello-world.git
  2. cd rust-react-app-hello-world
  3. cargo build
  4. cargo docker_up
  5. cargo init_repo
  6. cd my-react-ts-app
  7. npm install
  8. npm run build
  9. cd ..
  10. cargo run

[in your browser]

  1. http://127.0.0.1:3000

About

Demonstrates how to use Rust as the single server and runtime needed to serve up a React Single Page Application (SPA) written in TypeScript backed by a Postgres database and meilisearch search service.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published