Frontend Boilerplates screenshot

Frontend Boilerplates

Author Avatar Theme by Ckgrafico
Updated: 26 Apr 2023
379 Stars

Collection of Boilerplates with ES6, Vue, React, Nuxt, TypeScript, SCSS, Nodejs. Using good practices and file structures to inspire your real projects.

Categories

Overview

This repository is a collection of boilerplates that provide good practices and tips for developing scalable applications. The boilerplates cover different technologies such as JavaScript, TypeScript, Vue, and React. They come with pre-configured settings and examples to inspire your project.

Features

  • JavaScript: Vanilla JavaScript is used as the programming language.
  • PostCSS: The boilerplate is equipped with PostCSS to take advantage of the latest CSS features.
  • Bootstrap: Easily build fast and responsive websites using the Bootstrap framework.
  • Autoprefixer: Automatically adds vendor prefixes to styles for better browser compatibility.
  • Webpack: Automates tasks and compiles the project.
  • Babel: Transpiles the code to different versions of EcmaScript.
  • Browserlist: Configure which browsers are supported by the project.
  • Jest: Framework for testing.
  • ESLint: Linting for scripts.
  • StyleLint: Linting for styles.
  • Prettier: Formatter for scripts and styles.
  • EditorConfig: Formatter for files in general.
  • Husky: Allows attaching to git hooks and running scripts.

Installation

To use the boilerplate, follow these steps:

  1. Download or clone the boilerplate repository.
  2. Install all the dependencies.
  3. Run the project for local development.
  4. Build the project for a production environment.
  5. Test your code.

The boilerplate is also configured with Husky, which runs the linting before committing changes. However, you can manually run the linting as well.

Summary

This repository provides a collection of boilerplates with different technologies, all following similar structures for writing scalable applications. The included boilerplates cover JavaScript, TypeScript, Vue, and React. They come with pre-configured settings and examples to inspire and guide your projects.