Gkanawati / react-materialui-typescript

Projeto pessoal construído com fins de estudo em Typescript e Material UI 5. Esse site envolve um CRUD utilizando typescript.

Home Page:https://gkanawati.github.io/react-materialui-typescript/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

🔗📺 Sistema de Cadastro de Usuário e Cidades

🚀 Sobre o projeto

Este é um projeto pessoal construído com fins de estudo em Typescript e Material UI 5.

Esse site envolve o cadastro de pessoas e de cidades em um banco de dados, e também relaciona as pessoas à sua respectiva cidade.

Nesse projeto foram utilizadas diversas bibliotecas consolidadas com o seu uso no mercado de trabalho, como por exemplo: Material UI 5, para estilização e criação de componentes seguindo o design system da Google, React Router Dom 6 para a criação das rotas e navegação da plataforma e o Unform para a construção de formulários performáticos. 📚

Todo o site está responsivo e adaptativo nos diversos tamanhos de tela. Também foi adicionado ao projeto a opção de alteração entre os temas claro e escuro da aplicação, utilizando o Material UI. 📱

A plataforma foi construída utilizando React para a construção do frontend e json-server para a construção das APIs consumidas pela plataforma. Os dados persistidos pelo site são variáveis e recebem todas as informações via localhost da maquina do usuário.

Ao entrar no site temos a tela de login da plataforma, que assim que o usuário é inscrito com autenticado com sucesso, é direcionado para dentro da plataforma! O projeto ainda contém melhorias para serem implementadas, como um servidor backend dedicado para a criação das APIs e a implementação da autenticação real de usuário.

🔗 Link do projeto:

https://gkanawati.github.io/react-materialui-typescript/

💡 Tecnologias usadas:

  • React
  • Typescript
  • Material UI 5
  • Json-server

⚙️ Como rodar o Projeto:

-Para rodar o servidor:

yarn mock

-Para instalar todas as bibliotecas usadas no projeto rode o comando:

npm install --only=prod --only=dev

-Para rodar o app:

yarn start ou acessar o link do navegador.

-Atenção! Para rodar o projeto mesmo no navegador é necessário rodar o json-server com o primeiro comando (yarn mock)

💻 Telas

PrintMaterialUI

PrintMaterialUI1

PrintMaterialUI1

PrintMaterialUI2

About

Projeto pessoal construído com fins de estudo em Typescript e Material UI 5. Esse site envolve um CRUD utilizando typescript.

https://gkanawati.github.io/react-materialui-typescript/


Languages

Language:TypeScript 89.5%Language:HTML 10.5%