Downloaded 62 times
Uploaded byIrfan Maulana
PHP Indonesia - Nodejs Web Development
This document provides an introduction to Node.js web development. It discusses Node.js basics including its asynchronous, non-blocking architecture. It also covers building a simple web app with Express, MongoDB, and Jade. Tools for bundling assets like Grunt and unit testing with Mocha are described. Sample code demonstrates basic routing, database queries, templating, and unit tests. Contact information and GitHub repos are provided to learn more.
PHP Indonesia - Nodejs Web Development
- 1. NODEJS WEB DEVELOPMENT ByIrfan Maulana | SDE at Blibli.com
- 2. About me • Name: Irfan Maulana • Work : PT. Global Digital Niaga (Blibli.com) • Role : Software Development Engineer • Full-stack developer in Java and Javascript
- 3. Outline 1. Intro 2. GettingKnow NodeJS 3. Power of NodeJS 4. Web Development with NodeJS 5. Demo 6. Bundling Assets in NodeJS (*depend with time) 7. Unit Test (*depend with time)
- 4.
- 5. Are you Javascriptdeveloper ?
- 6. JS Popularity Source :stackoverflow
- 7.
- 8.
- 9. 2. GETTING KNOWNODEJS
- 10. Nodejs Wiki • JavaScriptruntime built on Chrome's V8 JavaScript engine.
- 11. Native JS vNodejs Nodejs live in different side with native js FRONT-SIDE BACK-SIDE
- 12. Man Behind • Originallywritten in 2009 by Ryan Dahl (github.com/ry) and demonstrate in European JSConf November 8 2009 • Inspired by file upload progress bar on flickr
- 13. 3. POWER OFNODEJS
- 14. Isomorphic Javascript • Isomorphicfrom the greek “isos” for equal and “morph” for shape • When backend and frontend share the same code
- 15. Non-Blocking I/O • Notlike a traditional thread base I/O, nodejs using single thread as a native Javascript has do • In thread base, you must allocate maximal thread in your webserver and every thread will execute one task in one moment, if there another request will be execute after first request has done • Nodejs’s thread can execute other request without waiting, it will return callbacks that will be only filled when request has done. • Callback that provide is not always the Data, it can be an exception
- 16. Async Request Handler Source: strongloop
- 17. NPM • Include whenyou install node • You can install and manage all your dependency easier
- 18. Third-Party Library • Havea goodness of JavaScript, easy to extends, easy to rebuild your own library • In npmjs.com 253167 total packages library • Will be many choices for each library, just choose as you need
- 19. 4. WEB DEVELOPMENTWITH NODEJS
- 20. Development Stack • Framework: Expressjs • Database : Mongodb (using mongoose module for connection) • Template Engine : Jade
- 21. Expressjs • Express isa minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications. (http://expressjs.com/ )
- 22. Expressjs Install • Installing: npm install express • Initial project : express init sampleapp • Install dependency : npm install (in project directory) • Run project : npm start
- 23. Expressjs Basic Routing Thisroute will redirect to index.jade and set data title that will be process in server side by jade This route will send you json response
- 24. Mongoose • elegant mongodbobject modeling for node.js (http://mongoosejs.com/) • Installing : just add dependency in package.json and run npm install
- 25. MongoDB Connection Just requiremongoose depedency and connect with mongoodb in one line code.
- 26. Schema and Model Schemais our mongoDB collection (table) structure wrapper. Model is object that we use for querying.
- 27. Using Model forQuery • We using product model for find (*select all) data • This route will return json of all data in table Product • Access in URL / with method GET
- 28. Jade - TemplateEngine • Lightweight templating engine • Adopt JSON structure instead XML • http://jade-lang.com/
- 29. Jade v HTML Injade, you never worry about close tag that spent your time. Just indent like you see HTML
- 30. Jade for snippet Wecreate layout.jade as our main layout, we define block css, content and javascript that will use later
- 31. Using snippet • Herewe use our layout.jade and fill our block content, javascript we defined • We can split our big page, into smaller block than just include that file
- 32.
- 33. 5. DEMO Fork on: https://github.com/mazipan/nodejs-simple-restfull- with-express
- 34. 6. BUNDLING ASSETSIN NODEJS
- 35. Grunt • The JavascriptTask Runner (http://gruntjs.com/) • Why ? • In one word: automation. The less work you have to do when performing repetitive tasks like minification, compilation, unit testing, linting, etc, the easier your job becomes. • Install CLI : npm install -g grunt-cli • Added grunt and grunt plugin in devDepedencies
- 36. Configure Task • CreateGruntfile.js • Initial configure your task • Load your task • Register your task
- 37. Uglify • Javascript assetsminifying and bundling into one file if needed
- 38. CSS Minify • CSSassets minifying and concating
- 39.
- 40. Our Module forTest • Supertest is our agent that will access url method like postman • Should is easy understand assertion • Mocha is our main test case • Install mocha before : npm install –g mocha • Run : mocha test or node test (in project directory)
- 41. Setup depedency • SetupdevDependency in package.json • You can setup script test execution for using node test
- 42.
- 43. GITHUB REPO &CONTACT ME
- 44. 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
- 45.