Sobre • Funcionalidades • Layout • Como executar • Tecnologias • Como contribuir • Licença

💻 Sobre o projeto

O Github Blog é um blog que utiliza como base de dados o próprio repositório do Github, sendo as Issues do repositório apresentadas como posts do blog.

Esto projeto foi desenvolvido como desafio do módulo de comunicação com API, da trilha React, do Bootcamp Ignite oferecido pela Rocketseat.

🧰 Funcionalidades

• Exibir uma lista de posts extraidos das issues do repositório, mostrando apenas o título e um o texto parcial;
• Exibir dados do dono do repositório;
• Deve conter uma página para exibir todo o conteúdo do post;
• Deve ser possível realizar uma busca nos posts através de um argumento.

🎨 Layout

O layout da aplicação está disponível no figma:

🚀 Como executar o projeto

Pré-requisitos

Para executar o projeto, você vai precisar ter instalado em sua máquina as seguintes ferramentas: Git, Node.js. Além disto é bom ter um editor para trabalhar com o código como VSCode.

Clonando o repositório

# Clone o repositório
$ git clone [email protected]:eduhaag/github-blog.git

# Acesse a página do projeto
$ cd github-blog

# Instale as dependências
$ npm install
# No arquivo src/context/PostsContext.tsx você deve substituir o 'eduhaag/github-blog' na linha 34, pelo nome no usuário e repositório do Github que será utilizado como base de dados da aplicação. 

# Rode o projeto
$ npm run dev

# O servidor front-end será inicializado e será exibido no terminal a porta para acesso.

🛠️ Tecnologias

• React;
• Typescript;
• Vite - Para agilizar o processo de criação e configuração do projeto;
• Axios - Realiza a comunicação com o backend por meio de requisições HTTP;
• react-router-dom - Conduz o roteamento das páginas dentro da SPA;
• Stylef Components - Possibilita escrever códigos CSS dentro do JavaScript;
• Date-fns - Manipulação de datas;
• Fortawesome - Biblioteca de icones;
• parse-numeric-range - Manipulador de numeros;
• react-hook-form - Criação e validação de formulários;
• react-markdown - Manipulação de texto em markdown;
• react-sintax-highlighter - Biblioteca para formação de código dentro do markdown;
• Zod - Biblioteca para válidação de esquemas de dados.

Veja o arquivo package.json

Utilitários

• Protótipo: Figma;
• Editor: Visual Studio Code;
• Fontes: Nunito.

💪 Como contribuir para o projeto

1. Faça um fork do projeto.
2. Crie uma nova branch com as suas alterações: git checkout -b my-feature
3. Salve as alterações e crie uma mensagem de commit contando o que você fez: git commit -m "feature: My new feature"
4. Envie as suas alterações: git push origin my-feature

📝 Licença

Este projeto está sobe a licença MIT.