/omni-stack-11

Projeto Be The Hero, elaborado durante a semana 11 da OmniStack da Rocketseat.

Primary LanguageJavaScriptMIT LicenseMIT

Projeto Be The Hero

Projeto fullstack elaborado durante a semana OmniStack 11 da Rocketseat

Os arquivos estão todos estruturados por pastas conforme as aulas, e os códigos comentados

Front-End:

O front-end do projeto foi criado com React, segue algumas anotações que eu fiz durante as aulas

  1. JSX: o React utiliza o formato jsx que é um arquivo html dentro de um javascript;
  2. Componentes: Componentes são funções que retornam um HTML;
  3. SPA: O React utiliza o conceito SPA (Single Page Application) que para isto, utiliza lives reload para não ter que carregar a página inteira e fazer a atualização de modo automático;
  4. Props: As props(properties) são parâmetros de uma functionque recebem conteúdos externos das propriedades dos elementos;
  5. Estado: React utiliza o conceido de estado que é uma informação a ser mantida (armazenada) pelo componente;
  6. Imutabilidade: O react é imutável, quando o estado é alterado (sobrepondo o valor do mesmo), o componente é remontado para ser renderizado novamente;
  7. useState: O useStateretorna um array, onde o primeiro parâmetro é um valor e o segundo é uma function [valor, () => {...}];
  8. e.preventDefault() é utilizado para impedir o comportamento padrão de atualizar toda a página num formulário;
  9. useHistory() é importado do react-router-dom para direcionar o usuário através das rotas quando não se é possível utilizar links;
  10. useEffetct é utilizado para disparar uma function num determinado momento toda vez que for alterado o valor do array de dependências ex.: useEffect(() => {...}, [...]);

Back-end:

O back-end do projeto foi criado com node.js uma plataforma criada com o google v8 engine para desenvolvimento server-side com javascript, os frameworks utilizados foram express para utilização de rotas e middlewares, knex para conexão e integração com banco de dados e sqlite3 como banco de dados e corscomo módulo de segurança para definir quem pode acessar a API

Segue minhas anotações

  1. MÉTODOS HTTP
    1. GET: Buscar uma informação no back-end
    2. POST: Criar uma informação no back-end
    3. PUT: Alterar uma informação no back-end
    4. DELETE: Deletar uma informação no back-end
  2. Tipos de parâmetros
    1. query params: parâmetros nomeados enviados na rota após '?' servem para filtros e paginação
    2. route params: parâmetros para identificar recursos na rota após ':'
    3. request body: corpo da requisição, utilizado para criar e alterar recursos