Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
December 26, 2022 05:07 pm GMT

How to test DEV API ?

Introduction

DEV (dev.to) are a public API where you can get posts and profiles from Forem API.

API | Forem Docs

Were currently making rapid changes to the product so our docs may be out of date. If you need help, please email [email protected].

favicon developers.forem.com

Let's go !

For testing this API, you can take any HTTP Client. I will take Hoppscotch available wherever you want!.

  1. First time, go to create your API key here (on DEV Community API Keys section).

  2. To get your articles, GET https://dev.to/api/articles/me and adding to the header api-key :

GET /api/articles/me HTTP/1.1Api-Key: YOUR_AWESOME_KEYHost: dev.to

You get information of your articles, but for this example I only show the latest :

[  {    "type_of": "article",    "id": 1281931,    "title": "When can you declare yourself a Full-stack Dev?",    "description": "Hello   I was wondering if I should consider myself as a front-end or full-stack developer. Or at...",    "published": true,    "published_at": "2022-12-02T17:05:00.000Z",    "slug": "when-can-you-declare-yourself-a-full-stack-dev-31j1",    "path": "/thomasbnt/when-can-you-declare-yourself-a-full-stack-dev-31j1",    "url": "https://dev.to/thomasbnt/when-can-you-declare-yourself-a-full-stack-dev-31j1",    "comments_count": 29,    "public_reactions_count": 34,    "page_views_count": ----,    "published_timestamp": "2022-12-02T17:05:00Z",    "body_markdown": "Hello 

I was wondering if I should consider myself as a front-end or full-stack developer. Or at least how to present myself to companies.

And then, I asked myself... **at what moment can you consider yourself a full-stack developer?** What are the basics to know to become one?


> For example,
> I suppose that to be a self-proclaimed full-stack developer in JavaScript, you have to know at least one front-end framework (like [`Vue`](https://vuejs.org), [`React`](https://reactjs.org/), [`Angular`](https://angular.io/), [`Svelte`](https://svelte.dev/), [`Astro`](https://astro.build/) etc...), know the basics of the backend and its specificities, especially [`Node.js`](https://nodejs.dev) and all its aspects, know one or more frameworks (I think of [`Express.js`](https://expressjs.com/) or [`Fastify`](https://www.fastify.io/)), know how to create an API and databases, and know the principle of MVC in order to set up a good architecture.
>
> _If there is something missing, don't hesitate to tell me_.", "positive_reactions_count": 34, "cover_image": "https://res.cloudinary.com/practicaldev/image/fetch/s--CzOg3CT7--/c_imagga_scale,f_auto,fl_progressive,h_420,q_auto,w_1000/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/15u06okn5tcdc0i92xhm.png", "tag_list": [ "discuss" ], "canonical_url": "https://dev.to/thomasbnt/when-can-you-declare-yourself-a-full-stack-dev-31j1", "reading_time_minutes": 1, "user": { "name": "Thomas Bnt", "username": "thomasbnt", "twitter_username": "Thomasbnt_", "github_username": "thomasbnt", "user_id": 18254, "website_url": "https://thomasbnt.dev", "profile_image": "https://res.cloudinary.com/practicaldev/image/fetch/s--zpCwDOpw--/c_fill,f_auto,fl_progressive,h_640,q_auto,w_640/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/18254/c3e35d32-bfe2-48ed-93b7-f2caf9c60gd7.png", "profile_image_90": "https://res.cloudinary.com/practicaldev/image/fetch/s--Iv24f4-g--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/18254/c3e35d32-bfe2-48ed-93b7-f2caf9c60gd7.pngg" }, "flare_tag": { "name": "discuss", "bg_color_hex": "#1ad643", "text_color_hex": "#FFFFFF" } },]

In image, here is the request!

How to make a GET call from Hoppscoth

With this app, we are cool others features like GraphQL and WebSocket. You can export your request to CURL or others languages, very clean !

Coding time!

With this data, we can create a multitude of cool websites.
In my case, I'm creating a simple page to see my posts and my profile (profile picture, description, joined timestamp, total of posts).

I created the project with Vue.js and the DEV/Forem API. You can see the final code and the preview of the website.

Preview of the project called devto profile made with Vue and the DEV API

I show you how I GET my information from a Vue component. It's like doing it with an HTTP client, except that it's JavaScript.

const USERNAME_DEVTO = "thomasbnt";export default {  data() {    return {      posts: {        data: [],      },      userLink: `https://dev.to/${USERNAME_DEVTO}`,    };  },  mounted() {    fetch(      `https://dev.to/api/articles?username=${USERNAME_DEVTO}&per_page=200`    )      .then((res) => res.json())      .then((data) => {        this.posts = data;      })      .catch((error) => console.log(error));  },}

Very easy, love to work any API
You can check the full component here.

Don't hesitate to contribute, and you can also test different APIs.

Check my Twitter account. You can see many projects and updates. You can also support me on Buy Me a Coffee, Stripe or GitHub Sponsors. Thanks for read my post !

Original Link: https://dev.to/thomasbnt/how-to-test-dev-api--p13

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To