Fullstack JavaScript

We will start by looking at the different Array methods, and how data can be sorted and filtered in the frontend.

We will build a full CRUD application with a backend and a frontend. We will look at how the two parts can be connected, so that the frontend can send HTTP requests to the backend. Along the way, we will configure CORS so that the frontend and backend can communicate correctly.

Before class

Practical requirements

Recommended reading and videos

• Array methods (10 min video): https://youtu.be/R8rmfD9Y5-c
• Cross-Origin Resource Sharing - CORS (2 min video): https://youtu.be/4KHiSt0oLJ0

Extra resources

• Reference for JavaScript Array methods:
  • JS Array sort: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort
  • JS Array filter: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
  • JS Array map: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map
  • JS Array reduce: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce
• CORS: https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/CORS
• Spring Boot & CORS: https://spring.io/guides/gs/rest-service-cors

During class

We will use these 📄 JavaScript Fullstack (PDF) and you will have time to do the exercises.

Demos used in class:

• TBD

After class

Finish the exercises.