Skip to content

Latest commit

 

History

History

frontend

Frontend using React in Next.js and Tauri

The UI Frontend of YAMS is implemented as a TypeScript React App shipped with Next.js. It may be started as a web application, but may also be shipped as standalone desktop application with Tauri.

Web Application

The web application uses a centralized remote data storage. It runs in the browser and can be accessed from any device with a web browser.

Prerequisites

Preparation

Run npm install when interacting with the project for the first time to download all dependencies.

Development

To run the web application in development mode with hot reloading run:

npm run dev

Open http://localhost:3000 and make sure the data storage is up and running locally on your machine as described in the backend README.

Deployment

To deploy the application in production mode run the following commands:

  • npm run build to build the application
  • npm run start -p 8080 to serve the application on port 8080

The port can be changed accordingly.

Also make sure that the configured data storage is installed and running as described in the backend README.

Usage

Open http://localhost:8080 to access the running application locally.
To access it on other devices, open http://<hostname>:8080.

Desktop Application

The desktop application is a bundle of the web application with native capabilities and an embedded SurrealDB data storage, which is used by default, using Tauri. Although it is still possible to connect to a remote data storage.

Prerequisites

  • Installed Rust (recommended tool: Rustup)
  • Tauri Prerequisites for your system
  • patch program in your $PATH environment variable
  • Installed clang for Rust bindgen
  • Installed tauri-cli using cargo install tauri-cli

Development

To start the app in development mode with hot reloading run:

cargo tauri dev

This will start the web application and opens a Tauri window to display it.

It is recommended to export a YAMS_DEV=1 environment variable in order to start the app in development mode. This makes the app use paths optimized for the development process.

Building

To build the app for distribution and production run following command:

cargo tauri build

This bundles everything into a single distributable binary for your host system. The bundles can be found under src-tauri/target/release/bundle/.

Usage

The configuration file can be found under the current OS's standard config path and is named yamsconfig.json. It can be used to specify a remote database connection to use, even in the local desktop app. It may for example look like this:

{
  "remoteDatabaseLocation": "http://127.0.0.1:8004/rpc"
}

If configured to use a centralized data storage, also make sure that this storage is set up as described in the backend README.