angularjsnotes/Day 4/readmes/install_test_api.md

Set Up an API

Lesson Objectives

1. Set up an pre-built API
2. Familiarize Yourself with the API
3. Test API
4. Onwards to full day build full CRUD app with Angular

Today's Build

We'll be building a tiny app that let's us create, read, update and delete national holidays, using the MEAN stack. We will be starting with a completed back end.

Define API

• An API stands for Application Program Interface
• It is a set of routines, protocols, and tools for building software applications
• It specifies how software components should interact
• Essentially it's documentation, but in the industry, it's come to mean a program or some existing software that you use to build your own app

Set Up

1. got to today's student_examples and cd into holdiays_app
2. npm i
3. new terminal tab, start mongod
4. new terminal tab, start nodemon
5. open Postman, or equivalent

Exploring the back end

Review and discuss as a class:

1. The required npm modules are __________
2. Are there any new npm modules? Any that might be missing for our needs?
3. The server has a port of __________
4. The main routes are located __________
5. In the __________ controller, the following routes are available: __________
6. When you go to localhost: __________ the following page will load __________
7. We have one model, what are the key values and data types?

Test our routes

Using Postman (or equivalent)

• We have 4 routes to test
• Create : post /holidays : adds a new holiday
• Index : get /holidays : shows all holidays
• Update : put /holidays/id : updates a holiday
• Destroy : delete /holidays/id : deletes a holiday

Test Create (add at least 3 holidays + 1 called 'update me')

Need a holiday?

In Postman

• choose POST
• url: localhost:3004/holidays
• body: name : World Kindness
• Send

• Expected Output

• Add two more holidays with the Post route
• Add one more holiday called update me

Test Index Route

In Postman

• choose GET

• url: localhost:3004/holidays

• Send

• Expected Output

Test Update Route

In Postman

Don't leave your index route yet!

• copy the _id of your Update Me holiday

• choose PUT

• url: localhost:3004/holidays/that copied _id you got from your index route

• body:
• name : delete me
• celebrated : true
• Send

• Expected Output

• Do another get request to the index to double check

• Expected Output

Test Delete Route

In Postman

Don't leave your index route yet!

• copy the _id of your Update Me holiday

• choose DELETE

• url: localhost:3004/holidays/that copied _id you got from your index route

• Expected Output

• Do another get request to the index to double check

• Your delete me holiday should be gone

Take aways

• taking the time to familiarize yourself with the back end and then testing it allows you to:
  • get familiar with the routes available
  • get familiar with how the routes work
  • check that the routes work as expected: As you start building your front-end, you'll run into errors. By testing the back end and knowing it works, you can better isolate the source of your errors, this will make debugging easier

Onwards

• go to the angular_set_up.md