Basic web application tools and structure
-
Pug (Jade) (HTML template engine)
-
SASS (.scss)
-
PostCSS auto prefixer (support for cross browsers)
.{
transition: all .4s ease;
}
becomes
.{
-webkit-transition:all .4s ease;
-o-transition:all .4s ease;
-moz-transition:all .4s ease;
transition:all .4s ease
}
- Image optimizer (optimizes images' sizes)
- del
- gulp
- gulp-autoprefixer
- gulp-concat
- gulp-connect
- gulp-contrib-copy
- gulp-express
- gulp-image
- gulp-livereload
- gulp-minify-css
- gulp-plumber
- gulp-pug
- gulp-sass
- gulp-sourcemaps-alpha
- gulp-uglify
- gulp-util
run Gulp Task Runner
npm start
or gulp
then open http://localhost:1453
You will see same views when you run the project Output Demo Link