📖 See the Remix docs and the Remix Vite docs for details on supported features.

This template is similar to the Blues Stack, written at a time when that stack didn't support Vite yet.

• Database ORM with Prisma
• Styling with Tailwind
• Local third party request mocking with MSW
• Unit testing with Vitest and Testing Library
• Component previews and documentation with Storybook
• Code formatting with Prettier
• Linting with ESLint
• Static types with TypeScript

• Copy .env.sample to .env and update it as needed.
• You'll need a Postgres server running somewhere for development and unit tests. For convenience, you can use the one provided by Docker Compose in this repo:

  docker-compose up -d db

  Otherwise, update .env and .env.test as needed to change your database URLs.

Much of the code here just illustrates how to use the various tools in the template. You'll probably want to delete most of it! In particular, refer to Prisma's guide on getting starting for an example of how to create your own database schema and initial migration.

Run the Vite dev server:

npm run dev

npm test

The tests have access to Postgres, so you don't need to mock Prisma. Each test suite receives its own database on the Postgres server, with as many databases as there are test workers in the pool. The databases are migrated one time at the beginning of test execution. Tables are cleared out after each test.

This means you can run multiple suites in parallel, as Vitest does by default. You may not be able to run tests concurrently within a single suite, though.

The convenience of using Postgres in your tests comes with some overhead. If your tests are running slowly, set VERBOSE_TEST_HARNESS=true in .env.test to see some extra logging output to check whether Postgres setup and teardown is slowing them down more than you'd like.