Starter skeleton for new simple frontend projects. Focuses on simplicity and not on latest tools and frameworks.
Provides fast and understandable kickoff for new web sites and apps. Contains tools for interactive development with HTML, CSS and JS. Additional tooling and structure can be added later.
In the early 2017 the es5
is still the main supported JavaScript standard
among web browsers. There are bazillion tools and options that are not needed for
simple applications.
- live preview
- dependency manager
- basic task runner
- concats multiple css files into one
- concats multiple javascript files into one
-> Everything on one page of configuration.
Clone or download this repo. Cd into the folder.
npm install
downloads the dependencies and install tools.
npm start
builds the application, begins watching the files for changes and starts the local server and opens browser with the app.
clean
cleans the destination directory and recreates necessary foldersbuild
concats and copies styles, javascripts, images and html filesserve
starts a local server with destination directory as a root directorywatch
watches for changes and starts appropriate part of the build taskstart
combinesbuild
,watch
andserve
Run tasks with npm run taskname
. npm start
and install
are default npm
tasks, no run
is needed.
npm
combined with command line tools is your See sources.browser-sync
for seamlessly. Command line docs.onchange
for detecting changes of filesnpm-run-all
for running tasks in parallel andshx
for multiplatform shell commands
❯ tree app/ dist/
app/
├── css
│ ├── main.css
│ └── vendor
│ └── bootstrap.min.css
├── img
│ └── npm.png
├── index.html
└── js
├── main.js
└── vendor
└── bootstrap.min.js
dist/
├── css
│ ├── app.css
│ └── vendor.min.css
├── img
│ └── npm.png
├── index.html
└── js
├── app.js
└── vendor.min.js
- no es6, babel, browserify, grunt, gulp, webpack, jspm, commonjs, polymer, flux, foojs or barjs
- no frameworks
- no tests
...however you can integrate any of these if you need.
Articles:
Github repos: