Startec

Startec

How to use DEV.to API

Mai 22, às 01:48

·

4 min de leitura

·

0 leituras

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...
How to use DEV.to API

Cover image for How to use DEV.to API

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());

Enter fullscreen mode Exit fullscreen mode

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"
 }
 }
]

Enter fullscreen mode Exit fullscreen mode

Get article by id

const article = fetch(`https://dev.to/api/articles/${articleId}`).then((res) => res.json());

Enter fullscreen mode Exit fullscreen mode

Get article by post slug

const article = fetch(`https://dev.to/api/articles/<your_username>/${slug}`).then((res) => res.json());

Enter fullscreen mode Exit fullscreen mode

User data

By user_id

const user = fetch(`https://dev.to/api/users/${userId}`).then((res) => res.json());

Enter fullscreen mode Exit fullscreen mode

By username

const user = fetch(`https://dev.to/api/users/by_username?url=${username}`).then((res) => res.json());

Enter fullscreen mode Exit fullscreen mode

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:

  1. Access the settings page of your account on DEV.to and generate an API Key.
  2. 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());

Enter fullscreen mode Exit fullscreen mode

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:

  1. 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.
  2. 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.
  3. 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.
  4. 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.

Continue lendo

Showmetech

Motorola Razr Plus é o novo dobrável rival do Galaxy Z Flip
Após duas tentativas da Motorola em emplacar — novamente — telefones dobráveis, eis que temos aqui a terceira, e aparentemente bem-vinda, tentativa. Estamos falando do Motorola Razr Plus, um smartphone...

Hoje, às 15:20

DEV

Mentoring for the LGBTQ+ Community
Once unpublished, all posts by chetanan will become hidden and only accessible to themselves. If chetanan is not suspended, they can still re-publish their posts from their dashboard. Note: Once...

Hoje, às 15:13

TabNews

IA: mais um arrependido / Déficit de TI / Apple: acusação grave · NewsletterOficial
Mais um pioneiro da IA se arrepende de seu trabalho: Yoshua Bengio teria priorizado segurança em vez de utilidade se soubesse o ritmo em que a tecnologia evoluiria – ele junta-se a Geoffr...

Hoje, às 14:37

Hacker News

The Analog Thing: Analog Computing for the Future
THE ANALOG THING (THAT) THE ANALOG THING (THAT) is a high-quality, low-cost, open-source, and not-for-profit cutting-edge analog computer. THAT allows modeling dynamic systems with great speed,...

Hoje, às 14:25

TabNews

[DISCUSÃO/OPINIÕES] – Outsourcing! O que, para quem, por que sim, por que não! · dougg
Quero tentar trazer nesta minha primeira publicação, uma mistura de um breve esclarecimento sobre o que são empresas de outsourcing, como elas funcionam e ganham dinheiro, mas também, ven...

Hoje, às 13:58

TabNews

Duvida: JavaScript - Desenvolver uma aplicação que vai ler um arquivo *.json · RafaelMesquita
Bom dia a todos Estou estudando javascript e me deparei com uma dificuldade e preciso de ajuda *Objetivo do estudo: *desenvolver uma aplicação que vai ler um arquivo *.json Conteudo do in...

Hoje, às 13:43

Showmetech

Automatize suas negociações com um robô de criptomoedas
Índice Como o robô de criptomoedas Bitsgap funciona?Qual a vantagem de utilizar um robô de criptomoedas?Bitsgap é confiável? O mercado de trading tem se tornado cada vez mais popular e as possibilidades de...

Hoje, às 13:13

Hacker News

Sketch of a Post-ORM
I’ve been writing a lot of database access code as of late. It’s frustrating that in 2023, my choices are still to either write all of the boilerplate by hand, or hand all database access over to some...

Hoje, às 13:11

Showmetech

14 chuveiros elétricos para o banho dos seus sonhos
Índice Chuveiro ou Ducha?Tipos de chuveiro elétrico9 fatores importantes para considerar na hora de comprar chuveiros elétricosMelhores chuveiros elétricosDuo Shower LorenzettiFit HydraAcqua Storm Ultra...

Hoje, às 11:00

DEV

Learn about the difference between var, let, and const keywords in JavaScript and when to use them.
var, let, and const: What's the Difference in JavaScript? JavaScript is a dynamic and flexible language that allows you to declare variables in different ways. You can use var, let, or const keywords to...

Hoje, às 10:21