Frontend Boilerplate screenshot

Frontend Boilerplate

Author Avatar Theme by Mirabeau nl
Updated: 5 Aug 2021
67 Stars

An opinionated blueprint environment to quick start new front-end codebases

Categories

Overview

This product is a highly opinionated boilerplate that can be used to quickly kickstart a new web development project. It is built on modern tools such as Gulp, Babel, and Browsersync. Using this boilerplate will help developers stay productive by eliminating unnecessary discussions and encouraging testing.

Features

  • Live-reloading server with Browsersync: Allows developers to see the changes in real-time without manually refreshing the page.
  • Automated build process: Includes SCSS compilation, JavaScript transpiling, and image optimization, among other tasks.
  • Easy documentation generation: By adding a .yml file to component folders, documentation can be created automatically.

Installation

To set up the development environment, follow these steps:

  1. Ensure NodeJS is installed on the machine.
  2. Clone the project repository.
  3. Navigate to the project folder.
  4. Install project-specific dependencies using the command npm install.
  5. Start the development server by running npm run dev.

Note: You can also run the development server in HTTPS mode without certificates by passing the --https flag. If certificates are required, they can be added in the config.js file under ‘browsersync’.

Summary

This highly opinionated boilerplate is designed to help developers quickly start a new web development project. It includes features such as a live-reloading server, automated build process, and easy documentation generation. By following the installation guide, developers can easily set up their development environment and start building their projects.