Explorando a API do GitHub: Buscando Issues Específicas

A API do GitHub é uma ferramenta poderosa que permite aos desenvolvedores interagir com repositórios, issues, commits, e muito mais. Neste post, vamos explorar como usar a API do GitHub para buscar informações específicas de issues de um repositório.

Introdução à API do GitHub

A API do GitHub oferece um conjunto completo de endpoints RESTful que permitem aos desenvolvedores acessar e manipular dados nos repositórios. Um dos usos mais comuns da API é buscar informações sobre issues, que são usadas para rastrear bugs, tarefas e outras discussões em um repositório.

Buscando Issues Específicas

Para buscar uma issue específica em um repositório, usamos o endpoint /repos/:owner/:repo/issues/:issue_number. Aqui está um exemplo de como fazer isso usando axios no React.

Configurando o Axios

Primeiro, configure o axios para apontar para a base URL da API do GitHub.

import axios from 'axios';

const api = axios.create({
  baseURL: 'https://api.github.com',
});

Fazendo a Requisição

Em seguida, crie uma função para buscar uma issue específica com base no ID passado como parâmetro.

import React, { useEffect, useState } from 'react';
import { useLocation } from 'react-router-dom';

const IssueDetails = () => {
  const [issue, setIssue] = useState(null);
  const [error, setError] = useState(null);

  const location = useLocation();
  const queryParams = new URLSearchParams(location.search);
  const id = queryParams.get("id");

  useEffect(() => {
    async function fetchIssue(id) {
      try {
        const response = await api.get(`/repos/jadersonfarias/github-blog/issues/${id}`);
        setIssue(response.data);
      } catch (error) {
        setError("Error fetching issue details");
      }
    }

    if (id) {
      fetchIssue(id);
    }
  }, [id]);

  if (error) {
    return <div>{error}</div>;
  }

  if (!issue) {
    return <div>Loading...</div>;
  }

  return (
    <div>
      <h1>{issue.title}</h1>
      <p>{issue.body}</p>
      <p>Created at: {new Date(issue.created_at).toLocaleDateString()}</p>
      <p>Comments: {issue.comments}</p>
      <a href={issue.html_url}>View on GitHub</a>
    </div>
  );
};

export default IssueDetails;

jadersonfarias / Github-blog