Introduction to Express.js & Build a Basic Chat App with Socket.io

An Introduction to Express.js & Building a Basic Chat App using Socket.io by Mishal Shah (Google Summer of Code Student, Google Code-In & Google Summer of Code Mentor @ ns-3) as part of the MEAN Stack Summer Mentorship Programme

Complete video: https://www.youtube.com/watch?v=7sKtiW0iYQ0

Code built during the session is available here: https://github.com/IE-NITK/MEAN-SMP-2...

Mishal Shah: https://mishal23.github.io

Transcript

2. Agenda • Understand about express.js • Create simple REST APIs with express.js (Hands-on) • About socket.io library • Build a minimal chat app (Hands-on)
3. Tools • Node • NPM • Visual Studio Code • Postman
4. What is Express? Fast, unopinionated, minimalist web framework for node. Note: It is a backend or server-side framework!
7. Why use Express? • Makes building web applications with Node.js easier & faster • Very light & extremely fast • Provides robust routing • Dynamically render HTML pages (templating engines -- 14+)
8. Basic Syntax Express vs Node simple code!
9. Middleware Middleware functions are those pieces of code that have access to the user’s request, application response and next middleware to be used. • Gives developers access to add, remove/modify various features in the application Picture credits: https://developer.okta.com/blog/2018/09/13/build-and-understand-express-middleware-through-examples
10. ‍
13. Real-time Communication • Polling • Web Sockets Polling • Consumes server threads & bandwidth
14. WebSockets • Provides bi-directional, full-duplex communications over one single TCP connection • Communications done over TCP port 80 or 443
15. Socket.IO • Enables real-time bi-directional event-based communication • Works on every platform, browser and device focusing equally on reliability and speed. Used for: • Real-time analytics • Streaming • Instant messaging & chat • Documents Collaboration
16. ‍
17. Assignment • User typing functionality • Number of users in the room functionality • User left functionality Many more...
18. Source code • All source code will be made available on IE-NITK GitHub Page https://github.com/IE-NITK/ • Will be updated in the video’s description
19. Thank You!