- Personal project that was developed for competitive scene of Counter Strike: Global Offensive
- Perform CRUD (Create, Read, Update, Delete) operations to a Player, Team or Trophy
- In Player's page, you can search for specific player's nickname or name
- In Team's page, you can search for specific team's name
- In Trophies's page, you can search for specific trophy's name or a specific year
- Each entity's form has their own validation fields
📌 More Details
✔️ Using TypeScript reduces a lot errors in time execution and gives me a better type checking
✔️ All state management, for general logic (Players, Teams and Trophies), was made using Redux Toolkit
✔️ Using Material UI with his pre-built components improving hugely my time development
✔️ All routes was created using react-router-dom version 6
✔️ I used axios to communicate front-end and back-end, creating a file that abstract these communication and using it when it's needed
✔️ Used One-To-One, One-To-Many and Many-To-Many relationships using Entity Framework Core 6 and AutoMapper to avoid unnecesssary manual mappings
✔️ All the logic was built using the Repository Pattern
✔️ These project was design using the SOLID principles
🖥️ Front-end | ⚙️ Back-end |
---|---|
React TypeScript Redux (redux toolkit) Material UI react-router-dom (v6) react-hook-form react-toastify axios concurrently |
.NET Core 6 AutoMapper Swagger MongoDB Clean Architecture |
- This project was made for educational purposes
- All the info was extracted from HLTV.org and Liquipedia.net
- Projeto pessoal que foi desenvolvido para o cenário competitivo de Counter-Strike: Global Offensive
- Performar operações CRUD (Create, Read, Update, Delete) a um Jogador, Time e Troféu
- Na página de Jogador, você pode procurar por um jogador específico pelo apelido ou nome
- Na página de Time, você pode procurar por nome de um time específico
- Na página de Troféu, você pode procurar pelo nome de um troféu específico ou um ano específico
- Cada formulário das entidades possui sua própria validação de seus campos
📌 Mais Detalhes
✔️ Utilizar TypeScript reduziu e muito, os erros em tempo de execução e entregou uma melhor tipagem
✔️ Todo o gerenciamento de estado, para a lógica mais geral (Jogadores, Times e Troféus), foi feito utilizando Redux Toolkit
✔️ Utilizar Material UI com seu componentes pré-definidos aumentou imensamente meu tempo de desenvolvimento
✔️ Todas as rotas foram criados utilizando react-router-dom versão 6
✔️ Eu utilizei axios para fazer a comunicação do front-end com o back-end, criando um arquivo que abstrai toda essa comunicação e utilizando-o onde fosse necessário
✔️ Eu utilizei os relacionamentos Um-Para-Um, Um-Para-Muitos e Muitos-Para-Muitos usando Entity Framework Core 6 e Automapper para evitar mapeamentos manuais
✔️ Toda a lógica foi construída usando o Padrão Repositório
✔️ Esse projeto foi desenhando usando os princípios SOLID
🖥️ Front-end | ⚙️ Back-end |
---|---|
React TypeScript Redux (redux toolkit) Material UI react-router-dom (v6) react-hook-form react-toastify axios concurrently |
.NET Core 6 AutoMapper Swagger MongoDB Clean Architecture |
- Esse projeto foi feito com propositos educacionais
- Todas as informações foram extraídas dos websites HLTV.org e Liquipedia.net