Use The DEV API With This NodeJS Package

#node #javascript #typescript #npm

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