Slide 1

Slide 1 text

NodeJS for Architects PART 1 By Allan Chua

Slide 2

Slide 2 text

Agenda How NodeJS works Tooling Building scripts like a boss Pre-requisites

Slide 3

Slide 3 text

Series of topics NodeJS Scripting 1 Frontend Engineering React 2 API Development 3 Hosting static frontends in AWS 4 hosting APIs in AWS 5 Containers in AWS 6 Serverless APIs for AWS 7 Storing data in AWS 8

Slide 4

Slide 4 text

Goal of Training Convert you to Solution Architects With skills in nodejs and AWS

Slide 5

Slide 5 text

Pre-requisites Things that you need before you can work like a ninja in NodeJS

Slide 6

Slide 6 text

Linux is recommended Any linux distro is fine But ubuntu is highly recommended because of its compatibility with major Ides If you are in windows, There’s a solution for that and it’s called windows subsystems for linux Macbook pro is the most loved machine by developers but its very expensive.

Slide 7

Slide 7 text

Shell skill is a must Its almost impossible to Create automation pipelines and deploy NodeJS without having a decent shell skill.

Slide 8

Slide 8 text

You’ll need a code editor and a browser of course IDE & Browser

Slide 9

Slide 9 text

How node JS works

Slide 10

Slide 10 text

JavaScript Originally Written for the Browsers But now works everywhere

Slide 11

Slide 11 text

NODE JS Is a runtime responsible for executing JS outside a browser

Slide 12

Slide 12 text

But how? If JS was made for browsers, how was it able to execute js everywhere?

Slide 13

Slide 13 text

Thanks to v8 V8 is google chrome’s javascript engine

Slide 14

Slide 14 text

How v8 works It is used by nodejs to take javascript and execute it outside a browser. machine executable code V8 translates takes js as input

Slide 15

Slide 15 text

Server and client delta But there’s a difference between server and browser code • DOM • Cookies • Document • Window • APIs related to browser window • File system • EXECUTE Shell • Web servers and clis Browser Node JS

Slide 16

Slide 16 text

Why NodeJS

Slide 17

Slide 17 text

Asynchronous = Efficiency NodeJS is awesome because it enables superior use of compute resources in a server READ THIS GUYS: https://www.geeksforgeeks.org/why-node-js-is-a-single-threaded-language/

Slide 18

Slide 18 text

Single Language means happy owners - Less cognitive switch - Faster onboarding of developers - Faster engineering

Slide 19

Slide 19 text

Could be used to make And many more Web ApiS websites Artificial Intelligence

Slide 20

Slide 20 text

Largest programming ecosystem The large ecosystem of nodejs applications can easily result to reduction of engineering cost Stackoverflow Sample Projects Youtube Videos Medium Articles

Slide 21

Slide 21 text

Tooling

Slide 22

Slide 22 text

Core Tools NVM NPM NPX We’ll view tackle this on frontend and api development portions

Slide 23

Slide 23 text

NVM Stands for NODE VERSION MANAGER. Installation Script

Slide 24

Slide 24 text

NVM It’s shell-based cli tool used for managing the active version of nodeJs installed in your machine.

Slide 25

Slide 25 text

NVM View all available versions download versions Switch Between versions

Slide 26

Slide 26 text

NVM View all available versions

Slide 27

Slide 27 text

NVM List versions with long term support

Slide 28

Slide 28 text

NVM Use a Specific Version

Slide 29

Slide 29 text

NPM Stands for NODE package MANAGER.

Slide 30

Slide 30 text

NPM – Package Manager Open source Repository of packages Configuration like version, and type Package management Run and Manage Scripts

Slide 31

Slide 31 text

Installed together with NodeJS

Slide 32

Slide 32 text

NPM - Verify Verify NPM’s existence

Slide 33

Slide 33 text

NPM Can also refer to: The open source repository of javascript packages https://www.npmjs.com/

Slide 34

Slide 34 text

The nodejs developer workflow

Slide 35

Slide 35 text

The nodejs development workflow Install dependencies Initialize your project Write your code Execute application entry point

Slide 36

Slide 36 text

Let’s rock and roll

Slide 37

Slide 37 text

Let’s build an avatar generator in 5 minutes

Slide 38

Slide 38 text

If you want to try it out later after the session https://github.com/allanchua101/avatar-generator

Slide 39

Slide 39 text

Let’s setup a project

Slide 40

Slide 40 text

Type all this code guys GENERATE-AVATAR.JS

Slide 41

Slide 41 text

Run the code

Slide 42

Slide 42 text

Let’s beautify our output Install colors package using the code above

Slide 43

Slide 43 text

Update our javascript logging code Let’s utilize colors to sprinkle creativity on our logs

Slide 44

Slide 44 text

Results Before change and after ^_^

Slide 45

Slide 45 text

Let’s go crazier and make graffiti out of the text

Slide 46

Slide 46 text

Update our Code again

Slide 47

Slide 47 text

Sweet graffiti in your logs

Slide 48

Slide 48 text

Challenge for this week

Slide 49

Slide 49 text

Homework - I would strongly suggest using dual boot and have ubuntu as the 2nd boot system of your pCs - If you are in windows and you love it, setup WSL - Install Node JS - Install NVM

Slide 50

Slide 50 text

Homework 1 Create a NODE JS script that can convert EXCEL files to JSON and save it on the disk

Slide 51

Slide 51 text

Homework 2 Create a NODE JS script that can convert JSON files to EXCEL and save it on the disk

Slide 52

Slide 52 text

Homework 3 Create a NODE JS script that can add a background image to a transparent PNG file and save it on the disk

Slide 53

Slide 53 text

Homework 4 Create a NODE JS script that generates a QR code for a website and save it on the disk

Slide 54

Slide 54 text

Homework 5 Create a NODE JS script that generates a barcode based on the provided product ID and save it on the disk

Slide 55

Slide 55 text

Homework 6 Create a NODE JS script that retrieves data from movie list API and generate an excel file from it. Use this package: https://www.npmjs.com/package/movie-list-node

Slide 56

Slide 56 text

Next Week We will take a look at each of your outputs and

Slide 57

Slide 57 text

Next Session We will look into frontend development using React JS