https://github.com/engineervix/quick-html-boilerplate
A dead simple and quick html starter kit for prototyping web development projects
https://github.com/engineervix/quick-html-boilerplate
boilerplate-template browsersync frontend gulp html prototype
Last synced: 12 months ago
JSON representation
A dead simple and quick html starter kit for prototyping web development projects
- Host: GitHub
- URL: https://github.com/engineervix/quick-html-boilerplate
- Owner: engineervix
- License: mit
- Created: 2020-03-13T17:09:58.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2024-10-09T10:27:26.000Z (over 1 year ago)
- Last Synced: 2025-02-04T12:16:39.909Z (about 1 year ago)
- Topics: boilerplate-template, browsersync, frontend, gulp, html, prototype
- Language: HTML
- Size: 463 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 22
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# quick-html-boilerplate
[](https://forthebadge.com)
[](https://david-dm.org/engineervix/quick-html-boilerplate) [](https://david-dm.org/engineervix/quick-html-boilerplate?type=dev) [](https://dependabot.com/)
## About this
A dead simple and quick html starter kit for prototyping web development projects. Nothing fancy, everything is pretty basic.
## Features
- Fully responsive, using the latest [Bootstrap 4](https://getbootstrap.com/) with additional themes courtesy of [Bootswatch](https://bootswatch.com/).
- [Font Awesome 5 (free)](https://fontawesome.com/icons?m=free) icons.
- Live reload courtesy of [BrowserSync](https://browsersync.io/).
- [Gulp](https://gulpjs.com/) based workflow, with defined tasks for:
- copying minified (dist) files of modules listed in package.json "dependencies" field to the `static/vendors` directory. This is courtesy of [gulp-npm-dist](https://github.com/dshemendiuk/gulp-npm-dist) in conjunction with [gulp-rename](https://github.com/hparra/gulp-rename),
- deleting files and directories in the `static/vendors` directory using [del](https://github.com/sindresorhus/del),
- _uglifying_ javascript files using [gulp-uglify](https://github.com/terinjokes/gulp-uglify),
- _minifying_ css files using [gulp-clean-css](https://github.com/scniro/gulp-clean-css)
## Prerequisites
- [Node.js](https://nodejs.org/) with the following packages installed **globally**:
- [concurrently](https://github.com/kimmobrunfeldt/concurrently): `npm install -g concurrently`
- [Browsersync](https://browsersync.io/): `npm install -g browser-sync`
- [Gulp](https://gulpjs.com/): `npm install gulp-cli -g`
- [Python3](https://www.python.org/). In this boilerplate, I use the [`http.server`](https://docs.python.org/3.6/library/http.server.html) module as a development server. There are numerous (better) alternatives so feel free to use your preferred option (An excellent example is [lite-server](https://github.com/johnpapa/lite-server), a _development only_ node server that uses BrowserSync). I chose this because python3 is always installed on any development machine I use :smile:!
## How to use this
1. Clone the repository: `git clone https://github.com/engineervix/quick-html-boilerplate.git`
2. Navigate to the cloned project directory: `cd quick-html-boilerplate`
3. Install dependencies: `npm install`
4. Copy the vendor libraries into the `static/vendors` directory: `gulp cp`
5. Start the development server: `npm run dev`. If you have `lite-server`, simply run `lite-server`.
## Credits
- HTML Template based on
- svg background:
- favicon created using
- `` placeholder:
- `.gitignore` generated using
## TODO
- [ ] Develop a ["cookiecutter"](https://github.com/cookiecutter/cookiecutter)
---