Vite Boilerplate

Quickly bootstrap a new project with Vite Boilerplate.

This boilerplate contains all the tools you need to build a modern web app with TypeScript, React, Vite, Storybook and Express.
You can use it to quickly bootstrap your project.

ESLint, stylelint, prettier, husky and lintstaged are configured to give you a solid development experience.

Installing / Developing

First, create a repository from this template.

Now you are ready to go:

npm install

This will install the dependencies required to run the boilerplate.

npm run dev

Boom! These scripts run your server, client and storybook in development mode.

The default PORTS are:

• 3001 for the server
• 3000 for the client
• 6006 for the storybook

If you don't like to call all scripts at once, you can also run:

npm run server:dev
npm run client:dev
npm run storybook

You can configure the server port by setting the PORT environment variable. Creating a .env file is supported. You can copy .env.example to .env.

KEY	VALUE
PORT	(Optional) Port for the server environment (defaults to 3001)

Building

To build the project, run:

npm run build

This will build the client, server and storybook.

npm start

In production, you have a single server serving everything.

/api/* is the API endpoint.
/storybook is the Storybook.
/* is the client.

Tests

A test runner is not installed (right now). But TypeScript, linter and prettier are checked on commit and push thanks to husky and lintstaged.

Licensing

MIT