Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/augustodevjs/store
Store using .NET and React
https://github.com/augustodevjs/store
backend csharp fluentvalidation frontend reactjs webapi xunit
Last synced: 13 days ago
JSON representation
Store using .NET and React
- Host: GitHub
- URL: https://github.com/augustodevjs/store
- Owner: augustodevjs
- Created: 2023-10-03T19:44:27.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-07-27T19:59:11.000Z (6 months ago)
- Last Synced: 2024-11-08T23:53:02.993Z (2 months ago)
- Topics: backend, csharp, fluentvalidation, frontend, reactjs, webapi, xunit
- Language: C#
- Homepage:
- Size: 9.11 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## 🖼️ Front-End
A organização de pastas do projeto no Front-End é feita dividindo as responsabilidades em módulos para organizar o projeto como um todo e facilitar o desenvolvimento. Os modulos são:
- **components**: Módulo que comporta todos os componentes feitos no projeto;
- **core**: Módulo que possui arquivos e utilitarios essenciais para o funcionamento da aplicação;
- **domain-types**: Módulo referente a todos os tipos criados com o auxilio do Typescript;
- **services**: Módulo que comporta todos os services que fazem comunicação com o Back-End;
- **styles**: Módulo que comporta estilizações globais;
- **pages**: Módulo que comporta todos os componentes referentes às páginas, seus modais, hooks, serviços que se comunicam e etc.
## 💡 Rodando o Front-End
### Pre-requisitos
Antes de tudo é necessário instalar:
- Node.js
- Instalando o TypeScript
```sh
npm install -g typescript.
```
- Instalando o yarn
```sh
npm install --global yarn
```
- Verificando se o yarn está instalado
```sh
yarn --version
```
- Clonando o respositório
```sh
git clone https://github.com/augustodevjs/teste-tecnico-fullstack
```
- Entre no diretório do front
```sh
cd ./frontend
```
- Variável de Ambiente
```sh
crie um arquivo chamado .env e copie a url da api para esse arquivo de acordo com .env.example
```
- Installando as dependencias do projeto com yarn
```sh
yarn
```
- Rodando o projeto no modo de desenvolvimento
```sh
yarn run dev
```
## :desktop_computer: Principais tecnologias utilizadas no Front-End
- TypeScript
- JavaScript
- React
- HTML
- CSS
- Styled Components
- React Modal
- React Hook Form
- Sweet Alert
## ⌨️ Back-End
Foi utilizado o framework .NET 7 e Entity Framework com a arquitetura divida em módulos e a conexão com o banco de dados postgresql, mas com a organização de pasta
seguindo a modelagem de DDD (Domain Driven Desing) para facilitar a implementação de regras de negócios e outros processos complexos.
Dito isso, o projeto foi estruturado em 5 "camadas" que são:
- **API**: Comporta configurações da aplicação e controllers;
- **application**: Cuida da comunicação com o Domain, comportando: classes de serviços, interfaces, DTOs, etc;
- **infra**: Comporta o suporte geral às demais implementações como repositories, mappers, contextos, etc;
- **domain**: Comporta todas as entidades, interfaces e classes de serviços;
- **tests**: Comporta todos os testes das services.
## 💡 Rodando o Back-End
### Pre-requisitos
- NET SDK
- Postgresql
- DBeaver
- Entre no diretório do back
```sh
cd ./backend/src/Store.API
```
- Rode a API
```sh
dotnet run
```
- Para vê os testes unitários do backend entre no diretório
```sh
cd ./backend/tests/Store.Application.Tests
```
- Rode os Testes
```sh
dotnet test
```
## :desktop_computer: Principais tecnologias utilizadas no Back-End
- C#
- .NET 7
- Entity Framework
- AutoMapper
- Postgresql
- DBeaver
- FluentValidation