LuisdelaVega / comet-starter-vite-app

Comet Component Library Starter App using Vite

Welcome to the Comet Starter Vite App

The goal of this project is to provide a React with TypeScript starter application, which comes pre-configured with the USWDS-based Comet Component Library as well as other tools to accelerate development. Some of these tools are as follows:

• Tooling: Vite
• Platform: React with TypeScript
• Component Library: Comet Component Library
• Data Visualization: Victory Charts
• State Management: TanStack Query & Recoil
• Forms: React Hook Form
• Unit Testing: Jest with React Testing Library
• Code Analysis: ES Lint
• Code Formatting: Prettier
• End-to-End (E2E) Testing: Cypress
• Accessibility Testing: cypress-axe
• API support: axios
• Authentication support (coming soon): TBD

Table of Contents

1. Running the Project Locally
2. Running Unit Tests
3. Running Code Quality Checks
4. Running End-to-End (E2E) Tests
5. Contributing

Running the Project Locally

1. To install dependencies, run the following:

npm install

2. To start the app, run the following:

npm run dev

Running Unit Tests

To make sure your changes do not break any unit tests, run the following:

npm run test

Ensure to review the coverage directory for code coverage details.

npm run coverage

Running Code Quality Checks

To make sure your changes adhere to additional code quality standards, run the following:

npm run lint
npm run format

You can also see the .vscode/settings.json file to find how to enable auto-formatting on save.

Running End-to-End (E2E) Tests

Note: running E2E tests requires the app to be running as well, run the following:

npm run e2e

Contributing

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature_a)
3. Commit your Changes (git commit -m 'Added new feature_a')
4. Push to the Branch (git push origin feature_a)
5. Open a Pull Request

Notes

When to use EnvironmentPlugin?

Use EnvironmentPlugin to expose specific values in from your .env files through process.env instead of the vite provided import.meta.env way.

You would want to use EnvironmentPlugin when you're creating unit test for code that tries to read a value through import.meta.env.