2.3.2 • Public • Published

Create Project Boilerplate

npm version

Project boilerplate for a modern ES6+ cross-browser compatible workflow with no build configuration.

Create Project Boilerplate works on macOS, Windows, and Linux.


npm v5.2 or later

Quick Overview

mkdir my-dir
cd my-dir
npx create-project-boilerplate
npm start

Then open http://localhost:3000/ to see your app. When you’re ready to deploy to production, the dist folder can be deployed to the server.


Get Started Immediately

Comes with the following tools and libraries. You don’t need to install or configure anything.

  • Core languages supported: HTML, CSS, Javascript
  • Helper libraries/frameworks: Alpine.js, Tailwindcss
  • Module bundlers: Parcel
  • Transcompilers: Babel
  • Preprocessors: SASS
  • Autoprefixers: PostCSS
  • Icon libraries: Fontawesome
  • Linting tools: ESLint
  • Testing libraries: Jest, DOM Testing Library

Create a project, and you’re good to go.

Comes with the following libraries and utilities



  • No build configuration. dist folder is rebuilt everytime you make changes in src folder
  • Cross-browser compatible code using Babel
  • Integrated Fontawesome support using CDN
  • Support for CSS Modules using Parcel
  • Support for autoprefixers using PostCSS
  • Hot Module Reload(HMR) and support for ES Modules using Parcel
  • Built-in Alpine.js, SASS & tailwindcss support to help you write industry-level code
  • ESLint to quickly find and fix problems in your Javascript code
  • Comes with testing libraries - Jest & DOM Testing Library


Biswajit Mukherjee

Check npm version

To check npm version, type the following command in the terminal:

npm -v

As long as it is 5.2 or later, you're good to go!

Creating a boilerplate

You’ll need to have npm 5.2 or later version. We recommend using the latest LTS version of node.


npx create-project-boilerplate

To know more, refer to the usage section.


  • Create a working directory
mkdir my-dir
  • Navigate to that directory in the terminal
cd my-dir
  • Run the following command to create the project structure
npx create-project-boilerplate

Inside the working directory, it will generate the following project structure and install and configure all the required dependencies

├── node_modules
├── package.json
├── package-lock.json
├── tailwind.config.js
├── .parcel-cache
├── .babelrc
├── .postcssrc
├── .gitignore
├── dist
│   ├── # bundled css and js files
│   └── index.html
└── src
    ├── scripts
    │   └── main.js
    ├── styles
    │   ├── base.css
    │   ├── index.css
    │   └── main.css
    └── index.html
  • Once the setup is finished, run the following command to start the server
npm start

This will build and start the server at http://localhost:3000 by default. It will rebuild your website/app everytime you make changes in the src folder. Once the website/app is production ready, the dist folder can be deployed to the server.

  • To run tests using Jest
npm test
  • To stop the server press CTRL + C (CMD + C for Mac/Linux)

  • To restart the server

npm start

This will open the page on a new tab in the browser. The port number can be changed to any port of your choice in the package.json file.


npm i create-project-boilerplate

DownloadsWeekly Downloads






Unpacked Size

30.4 kB

Total Files


Last publish


  • biswajit-mukherjee