In this post, we'll explore how to use the DEV.to API and show some practical examples of how you can use it in your application to display the list of published posts and how to show a post.
What is the Dev.to API?
The DEV.to API is an application programming interface (API) that allows developers to interact with the DEV.to platform. With it, you can create, read, update, and delete articles, as well as perform other operations related to community interactions, such as following users, listing followers, getting notifications, and much more.
How to use the API?
The API can be used by any application, with or without an API Key. In your application, just fetch the endpoint, as follows:
How to show artibles list without API Key:
const articles = fetch(`https://dev.to/api/articles?username=${username}`).then((res) => res.json());
Response
[ { "type_of": "article", "id": 1419842, "title": "Hey there!", "description": "Did u know, that this is my first draft? I'm actually testing the API", "readable_publish_date": "Apr 6", "slug": "hey-there-34hj", "path": "/guilhermecheng/hey-there-34hj", "url": "https://dev.to/guilhermecheng/hey-there-34hj", "comments_count": 0, "public_reactions_count": 0, "collection_id": null, "published_timestamp": "2023-04-06T23:29:44Z", "positive_reactions_count": 0, "cover_image": null, "social_image": "https://dev.to/social_previews/article/1419842.png", "canonical_url": "https://dev.to/guilhermecheng/hey-there-34hj", "created_at": "2023-03-29T23:59:07Z", "edited_at": null, "crossposted_at": null, "published_at": "2023-04-06T23:29:44Z", "last_comment_at": "2023-04-06T23:29:44Z", "reading_time_minutes": 1, "tag_list": [ ], "tags": "", "user": { "name": "Guilherme Cheng", "username": "guilhermecheng", "twitter_username": null, "github_username": "Guilhermecheng", "user_id": 1046757, "website_url": null, "profile_image": "https://res.cloudinary.com/practicaldev/image/fetch/s--sDcHxoDy--/c_fill,f_auto,fl_progressive,h_640,q_auto,w_640/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/1046757/543e3ca0-4f99-46ba-b8a1-79c06976b72b.jpeg", "profile_image_90": "https://res.cloudinary.com/practicaldev/image/fetch/s--4IlcgxTN--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/1046757/543e3ca0-4f99-46ba-b8a1-79c06976b72b.jpeg" } } ]
Get article by id
const article = fetch(`https://dev.to/api/articles/${articleId}`).then((res) => res.json());
Get article by post slug
const article = fetch(`https://dev.to/api/articles/<your_username>/${slug}`).then((res) => res.json());
User data
By user_id
const user = fetch(`https://dev.to/api/users/${userId}`).then((res) => res.json());
By username
const user = fetch(`https://dev.to/api/users/by_username?url=${username}`).then((res) => res.json());
With the API Key
Setting up your application to use the DEV.to API:
Before you start using the DEV.to API, you'll need to configure your application to authenticate properly. To do this, follow these steps:
- Access the settings page of your account on DEV.to and generate an API Key.
- In your code, use this API Key to authenticate your requests to the API. There are libraries for various languages that make this process easier, so choose the one that best suits your application.
Display the list of posts with the API Key
const articles = fetch("<https://dev.to/api/articles/me>", { headers: { "api-key": process.env.API_KEY, }, }).then((res) => res.json());
Other possibilities through the API
Now that you've configured your application to use the DEV.to API, let's take a look at what else you can do:
- Publish a new article: Use the API to create a new article directly from your application, automating the publication process and allowing you to share content more efficiently.
- Retrieve articles from a specific user: With the API, you can get a list of articles published by a particular user. This can be useful for displaying a "recent articles" section on your website or application.
- List your followers: Through the API, you can get a list of users who follow you on DEV.to. This information can be used to personalize the experience of your followers in your own application.
- Send notifications: The API also allows you to send notifications to your followers on DEV.to. For example, you can send a notification to your followers when you publish a new article or perform some other relevant action.