Introduction
If you've been looking for an easy way to interact with the DEV API using JavaScript or TypeScript you're in the right place!
I recently dove into the entire DEV API Documentation and created a fully typed API wrapper named devdotto
. Although I still consider it to be in it's early stages, the NPM package has full coverage of the DEV API.
GitHub: https://github.com/Elitezen/devdotto
NPM: https://www.npmjs.com/package/devdotto
This package uses the fetch API which is included in the latest version of NodeJS (18.3.0), make sure to update before testing the package out.
Installation
npm i devdotto
Quick Examples
Fetching The Latest Articles
To fetch the latest articles use the getArticles()
function.
import { getArticles } from 'devdotto';
const articles = await getArticles();
console.log(articles);
Output:
[
{
typeOf: 'article',
id: 1129536,
title: 'Follow Friday: React Edition (1 July 2022)',
description: 'Happy Friday, friends! 🎉 Follow Friday is your weekly opportunity to shout out fellow DEV Community...',
readablePublishDate: 'Jul 1',
slug: 'follow-friday-react-edition-1-july-2022-2kpa',
path: '/devteam/follow-friday-react-edition-1-july-2022-2kpa',
url: 'https://dev.to/devteam/follow-friday-react-edition-1-july-2022-2kpa',
commentsCount: 5,
publicReactionsCount: 20,
collectionId: 18283,
publishedTimestamp: '2022-07-01T14:49:40Z',
positiveReactionsCount: 20,
coverImage: null,
socialImage: 'https://dev.to/social_previews/article/1129536.png',
canonicalUrl: 'https://dev.to/devteam/follow-friday-react-edition-1-july-2022-2kpa',
createdAt: '2022-07-01T14:49:40Z',
editedAt: null,
crosspostedAt: null,
publishedAt: '2022-07-01T14:49:40Z',
lastCommentAt: '2022-07-01T18:06:29Z',
readingTimeMinutes: 1,
tagList: [ 'watercooler', 'meta', 'javascript', 'react' ],
tags: 'watercooler, meta, javascript, react',
user: {
name: 'Erin Bensinger',
username: 'erinposting',
twitterUsername: 'erinposting',
githubUsername: 'erinb223',
websiteUrl: null,
profileImage: 'https://res.cloudinary.com/practicaldev/image/fetch/s--6nTNzTEG--/c_fill,f_auto,fl_progressive,h_640,q_auto,w_640/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/494502/2d4eb07b-a07a-46f9-91cd-1b98d862a13c.png',
profileImage90: 'https://res.cloudinary.com/practicaldev/image/fetch/s--VG4G50pa--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/494502/2d4eb07b-a07a-46f9-91cd-1b98d862a13c.png'
},
organization: {
name: 'The DEV Team',
username: 'devteam',
slug: 'devteam',
profileImage: 'https://res.cloudinary.com/practicaldev/image/fetch/s--CAGmUhNa--/c_fill,f_auto,fl_progressive,h_640,q_auto,w_640/https://dev-to-uploads.s3.amazonaws.com/uploads/organization/profile_image/1/0213bbaa-d5a1-4d25-9e7a-10c30b455af0.png',
profileImage90: 'https://res.cloudinary.com/practicaldev/image/fetch/s--mbsgKaXh--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/organization/profile_image/1/0213bbaa-d5a1-4d25-9e7a-10c30b455af0.png'
},
flareTag: {
name: 'watercooler',
bgColorHex: '#D0ECFF',
textColorHex: '#130074'
}
}
...
]
You can narrow down specific articles by providing some options:
getArticles({
perPage: 10,
tagsExclude: ['rust', 'php'],
collectionId: '012345',
page: 1,
tags: ['node', 'css', 'react'],
username: 'Some Name',
state: 'rising',
top: 3
})
You can fetch a specific article with it's ID:
const article = await getArticleById('12345');
Fetching a User
Example Code:
const user = await getUserById('12345');
Example Output
{
typeOf: 'user',
id: 12345,
username: 'ktec',
name: 'globalkeith',
twitterUsername: 'ktec',
githubUsername: 'ktec',
summary: null,
location: null,
websiteUrl: null,
joinedAt: 'Mar 21, 2017',
profileImage: 'https://res.cloudinary.com/practicaldev/image/fetch/s--GqCMW2kU--/c_fill,f_auto,fl_progressive,h_320,q_auto,w_320/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/12345/VTpd7P4l.jpg'
}
(Yes, an actual user with the ID of 12345!)
Creating and Editing Articles
To make any authenticated requests, you must first initialize a DEVClient
with your API key.
import { DEVClient } from 'devdotto';
const key = 'YOUR_API_KEY';
const client = new DEVClient();
await client.authorize(key);
client.createArticle({
title: 'My New Article',
description: 'Making a new article with devdotto!',
bodyMarkdown: '<h1>Hello World!</h1>',
tags: ['node'],
published: false
});
Output
This was a very basic rundown, there are many other functions and endpoints available in the library.
To view the entire list of functions and documentation visit: https://github.com/Elitezen/devdotto
Top comments (1)
Why have you deleted your project on Git, friend?