/Lab2.1-cat-me-jokes

Intro to Nodejs, npm, Express Server

Primary LanguageJavaScript

Lab2.1-cat-me-jokes

Introduction to nodejs, npm, express

You forked the repository

  1. cd into the Lab02-cat-me-jokes directory
  2. run "npm install" command
  3. Relax for a few minutes. Please watch videos located in canvas, week01-Representing-The-Web:
    1. Intro to nodejs, npm, installing knock-knock-jokes (~10min)
    2. Nodejs, npm, jokes and cat-me packages (~10min)
    3. Express Server intro Hello World (~10min)
    4. Express Server Adding routes: /cat, /dog, /dog/10 (~10min)
  4. Open the folder using Visual Studio Code
  5. Follow the instructions.
  6. When you are ready, make a "Pull Request" to the original repo (mine)

Steps to create the App

Step One

  1. navigate to your Desktop Window (or your workspace))
  2. create a project that will contain your app
  3. type: mkdir 'a-name-for-your-app'
  4. cd a-name-for-your-app
  5. npm init -y
  6. npm install express ejs mongoose cors dotenv
  7. npm install @babel/node @babel/core @babel/preset-env --save-dev
  8. touch index.js
  9. find the express modules in your node_modules folder for instructions and help
  10. Open the file README.md. Hover over the tab at the top of the editor, right-click and select "open Preview". Conversely, visit the expressjs dot com web site, select "Getting started Hello world" tab.
  11. open index.js and write/copy/paste the code to execute "Hello World"
  12. On terminal type "node index.js"
  13. Open browser and type the URL http://localhost:3000
  14. You should see a message "Hello World!!!"
  15. Kill the server using Control-C

Congratulations!! Pat yourself in the back, you created an express server!!!

Step Two

  1. open index.js for editing
  2. Change the listening port to 4444
  3. Save your changes, or config the VS Code to automatically save (I do not like it, but it is your choice)
  4. create a second route '/cat'
  5. send the response as "MEOW!!"
  6. start the server (node index.js), open the browser and type in the navigation bar: http://localhost:4444/cat and see the messagge "MEOW!!!"

Congratulate yourself, you have created a new route!!!

Step Three

  1. You will create a route that will accept parameters. In the code a parameters is identified by the colon ":" character in the route.
  2. create a route "/:animal/
  3. Inside the route add a condition where the message sent in the response corresponds to the animal typed: For instance, if the animal type is cat, it show "MEOW", if it is dog, it shows "WOOF", if it is a pig, it shows "OINK", etc. Include an else statemnet the show the message "The animal is not in our zoo"
  4. Create a route with a parameter an animal name, followed by a parameter number, which represent the number of times the animal makes its sound.

Step Four

Assign to student

  1. you have a zoo with three animals: cat, dogs, and pigs
  2. Modifiy the code so when the user select an animal, the corresponding message is its sound, when the animal does not exist the output should be the name of the animal followed by the message "do not exist in our zoo".
  3. You should use an if/else statement in your code. Conversely, you could use a switch statement.