[blibli brown bag] nodejs - the other side of javascript
TRANSCRIPT
![Page 1: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/1.jpg)
NODEJS – THE OTHER SIDE OF JAVASCRIPTBy Irfan Maulana
Presented for Brown Bag at Blibli.com
![Page 2: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/2.jpg)
ABOUT ME
• Name : Irfan Maulana• Join at Blibli : October 2015• Role : SDE – Front End Developer• Project : SEOUL aka Blibli.com main website• Has been code Javascript for at least 2 years
![Page 3: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/3.jpg)
WHAT IS NODEJS ?
• JavaScript runtime built on Chrome's V8 JavaScript engine.
![Page 4: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/4.jpg)
MAN BEHIND
• Initiate by Ryan Dahl (github.com/ry)• from 2015 handled by Node.js Foundation
![Page 5: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/5.jpg)
WHAT IS DIFFERENT ?
FRONT BACK
NODEJS IS JAVASCRIPT, BUT IN DIFFERENT SIDE
![Page 6: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/6.jpg)
NODEJS OFFER
• Lightweight server• Near Real-Time Speed• Non-Blocking I/O with Event-Loop• NPM (like Ruby GEM)• Javascript Isomorphic• Thousand Third Party Library• Growth community and documentation
![Page 7: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/7.jpg)
MOST POPULAR NPM MODULE
• Express : web development framework• Connect : extensible HTTP server framework, serves as
base express• Socket.io and sockjs : websockets component• Jade : templating engine• Mongo and Mongojs : Mongodb wrapper• Redis : Redis client library• Coffe-script : CoffeScript compiler• Underscore : utility library• Forever : utility for ensuring node script runs continously
![Page 8: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/8.jpg)
YOU SHOULD USE NODEJS
• CHAT• API• QUEUED INPUT• MONITORING DASHBOARD• SERVER-SIDE WEB APPLICATION
![Page 9: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/9.jpg)
DON’T USE NODEJS
• RELATIONAL DB BEHIND• HEAVY COMPUTATION/PROCESSING
![Page 10: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/10.jpg)
NODEJS SHOWCASE
• Walmart• E-bay/Paypal• Microsoft - Azure CLI, Yammer• Linkedin• Trello• Uber• Medium• Wordpress
![Page 11: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/11.jpg)
WEB DEVELOPMENT IN NODEJS
![Page 12: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/12.jpg)
OUR NODEJS WEB DEV STACK
• EXPRESSJS : BASE FRAMEWORK – APP GENERATOR
• MONGOOSE : MONGODB CONNECTION• JADE : HTML TEMPLATE• ANGULAR JS : FRONTEND FRAMEWORK• MOCHA – SHOULD – SUPERTEST : UNIT TEST• GRUNT : TASK RUNNER
![Page 13: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/13.jpg)
EXPRESSJS AND MONGOSE
![Page 14: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/14.jpg)
USING EXPRESS GENERATOR
• Express generator : express <package>• Run : SET DEBUG=<package>:* & npm start• Default run in : http://localhost:3000/
![Page 15: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/15.jpg)
HOW EXPRESS SEND DATA
• SERVER RENDER
• REST
![Page 16: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/16.jpg)
OUR MONGODB CONNECTION
![Page 17: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/17.jpg)
SCHEMA AND MODEL IN MONGOOSE
![Page 18: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/18.jpg)
USING OUR MONGOOSE MODEL
![Page 19: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/19.jpg)
EXPRESS ROUTER
![Page 20: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/20.jpg)
POSTMAN
![Page 21: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/21.jpg)
INTRODUCE JADE TEMPLATING
![Page 22: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/22.jpg)
USING JADE FOR VIEW
• HTML : XML LIKE STRUCTURE• JADE : JSON LIKE STRUCTURE
![Page 23: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/23.jpg)
JADE LAYOUT SAMPLE
![Page 24: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/24.jpg)
USING JADE LAYOUT
![Page 25: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/25.jpg)
JAVASCRIPT UNIT TEST
![Page 26: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/26.jpg)
CREATE OUR RESTFUL UNIT TEST
![Page 27: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/27.jpg)
GRUNT TASK
![Page 28: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/28.jpg)
OUR GRUNT PLUGIN
• grunt-contrib-uglify• grunt-contrib-cssmin• grunt-contrib-concat• grunt-contrib-jade
![Page 29: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/29.jpg)
UGLIFY ( MINIFY JAVASCRIPT)
![Page 30: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/30.jpg)
CSS MINIFY
![Page 31: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/31.jpg)
CONCAT FILE CSS AND JAVASCRIPT
![Page 32: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/32.jpg)
COMPILE JADE
![Page 33: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/33.jpg)
GITHUB REPOSITORY
• https://github.com/mazipan/nodejs-simple-restfull-with-express
• https://github.com/mazipan/nodejs-simple-restfull-test-with-mocha
• https://github.com/mazipan/nodejs-mongodb-simple-library-application
• https://github.com/socketio/socket.io
![Page 34: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/34.jpg)
SOURCES
• http://expressjs.com/en/starter/basic-routing.html• http://mongoosejs.com/• http://jade-lang.com/tutorial/• http://gruntjs.com/getting-started• www.toptal.com/nodejs/why-the-hell-would-i-use-n
ode-js
• https://scotch.io/tutorials/build-a-restful-api-using-node-and-express-4
![Page 35: [Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://reader036.vdocument.in/reader036/viewer/2022062522/5871ab891a28abda6a8b58af/html5/thumbnails/35.jpg)
THANK YOUmazipanneh.wordpress.com
@Maz_Ipan
/mazipanneh
/in/irfanmaulanamazipan