Nx Starter App

✨ This workspace has been generated by Nx, a Smart, fast and extensible build system. ✨

It is preconfigured to use the following tech stack:

1. Vite - is a modern front-end build tool providing instant server start with on-demand file serving over native ESM and no bundling required, lightning-fast hot module replacement (HMR) that maintains speed regardless of app size, rich features including out-of-the-box support for TypeScript, JSX, CSS, and more.
2. MUI v5.x - is an open-source React component library that implements Google's Material Design providing comprehensive collection of prebuilt components out of the box. This demo application also comes with a SeaportOPX customized theme.
3. MobX v6.x - for state management.
4. React IoC - a very small heirarchical dependency injection library for React
5. React Router v6.x - a bare-bones routing example is presented in the application which allows for protected routes.
6. Echarts for React - React wrapper for Echarts

Installation

Make sure to use node version 18 or later. Also pnpm is favored over npm.

Install pnpm

npm install --global pnpm

Install Nx cli

npm install --global nx@latest

Install VS Code Nx Console extension

Visit Visual Studio marketplace and install the Nx Console UI extension.

Clone the repository

git clone https://github.com/DHI/nx-starter-app.git <project_name>

cd <project_name>

pnpm install

Development server

Run nx serve rename-me for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Understand this workspace

Run nx graph to see a diagram of the dependencies of the projects.

Further help

Visit the Nx Documentation to learn more.

In particular, read through the React Standalone Tutorial (parts 1 & 2) for a brief tutorial.

Useful Nx links

Nx Youtube channel videos including React Standalone Applications with Nx