I'm feeling a little lost trying to navigate my Express app. Can anyone help clarify which specific portion is considered

I'm feeling a little unsure about this, but I'm currently working on an express API app as part of a Codecademy exercise and I'm not quite sure which aspect of the app actually constitutes the API.

Essentially, there's a file that contains various quotes which are then displayed in the browser. Users can interact with these quotes by either getting a random one (by clicking a 'random quote' button), fetching all the available quotes, or even adding their own quote to the mix.

So, where does the API fit into all of this? I know that an API serves as a bridge between different software components, but I'm struggling to grasp how it operates within the context of this project. To give you a better idea, here's the code snippet for the 'fetch all quotes' functionality:

scripts.js

fetchAllButton.addEventListener('click', () => {
  fetch('/api/quotes')
  .then(response => {
    if (response.ok) {
      return response.json();
    } else {
      renderError(response);
    }
  })
  .then(response => {
    renderQuotes(response.quotes);
  });
});

server.js

app.get('/api/quotes', (req, res) => {
  let quoteMatch;
  let quoteSearch = req.query.person;
  if (quoteSearch == undefined) {  
    res.send({quotes: quotes})
  } else {
    quotesMatch = quotes.filter(quote => {
      return quote.person == quoteSearch && quote;
    });
    if (quoteMatch) {
      res.send({ quotes: quotesMatch });
    } else {
      res.status(404).send('Author not found!! 😡');
    }
  }
})

data.js

const quotes = [
  {
    quote: 'We build our computer (systems) the way we build our cities: over time, without a plan, on top of ruins.',
    person: 'Ellen Ullman'
  },
  {
    quote: 'The best thing about a boolean is even if you are wrong, you are only off by a bit.',
    person: 'Anonymous'
  },

Answer â„–1

The code for your API can be found in the server.js file.

In scripts.js, you will see how the API is called from the front-end.

Answer â„–2

Your script.js acts as the client making requests to /api/quotes, while your server.js serves as the API handling those requests

app.get('/api/quotes', (req, res) => {
})

This code snippet in the server.js file defines a route in the API that specifies how to handle any incoming requests to the '/api/quotes' URL

Answer â„–3

The server.js API is set up to listen at the URL '/api/quotes'. It will respond with res.send({quotes: quotes}) when accessed using the HTML GET method.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Exploring TypeScript Module Importation and WebPack Integration

Struggling with WebPack's injection of imported dependencies for a TypeScript project. The first challenge is getting TypeScript to recognize the imported module. In the header.ts file, there is a declaration of a module nested under vi.input, export ...

javascript with a focus on objects

Having trouble with the scene.add(Obj); line for my object player1. I keep getting an error saying that Obj does not exist: function Player(x, y, z) { this.Speed = 0; this.AngleAcc = 0; this.Angle = 0; this.X=x; this.Y=y; this.Z=z; this.MaxSpeed = ...

What is the best way to configure a metered subscription plan on Stripe that invoices annually but bills extra fees for overage on a monthly basis

I'm in the process of setting up a subscription system on stripe that includes a plan with 5000 monthly credits for a flat $299 yearly fee. My goal is to charge customers who exceed their monthly credit limit by the end of each month. For example, if ...

Is there a method to verify the consumability of an API without having to make a direct request to it?

I'm working on an idle timer feature where the API will be called to update data once the timer runs out. How can I check if the API is still usable without actually sending a request? ...

Joining Two Texts in HTML with a Link Embedded within

Within my HTML code, I have two specific strings: "Forgotten your password?" and "Please" 'HPERLINK' "to change your password". To manage these strings efficiently in different languages, I utilize a messageBundle file to store constants. This f ...

Following the same occurrence using varying mouse clicks

I am currently exploring the most effective method for tracking file downloads (specifically, pdf files) on my website using Google Analytics (UA). I understand that by utilizing <a href="book.pdf" onClick="ga('send','event','P ...

I am encountering difficulty accessing my index.html file located in the views directory. Whenever I try to access it through localhost 3000, I receive an error message saying "cannot get"

My files are available for viewing on github at https://github.com/elmoreka/myTaskLIst.git. I'm experiencing issues with my index.html file located in the views directory. When trying to access localhost 3000, I receive an error stating "cannot get". ...

Determine the return type of a function based on a key parameter in an interface

Here is an example of a specific interface: interface Elements { divContainer: HTMLDivElement; inputUpload: HTMLInputElement; } My goal is to create a function that can retrieve elements based on their names: getElement(name: keyof Elements): Elemen ...

Is there a guarantee that XHR requests made within a click handler of an anchor tag will always be sent?

I'm trying to find information on whether an XHR request triggered in an anchor tag's click event handler is guaranteed to be sent. Despite my attempts at searching, I can't seem to locate a definitive answer. The specific question I have i ...

Using ExpressJS to nest routes within routes

I'm currently exploring NodeJS to develop a simple website for my own learning purposes. One challenge I am facing is setting up a basic User API with CRUD operations, specifically when it comes to creating a new user. Here's the code snippet fo ...

Ways to verify the existence of a username in WordPress without the need to refresh the page

How can I check if a username exists in the database without refreshing the page in a Wordpress form using AJAX? I've tried implementing AJAX in Wordpress before but it didn't work. Can someone provide me with a piece of helpful code or a link to ...

Connection has been terminated: ERR_CONNECTION_CLOSED

Greetings, I've encountered a problem while using Chrome. I'm unsure if it's an issue with my code or with Chrome itself. The error message I receive is: Failed to load resource: net::ERR_CONNECTION_CLOSED The URL in question is identified ...

Accordion content in motion

After creating an accordion, I wanted to enhance the user experience by adding a transition effect whenever they click on the accordion header. Even though I included height: auto and transition in the accordion container, it did not seem to have any impa ...

Expansive image coverage

My footer design includes a rounded left image, a repeating middle section, and a rounded right image. How can I ensure that it scales perfectly responsively without overlapping? Ideally, the solution would involve adjusting the width of the middle section ...

NPM is currently malfunctioning and displaying the following error message: npm ERR! 404

When running npm update -g, the following error occurs: npm ERR! code E404 npm ERR! 404 Not found : default-html-example npm ERR! 404 npm ERR! 404 'default-html-example' is not in the npm registry. npm ERR! 404 You should bug the author to publi ...

Using the power of jQuery, execute a function only once when the element is clicked

My goal is to use jQuery's .one method to change the color of an element only once, even if clicked again. However, I am having trouble getting it to work properly. Here is my HTML: <!DOCTYPE html> <head> <meta charset="UTF-8"& ...

What is the best way to create a time delay between two consecutive desktop screenshot captures?

screenshot-desktop is a unique npm API that captures desktop screenshots and saves them upon request. However, I encounter the need to call the function three times with a 5-second delay between each call. Since this API works on promises, the calls are e ...

Using the power of ReactJS, efficiently make an axios request in the

After familiarizing myself with Reactjs, I came across an interesting concept called componentDidUpdate(). This method is invoked immediately after updating occurs, but it is not called for the initial render. In one of my components, there's a metho ...

Error: Unable to locate module: Could not find '@/styles/globals.scss'

I'm encountering an error message with my import statement for the SCSS file in my _app.tsx. Can someone help me find a solution? I'm working with Next.js and have already exhausted almost every resource available online to fix this issue. ...

Notifying the chosen option using jQuery

I have been attempting to display an alert on the webpage based on the selected option. Unfortunately, it appears that my code is not functioning properly. This is what I have tried: $(document).ready(function(){ $("select.country").change(functio ...