Jane Week 3 Day 2 "Today-I-Learned..."

Best practice for structuring JS code:

All querySelecting at the top
All eventListening at the bottom
All function declarations in between

APIs:

HTML, CSS and JS are for the front-end
Backend is JUST JS (it’s just for the purpose of storing data, and sending data back and forth) - use node.js
Application Programming Interface = API (the high-level idea is this - give me data in a certain shape, I will return data in another shape) - .fetch is being used for this
Keeps track of information (a server stores them) unlike a browser which starts blank each time
Outside of REPL, we need to install on the local machine for Express, see link Andy shared ($ npm install express --save)

API Codes: Const express = require(‘express’) //go find package called express in the npm, and store it in a constant called express Const app = express() //code explaining how api is supposed to work GET request — gets some information POST request — creating something new PUT or PATCH requests - update some DELETE request — deletes some existing information HEAD request — is everything ok? (RESTful API - representational status transfer - information that’s already stored)

GET request example: app.get(“/message”, (_request,response) => { Response.json({hello: “world”}) })

POST request example: Let counter = 0 App.post(“/counter”, (_request,response) => { counter += 1 response.json({counter: counter}) })

Postman is a tool for making requests
The network tab shows all api requests that says xhr or fetch are post requests
If I am ordering from a mobile app, the post request sends request to backend, backend will receive information from my frontend, confirm my order, send it to restaurant POS, and responds back with success message once the whole transaction is complete

Building an NPI:

const express = require (“express”)
const app = express ()
body of code - what is this API about app.get(“/tasks”) <- get the user a list of all tasks app.post(“/tasks”) <- create a new task app.patch(“/tasks/:id”) <- update something about a specific task app.delete(“/tasks/:id”) <- delete a specific task
app.listen(3000, () => “Server is up and running”)

app.use(express.json()) - tells the app to be able to read incoming json requests

We can send in json requests using postman (or postman can intake requests from the actual front end, and send it to our backend api)

rbi-learning / Today-I-Learned

Jane Week 3 Day 2 "Today-I-Learned..." #105