How to Fetch Your Posts From dev.to API With JavaScript

olawanle_joel

Joel Olawanle

Posted on June 19, 2020

How to Fetch Your Posts From dev.to API With JavaScript

The Fetch API is a modern interface that allows you to make HTTP requests in the web browsers. It is a simple and clean API that uses Promises to deliver more flexible features to request resources from the server.

If you have worked with XMLHttpRequest (XHR) object, the Fetch API can perform all the tasks as the XHR object.

In the article, you will learn how to make use of the FETCH API in JavaScript to fetch all your written posts from dev.to Free API.

The Devcommunity API would really be helpful for individuals putting up a small portfolio and not ready to build a blog section.

You can easily call all your published articles/posts from Devcommunity to your portfolio blog section.

Getting Started

The fetch() method returns a Promise which we allow us to use the then() and catch() methods to handle response, either success or failure:

Here is a simple syntax:

    fetch(url) 
    .then(response => {
     // handle the response 
     }) 
     .catch(error => {
      // handle the error
     });
Enter fullscreen mode Exit fullscreen mode

Here is a link to the Devcommunity API where you can access your articles - https://dev.to/api/articles?username=olawanle_joel

All you have to do is replace the username with yours.

Using fetch API

Below I will be fetching from the Devcommunity API.

    fetch('https://dev.to/api/articles?username=olawanle_joel')
    .then((response) => response.json())
    .then(data => console.log(data))
    .catch((error) => console.log(error));
Enter fullscreen mode Exit fullscreen mode

The above code will return all your articles from Devcommunity as Json to my Dev Console.

There are other formats or methods of returning the response, such as:

  • text()
  • blob()
  • fromData(), e.t.c.

Summary

Once you have successfully fetched all the results of the API and it returns the content as expected. You can now start making use of those values.

Here is a repository in which I made use of the Devcommunity api to call my articles to a mini portfolio.

Useful Resources

💖 💪 🙅 🚩
olawanle_joel
Joel Olawanle

Posted on June 19, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related