eduardongomes/github_blog

Github_Blog

Deploy Project

• GitHub Blog

Project description

This project was developed for Rockeseat's Ignite course

🛠 Tecnologias

The following tools were used in building the project

• React
• TypeScript
• GitHubAPI

Author

• Eduardo Nascimento Gomes

Contact

• LinkedIn
• [email protected]

github_blog's Issues

Context API

• Context é utilizado para substituir props drilling
• Utiliza a funcao createContext do react
• dentro do createContext normalmente é utilizado object
• O nome da variavel que ira armazer o context, devera ser relacionado ao dado que irá conter
• Para utilizar o context criado é necessario o useContext
• O context precisa de um provider passando um valeu <context.provider value={{value}}></context.provider>

Centralizar elementos com position absoluto/fixed

position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);

Configurar eslint Rocketseat

• instalar extensão do eslint no vscode

• Instalar Eslint como dev dependence

npm i eslint -D

• Instalar configuracão da Rocket

Instalar configuracão da Rocket

• criar o arquivo do eslint na raiz do projeto
• .eslintrc.json

{
 "extends":"@rocketseat/eslint-config/react"
}

• comando para resolver problemas relacionados a lint

 npx eslint src --ext .ts, .tsx --fix

Modal Acessível

Primitives - Radix UI(https://www.radix-ui.com/)

• Lib radix UI é uma biblioteca que ajuda na criação de componentes primitivos do HTML já com acessibilidade
• Radix Dialog é utilizado para criação de modals
• Para estilizar elementos radix, é necessário utiliza-los juntos com styled-components

Json Server

https://github.com/typicode/json-server

• API que simula um servidor back-end

React-Hook-From

React-Hook-Form

• Para utiliza-lo em funcoes nativas do html(input) basta usar o register
• Para usar em components não nativos, precisa utilizar o control