Starter kit for automating tasks in everyday front-end development. π¨π»βπ» β‘οΈ π β¨ π€
MIT License
Starter kit for automating tasks in everyday front-end development. π¨π»βπ» β‘οΈ π β¨ π€
1. Make sure you have a recent version of node.js installed.
2. Install yarn.
Yarn is a new, modern dependency management tool for JavaScript. It caches every package it downloads so it never needs to download it again. The easiest way to install:
β― $ npm install -g yarn
3. Clone repository either with SSH or with HTTPS.
β― $ git clone [email protected]:RamilMamedo/bb8.git
β― $ git clone https://github.com/RamilMamedo/bb8
4. Install gulp.
Gulp is a toolkit for automating painful or time-consuming tasks in your development workflow, so you can stop messing around and build something. The easiest way to install:
β― $ yarn global add gulp-cli
5. Go to the downloaded folder.
β― $ cd bb8
6. To get start immediately.
β― $ yarn start
If you donβt want to install or configure tools, plugins or any other dependencies. So that you can focus on the code, just create a project, and youβre good to go.
You can custom setup the project at any time and specify the dependencies that you need in the file package.json
1. To install dependencies manually.
β― $ yarn
2. To start development.
β― $ yarn dev
If you did everything correctly, it should open a browser with a local server on port 2020 and a working browser-sync.
3. To finalize the project for production.
β― $ yarn build
The last command will create a directory called build
inside the current folder.
No configuration or complicated folder structure, just the ready files you need for production:
./build/
βββ css
β βββ main.min.css
βββ fonts
β βββ Fontello
β β βββ *.{eot,svg,ttf,woff,woff2}
β βββ StarJedi
β βββ *.{woff,woff2}
βββ img
β βββ icons
β βββ *.svg
βββ js
β βββ core.js
β βββ vendors.min.js
βββ index.html
βββ robots.txt
βββ service-worker.js
7 directories, 16 files
Read more about image optimization here: [imagemin-to-compress-images, imagemin-plugins-difference];
Read more about webfont optimization here: Web Font Optimization;
Simple online tool for generating CSS @font-face and transforming difference font formats;
At present, BB8 supports the last two versions of the following browsers:
This doesn't mean that BB8 cannot be used in older browsers, just that it's focus ensure compatibility with the ones mentioned above.
Contributions, questions, and comments are all welcome and encouraged.
If you find yourself running into issues during installation or running the tools, please open an issue. BB8 would be happy to discuss how they can be solved.
The code is available under the MIT license Copyright Β© 2019.