Front-End Development Environment Template I use
I’ll introduce my Front-End package which is using webpack and gulp.
December 14, 2017
When I start to create websites, I usually use my boilerplate. Those are Node.js and webpack and gulp and so on. I would like to introduce my template.
Web Development Tools
I’m usually using nodebrew for managing Node.js.
Node.js & npm
node -v
v9.0.0
npm -v
5.5.1
What is Node.js?
Node.js is a lean, fast, cross-platform JavaScript runtime environment that is useful for both servers and desktop applications
Why web developers use Node.js is because Node.js provides a lot of useful tools when you implement websites. You don’t need to use as an actual server. But you need to install to your computer.
What is nodebrew?
You can install Node.js only one version. However, sometimes it’s needed to change version. Once you use nodebrew, you can have multiple Node.js.
package.json
You can manage your project on npm. then it’s generated “package.json”. You can add any dependencies such as jQuery, gsap, reset-css. And also devDependencies which is babel, and gulp.
usage
package.json
...
"dependencies": {
"gsap": "^1.20.3",
"jquery": "^3.2.1",
},
...
js
import jQuery from 'jquery';
import { TweenMax, TweenLite, TimelineLite } from "gsap";
const $ = jQuery;