Adalab Web Starter Kit

screenshot of Adalab Web Starter Kit

Adalab Web Starter Kit

Base de desarrollo web con node/gulp


Adalab's web starter kit is a template project created in Node and Vite. It is designed to provide preinstalled and preconfigured functionalities for web development. This kit includes an HTML template engine, the SASS preprocessor, a local server, and more. The purpose of the kit is to make web development more comfortable and automate tasks.


  • Preconfigured project setup with necessary files such as vite.config.js and package.json.
  • Separate folders for HTML, CSS, and JS files.
  • Includes static files such as images, fonts, and libraries.
  • Automatic generation of the "docs" folder upon project startup.


To work with the Adalab web starter kit, you need to have Node JS installed with a version higher than 14. Follow these steps to set up a new project:

  1. Create your own repository.
  2. Download the starter kit from the Adalab GitHub repository.
  3. Copy all the files from the starter kit into the root folder of your repository, including hidden files.
    • If you have cloned the repository, do not copy the ".git" folder to avoid overwriting your own repository.
  4. Open a terminal in the root folder of your repository.
  5. Install the local dependencies by running the following command in the terminal:
    npm install


The Adalab web starter kit is a convenient template project for web development. It provides preinstalled and preconfigured functionalities, making it easier to work on web projects. The kit includes an HTML template engine, a SASS preprocessor, a local server, and more. By following the installation guide, users can quickly set up a new project and start programming comfortably. Additionally, the kit offers commands for generating a production version and publishing the project on GitHub Pages easily.


Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects


SCSS is a preprocessor scripting language that extends the capabilities of CSS by adding features such as variables, nesting, and mixins. It allows developers to write more efficient and maintainable CSS code, and helps to streamline the development process by reducing repetition and increasing reusability.