matheusroliv/teste-tgt-digital

Blog Legal - Frontend

Descrição

Sistema de blog feito em ReactJS para o processo seletivo da TGT Digital.

Stack

O sistema possui um mock de dados próprio, não possui API e utiliza NPM como gerenciador de pacotes.

Pré-requisitos para rodar o sistema localmente

Para que o sistema seja rodado na sua máquina você precisa realizar os seguintes passos:

• Clonar o repositório para sua máquina git clone https://github.com/Matheusroliv/Teste-TGT-Digital.git

• Acessar a pasta do projeto cd teste-tgt-digital

• instalar o npm utilizando o comando npm install ou npm i

• Após a instalação, para rodar o projeto utilize o comando npm start

• • Também é possível testar a mesma versão do projeto aqui: https://blog-legal-tgt.surge.sh/

Dentro do código

Todo o projeto esta localizado na pasta src, cada pasta possui seus própios arquivos de rederização como: index.js e style.js

• Arquivo App.js

• • Rederiza todo o aplicativo e possui o mock de dados utilizados no projeto.

• Pasta Components

• • Possui dois componentes utilizados no projeto, são eles: o Header do projeto que é renderizado nas páginas Profile e de Criação de Posts e a Lista de Posts que é renderizada na página Profile.

• Pasta Hooks

• • Possui um Custom Hook de Formulários.

• Pasta Pages

• • Possui todas as páginas do projeto, são elas: Home, Login, NewPost, Profile, Signup

• Pasta Router

• • Possuitodo o sitema de navegação entre páginas do projeto.

• Pasta Services

• • Possui uma função que protege as páginas Profile e NewPost de serem acessadas por usuários não cadastrados.

• Pasta Themes

• • Possui um estilo global para o projeto.

Exemplos de uso:

Cadastro: O cadastro é obrigatório.

Na página de Cadastro é possível criar um novo usuário com, nome, e-mail e senha;
NÃO UTILIZE INFORMAÇÕES VERDADEIRAS. Todas as informações de cadastro são salvas no LocalStorage.

Entrada

Nome:
Exemplo: Matheus

Email: o conteúdo digitado precisa seguir um padrão de email
Exemplo: [email protected]

Senha: o conteúdo digitado pode conter todas as letras e números e deve conter no mínimo 6 digitos
Exemplo: 123456

Confirme sua senha: o conteúdo digitado deve ser exatamente igual a senha digitada no input anterior
Exemplo: 123456

Login: O login é obrigatório para acessar as paginas do seu perfil e criação de posts

Entrada

Email: o conteúdo digitado precisa ser digitado exatamente igual como foi feito no cadastro
Exemplo: [email protected]

Senha: o conteúdo digitado precisa ser digitado exatamente igual como foi feito no cadastro
Exemplo: 123456

Criação de Posts

Entrada

Título:
Exemplo: Dica para desenvolvedores

Conteúdo:
Exemplo: Nunca esqueça do ponto e vírgula.

Tecnologias

• ReactJS
• React Hooks
• Styled Components (CSS)