Upload
irfan-maulana
View
639
Download
3
Embed Size (px)
Citation preview
NODEJS – THE OTHER SIDE OF JAVASCRIPTBy Irfan Maulana
Presented for Brown Bag at Blibli.com
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
WHAT IS NODEJS ?
• JavaScript runtime built on Chrome's V8 JavaScript engine.
MAN BEHIND
• Initiate by Ryan Dahl (github.com/ry)• from 2015 handled by Node.js Foundation
WHAT IS DIFFERENT ?
FRONT BACK
NODEJS IS JAVASCRIPT, BUT IN DIFFERENT SIDE
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
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
YOU SHOULD USE NODEJS
• CHAT• API• QUEUED INPUT• MONITORING DASHBOARD• SERVER-SIDE WEB APPLICATION
DON’T USE NODEJS
• RELATIONAL DB BEHIND• HEAVY COMPUTATION/PROCESSING
NODEJS SHOWCASE
• Walmart• E-bay/Paypal• Microsoft - Azure CLI, Yammer• Linkedin• Trello• Uber• Medium• Wordpress
WEB DEVELOPMENT IN NODEJS
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
EXPRESSJS AND MONGOSE
USING EXPRESS GENERATOR
• Express generator : express <package>• Run : SET DEBUG=<package>:* & npm start• Default run in : http://localhost:3000/
HOW EXPRESS SEND DATA
• SERVER RENDER
• REST
OUR MONGODB CONNECTION
SCHEMA AND MODEL IN MONGOOSE
USING OUR MONGOOSE MODEL
EXPRESS ROUTER
POSTMAN
INTRODUCE JADE TEMPLATING
USING JADE FOR VIEW
• HTML : XML LIKE STRUCTURE• JADE : JSON LIKE STRUCTURE
JADE LAYOUT SAMPLE
USING JADE LAYOUT
JAVASCRIPT UNIT TEST
CREATE OUR RESTFUL UNIT TEST
GRUNT TASK
OUR GRUNT PLUGIN
• grunt-contrib-uglify• grunt-contrib-cssmin• grunt-contrib-concat• grunt-contrib-jade
UGLIFY ( MINIFY JAVASCRIPT)
CSS MINIFY
CONCAT FILE CSS AND JAVASCRIPT
COMPILE JADE
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
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
THANK YOUmazipanneh.wordpress.com
@Maz_Ipan
/mazipanneh
/in/irfanmaulanamazipan