Frontend Starter Pack (Bootstrap, Jquery, font-awesome, popper.js)

Words
250
Reading
2 min
Listen
Play
9y

Github: https://github.com/Rhotimee/bootstrap4-beta-starter-pack

The project uses a more Professional Approach to frontend development using bootstrap 4 by creating a workflow to build our web projects from source. Npm is used in installing all project Dependencies(Bootstrap-4, font-awesome, Jquery, Poper.js, Browser-sync, Gulp, Gulp-sass ).

This Starter Pack enables us to build from source, compile our sass, and gives us a dev server to work with.

  • It Comprises of:
  1. Bootstrap: it is a free and open-source front-end web framework for designing websites and web applications.

  2. Font-Awesome: Font Awesome is a font and icon toolkit based on CSS and LESS
    Jquery: jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML.

  3. Popper.js: Popper.js is a positioning engine, its purpose is to calculate the position of an element to make it possible to position it near a given reference element.

  4. Browser Sync: Browser-sync makes your browser testing workflow faster by synchronizing URLs, interactions and code changes across multiple devices.

  5. Gulp: gulp.js is an open-source JavaScript toolkit by Fractal Innovations and the open source community at GitHub, used as a streaming build system in front-end web development.

This starter pack can be cloned from the GitHub link above.

Usage
  • Navigate to your project directory & Clone the Project
$ git clone https://github.com/Rhotimee/bootstrap4-beta-starter-pack

Screen Shot 2018-01-03 at 3.10.47 PM.png

  • Enter Command in the directory.
$ npm install

This installs all the necessary dependencies.
Screen Shot 2018-01-03 at 3.11.07 PM.png

  • After Installing, npm Start
$ npm start

Files are compiled to \src
This also starts the server and opens the browser.

Screen Shot 2018-01-03 at 3.11.34 PM.png

Screenshot of gulp file.
Screen Shot 2018-01-03 at 4.06.21 PM.png

Proof of work.
Screen Shot 2018-01-03 at 4.09.10 PM.png



Posted on Utopian.io - Rewarding Open Source Contributors

Frontend Starter Pack (Bootstrap, Jquery, font-awesome, popper.js) | Ecency