DEV Community

Cover image for API Endpoints or Routes✈
Daniel
Daniel

Posted on

API Endpoints or Routes✈

How often have you heard about endpoints or routes in APIs but found it difficult to grasp? πŸ™‚πŸ˜‘. Come with me😎, as you reach the end of this article, you will feel comfortable whenever you encounter terms like 'endpoints' or 'routes.' Additionally, you'll be able to implement them on your own using Node.js and Express.πŸ˜ŠπŸ˜‰..

What are endpoints or routes?πŸ€·β€β™‚οΈπŸ˜ͺ

Endpoints are the app's units of executable request-handling code. Huhh??πŸ™„πŸ™‚.. Simply put, an endpoint or route is, as its name implies, basically a pathway or road πŸš˜πŸš† that leads to a destination.. That is, as known from the knowledge of what an API is from the first episode of "Your first backend project" [you could check on it, if you missed it Your first backend project - 1] So an API we got to know is a single link that leads you to a specific application which will allow you to access resources, post(save) resources or utilize a function/processes/methods already implemented in an application Hence each of the options would have a path on the parent URL respectively. Cool?😁...

Routes in skeletonπŸ˜‚πŸ˜Ž

Now that we've grasped the essence of routes/endpoints, let's delve into the details and solidify our understanding once and for all! πŸ˜ŽπŸ˜‰ No time to waste here! 😎
Imagine the link to Amazon 🎁 as our API. Folks 😁, visit our API at www.amazon.com. Clicking on the link takes you to an APPLICATION created by someone. Once you land on the Amazon page, you'll discover numerous options within the application, beyond just buying or viewing. It's packed with various functions, and each function is accomplished through a route.
For instance, when you click on 'registry,' a link or route like www.amazon.com/registries is what guides you to that specific service. Folks, that's a route! πŸ˜‚πŸ˜€ Isn't this breathtaking? πŸ˜πŸ˜‚.. So, from the new link www.amazon.com/registries, we can still see www.amazon.com, our API, and /registries. Therefore, /registries is our endpoint or route, and www.amazon.com is our application/API/Parent URL.

Let's write our Endpoints or Routes too!πŸ˜‰πŸ§

So, before we dive into writing our codes, let's carefully note how applications work. We interact with an application by requesting the Amazon platform to help us with a little ChristmasπŸ› shopping. In turn, Amazon responds to us with various items we need for a happy Christmas! πŸŽ†πŸŽ„. Carefully get your Christmas stuffs down!πŸ˜‰πŸš€ from Amazon. so you see we have two operations here:

  • we Request and
  • Amazon in turn Respond Hence, the first step is to find yourself at a route, initiate a request, and then await a response.😎 Clear? That is all about it. C'mon we've talked plenty no codesπŸš€.. let's write some codes.πŸ‘¨β€πŸ’»

Implementing our codes

By now, you should be good to go with setting up your backend project. Installing the Express package and configuring it is just a piece of cake for a pro! πŸ˜ŽπŸ˜‰ If you haven't read the initial article, check it out Your first backend project - 1]!
After setup--this is from the previous article

API setup

HTTP REQUEST METHODSπŸš€πŸͺ‚

Don't be frightened by the heading. It's as simple as it will always be for a pro like you! πŸ˜πŸ‘¨β€πŸ’»!. As we have learned from above, we interact with applications by requesting an action. 😎 But have you realized that even though you interact with the application by requesting, there are different things you can ask the application to do for you?πŸ€·β€β™‚οΈ This could include filling out a form🌠, deleting items from your Google Drive, updating your status, or simply getting an interesting article like this 😁😎 to readπŸ˜ŽπŸ€·β€β™‚οΈ..
So these various activities are called the METHODS! So, applications use several methods to implement our requests based on what we desire, but four are mostly used and dominant: GET, POST, DELETE, and PUT. These terms might not be so strange if you think about them in the context of English vocabulary, right? πŸ˜‰πŸ˜. So:

1.GET is used to retrieve or read information

  1. POST is utilized for creating data within an application or feeding it with information, just like filling out a form.
  2. DELETE is employed to remove or delete information
  3. PUT is used to update an already existing information.

All Knowledge needed for implementing a route is settled, lets see an anatomy of if it and wrap up!

Anatomy
Let's break it down and see from the various sections of the code.

  1. app is the initialized express package we installed for our API setup in the first article.
  2. ".get()" is a method called on the app([const app = express()] which is obviously the package necessary for our API project)πŸ˜‰. So it means we could also use .post(), .put(), .delete() methods.We could see the method takes in two parameters, which is explained below:

  3. "/read" is the first parameter in the METHOD(not only get(), but for the rest as well) for our route or endpoint! πŸͺ‚ That means, in the address bar after inserting our parent URL, we only add "/read" to navigate to this route or endpoint. So, suppose our parent URL/API is www.ourbackend.com. Then this particular endpoint will be www.ourbackend.com/read πŸš€.

  4. The second parameter, which is "(request, response) => { response.send("You want to read an article like the one you are reading?") }," is always a callback function. This function is invoked immediately when this endpoint is called upon πŸ’». So, in this case, if our endpoint is indeed www.ourbackend.com/read, when someone calls this endpoint, they will see the response: 'You want to read an article like the one you are reading?' because the application is responding with that! πŸ–₯πŸš€ This is breathtaking, seasoned pro!πŸ‘¨β€πŸ’»πŸͺ‚. Clear?πŸ₯±πŸ˜Ž. Fellas, that means the callback function could be written to do anything whatsoever! Like: allowing user to register a form, delete a blog, update a blog, etc.

Warm up skillsπŸ˜ŽπŸš€πŸ‘¨β€πŸ’»

Fellas, you've read quite a bit, and now it's time to put your knowledge into action! As a warm-up for the real implementations in the next blog πŸ’¬πŸš€πŸ‘¨β€πŸ’», let's modify the endpoints using various methods like post(), put(), and others. Keep the same format, but change the message and methods. This practice will help stabilize your understanding. In the next article, we'll delve into real implementations and explore industrial-standard tools for testing. Remember, the web browser can only test get() method, so don't miss out on that for anything! πŸ˜ͺπŸ˜‰ Gear up for some hands-on experience to activate your seasoned pro spirit! πŸ˜πŸ‘¨β€πŸ’»πŸ“²

Don't forget to react to the article and comment as well! πŸ˜ŽπŸ“² Let's build a community of fellow devs!
see below for the first article!
Your first backend project - 1]

Top comments (2)

Collapse
 
mustaphi profile image
Mustapha7018

Good one there πŸ”₯

Collapse
 
acourage369 profile image
BrainyYawson

PowerfulπŸ”₯