Frontend Monorepo for Rapid Prototyping

This is a npm Template for a Frontend Monorepo.

It puts emphasis on rapid prototyping and a prototype-driven development (Pixar Planning).

What is included?

This monorepo contains the following packages/apps:

Apps and Packages

• A prototype for the application, based on React Router SPA.
• A package that provides the domain types and enums.
• A documentation in Antora (AsciiDoc) format.
• A package that provides synthetic data for the applications using Faker.js.
• A package that provides a mock API via service workers using MSW.
• A component library that is shared by the main application and the prototype.
• ESLint and TypeScript configurations that are shared throughout the monorepo.

Features

• Monorepo based on ESM standards.
• Turborepo for building and running the monorepo.
• Pre-Configured CI Pipeline for Gitlab CI.
• Continuous deployment for the prototype and preview environments for merge-requests.
• Automatic deployment of the documentation to Gitlab Pages.
• Code formatting with Prettier and linting with ESLint.

Each package/app is written in TypeScript.

The prototype is automatically deployed to a preview server on a push to the main branch or a tagged commit.

Documentation

The developer documentation is located in the docs folder. It is automatically published via Gitlab Pages.

The project documentation is written in AsciiDoc and is generated using Antora.

Getting Started

To get started, run the following command:

npm create tinker-stack

Local testing

To verify the generator before publishing:

1. Run npm pack in this repository to produce a tarball (for example create-tinker-stack-0.2.2.tgz).
2. In a temporary directory, execute npx --yes create-tinker-stack@file:/absolute/path/to/create-tinker-stack-0.2.2.tgz.
   • Replace the path with the absolute path to the tarball from step 1 (npm create does not currently support file: specifiers).