From 4f3da758b19e08b3ca420cd9c026595ad8b611a7 Mon Sep 17 00:00:00 2001 From: Ethan Garofolo Date: Sun, 3 Jan 2016 05:40:14 -0700 Subject: [PATCH] Add Babel 6 --- .babelrc | 3 +++ README.md | 48 +++++++++++++++++++++++++++++++++++++++--------- babelDemo.js | 4 ++++ babelMain.js | 4 ++++ package.json | 3 +++ 5 files changed, 53 insertions(+), 9 deletions(-) create mode 100644 .babelrc create mode 100644 babelDemo.js create mode 100644 babelMain.js diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..c13c5f6 --- /dev/null +++ b/.babelrc @@ -0,0 +1,3 @@ +{ + "presets": ["es2015"] +} diff --git a/README.md b/README.md index c7773c1..c23bb56 100644 --- a/README.md +++ b/README.md @@ -2,24 +2,54 @@ ## Current Episode -* [Watch: https://learnallthenodes.com/episodes/45-validating-user-input-part-2-the-better-way](https://learnallthenodes.com/episodes/45-validating-user-input-part-2-the-better-way) +* [Watch: https://www.learnallthenodes.com/episodes/48-babel](https://www.learnallthenodes.com/episodes/48-babel) -A few episodes ago I expressed my disdain for ORMs and ODMs. I find them to either be a design small in your code or irrelevant. We're going to dive into the alternatives as we work towards a better app structure. + const foo = () => console.log('Hello, ES6!') + +Such confuse. Very not understand. + +This code snippet looks like a programming language, and it has a few traces of JavaScript in it. But that doesn't look like it will work! + +And you're right. Both your browser and Node.js are going to struggle if you try to run this. + +But what if I told you the code above was equivalent to the following?: + + var foo = function () { + console.log('Hello, ES6!') + } + +Well it is, and I think it reads much cleaner, and that's why in this episode, we're going to start learning how to take that first snippet and make it work in Node.js. -In this episode though, we're going to show to handle user input without resorting to the crutch of an ODM. ### Notes -[Opening clipart](https://openclipart.org/detail/33859/furnace-filter) +The Babel logo is from [the Babel project](http://babeljs.io/) itself + +[ECMAScript at Wikipedia](https://en.wikipedia.org/wiki/ECMAScript) + +[`.babelrc` documentation](http://babeljs.io/docs/usage/babelrc/) + +### The modules we need -[Episode code]() + npm install --save babel-core babel-preset-s2015 babel-register + +### `.babelrc` -[Grey bird with question marks](https://openclipart.org/detail/194097/grey-bird-with-question-marks) + { + "presets": [ "es2015" ] + } + +### Entry point file: `babelMain.js` -[Database symbol](https://openclipart.org/detail/181674/database-symbol + require('babel-register') -[Happy cloud](https://openclipart.org/detail/185355/happy-cloud) + require('./babelDemo') + +### File with our ES6: `babelDemo.js` -[`validator`](https://www.npmjs.com/package/validator) + // babelDemo.js + const foo = () => console.log('Hello, ES6!') + + foo() ### Previous episodes' code diff --git a/babelDemo.js b/babelDemo.js new file mode 100644 index 0000000..5f7a51a --- /dev/null +++ b/babelDemo.js @@ -0,0 +1,4 @@ +const foo = () => console.log('Hello, ES6!') + +foo() + diff --git a/babelMain.js b/babelMain.js new file mode 100644 index 0000000..0874de0 --- /dev/null +++ b/babelMain.js @@ -0,0 +1,4 @@ +require('babel-register') + +require('./babelDemo') + diff --git a/package.json b/package.json index 5ff752c..9ae0018 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,9 @@ "dependencies": { "async": "~0.2.10", "authorized": "^0.4.1", + "babel-core": "^6.3.26", + "babel-preset-es2015": "^6.3.13", + "babel-register": "^6.3.13", "bcrypt": "~0.7.7", "body-parser": "^1.6.3", "connect-flash": "^0.1.1",