Mantis Todo Example

✨ This Nx workspace has been generated by Mantis, your passport to a seamless full-stack project launch. ✨

Getting started

1. Install dependencies

   • Run npm install to install all dependencies

2. (Optional) Create a remote mongo instance

   • You will need a remote mongo instance set up to deploy this project, but a local instance will be created for you for development if you set MONGODB_URI='local' in the .env.local file mentioned below.
   • If you don't already have a Mongo db instance you can use, follow the steps to set up an instance with MongoDB Atlas (it's free).

   1. Create a config file in apps/web-client called .env.local i.e. apps/web-client/.env.local.

   2. Place your mongo connection string in that file as the following environment variable

      # Example
      MONGODB_URI='mongodb+srv://<user>:<password>@<cluster-name>.mongodb.net/?retryWrites=true&w=majority'

To learn more about how Nx loads environment variables, see Definte Environment Variables

Start the web app

To start the development servers run npx nx run-many --target=serve --projects=web-client,mobile-client. Open your browser and navigate to http://localhost:4200/ to see the web app and http://localhost:4300/ for the mobile app. Happy coding!

Storybook

To start storybook for a client run npx nx run <client>:storybook.

For the web client, run npx nx run web-client:storybook, open your browser, and navigate to http://localhost:5200. For the mobile client, run npx nx run mobile-client:storybook, open your browser, and navigate to http://localhost:5300.

Testing

To run all of the unit tests, run npx nx run-many --all --target=test.

To run all of the unit tests with coverage, run npx nx run-many --all --target=test --codeCoverage. The coverage reports will be generated in the coverage folder at the root of this repo. You can view the reports in your browser by running npx serve coverage/apps.

To run all of the e2e tests, run npx nx run-many --all --target=e2e.

Linting

To lint all projects, run npx nx run-many --all --target=lint.

Format

To format all files, run npx nx format:check --all.

Generating code

This repo comes with some Nx plugins that can be leveraged to help you generate boilerplate.

Run nx list to get a list of available plugins and whether they have generators. Then run nx list <plugin-name> to see what generators are available.

Learn more about Nx generators on the docs.

Running tasks

To execute tasks with Nx use the following syntax:

nx <target> <project> <...options>

You can also run multiple targets:

nx run-many -t <target1> <target2>

..or add -p to filter specific projects

nx run-many -t <target1> <target2> -p <proj1> <proj2>

Targets can be defined in the package.json or projects.json. Learn more in the docs.

Want better Editor Integration?

Open this repo in VS Code and install the recommended extensions.

We recommend the following extensions:

• Nx Console: Provides autocomplete support, a UI for exploring and running tasks & generators, and more! Available for VSCode, IntelliJ and comes with a LSP for Vim users.
• Angular Language Service: Provides a rich editing experience for Angular templates, both inline and external templates.
• Eslint: Integrates ESLint into VS Code.
• Prettier - Code formatter: Integrates Prettier into VS Code.
• Jest Runner: Makes it easy to debug Jest tests within VS Code.