Giter Site home page Giter Site logo

pursuit-core-web-middleware-lab's Introduction

Pursuit-Core-Web-Middleware-Lab

Middleware Exercises

Create a new Express app and make base routes for each of these functionalities.

Note: Even though many of these functionalities could technically be created without middleware, as our projects ramp up in complexity, it is far cleaner to implement your app's routing with middleware.

/animal - Valid animal tester.

Backend

Create an array or an object and fill it with strings representing animal species (e.g. 'zebra', 'tiger', etc.).

When you query your localhost app at the route /animal, appending an animal's name (e.g. localhost:3000/animal/lion), you should return a boolean as a response - true or false depending on whether their second parameter (lion) can be found in your animal list. Your response should be in this format:

{
  status: "success",
  message: true
}

Create a middleware function, isAnimal, to check if the requested animal is in the list and route the user's request accordingly. As your user doesn't need to update, delete, or add information, this can be a GET request.

Front-end

Create an input and a button. Clicking on the button should send a request to this endpoint. Display the result using whatever UI you want to.

/random - Random number picker.

Backend

The user should be able to query /random with two additional request parameters: A floor and a ceiling, both integers. Create a route that accepts a GET request to pick a random number between the floor and the ceiling.

For example, the request at localhost:3000/random?floor=10&ceil=23 should return a random number between 10 and 23. The response should look like this:

{
  status: "success",
  range: [10, 23],
  randPick: 17
}

In order to help us pick a random number, we first need to assemble an array with each number in between the numbers in our range. Create a middleware function generateSpread which assembles an array of all integers between the two inputs. Once you've assembled this array, send your response with a random choice from it.

Front-end

Create two additional inputs and an additional button. Clicking the button should call the endpoint with the floor and ceiling from the inputs, then display the result.

/queue - Queue manager.

Backend

Create an array full of strings representing people's names in some kind of line (or queue). Account for three additional URL parameters: /peek, /enqueue, and /dequeue. These should access and modify the array in the same ways that you'd access and modify a queue. For our purposes, the end of the array will represent the front of the queue. For example, with the array ['xavier', 'michelle', 'corey', 'reed']:

  • localhost:3000/queue/peek would return the response:
{
 status: "success",
 data: "reed"
}
  • localhost:3000/queue/enqueue?name=elle would return the response:
{
  status: "success",
  enqueued: "elle"
}

And should add "elle" to the queue at the end. Behind the scenes, the queue is:

["elle", "xavier", "michelle", "corey", "reed"];
  • localhost:3000/queue/dequeue would return the response:
{
  status: "success",
  dequeued: "reed"
}

And should modify the array to be:

["elle", "xavier", "michelle", "corey"];

Create a middleware function, handleQueue, that performs the appropriate action on the array depending on which URL parameters are queried.

Front-end

Add another input and buttons for "peek", "enqueue", and "dequeue".

pursuit-core-web-middleware-lab's People

Contributors

kevinbrutus530 avatar benstone1 avatar alejo4373 avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.