/clean-react

Sistema em ReactJs usando Hooks, Typescript, TDD, Clean Architecture, Design Patterns e SOLID principles

Primary LanguageTypeScriptGNU General Public License v3.0GPL-3.0

Build Status Coverage Status Known Vulnerabilities js-standard-style GPLv3 License Open Source

4Dev React - Enquetes para Programadores

alt text

Link para o curso completo

Essa sistema faz parte do treinamento do professor Rodrigo Manguinho (Mango) na Udemy.

O objetivo do treinamento é mostrar como criar um sistema em ReactJs utilizando os novos Hooks, Recoil, com uma arquitetura bem definida e desacoplada, utilizando TDD (programação orientada a testes) como metodologia de trabalho, Clean Architecture para fazer a distribuição de responsabilidades em camadas, sempre seguindo os princípios do SOLID, DRY, YAGNI, KISS e aplicando Design Patterns para resolver alguns problemas comuns.

Link para a documentação da API

Princípios

  • Single Responsibility Principle (SRP)
  • Open Closed Principle (OCP)
  • Liskov Substitution Principle (LSP)
  • Interface Segregation Principle (ISP)
  • Dependency Inversion Principle (DIP)
  • Separation of Concerns (SOC)
  • Don't Repeat Yourself (DRY)
  • You Aren't Gonna Need It (YAGNI)
  • Keep It Simple, Silly (KISS)
  • Composition Over Inheritance
  • Small Commits

Design Patterns

  • Factory
  • Adapter
  • Composite
  • Decorator
  • Dependency Injection
  • Composition Root
  • Builder
  • Proxy

Metodologias e Designs

  • TDD
  • Clean Architecture
  • DDD
  • Reactive Programming
  • Responsive Layout
  • Conventional Commits
  • GitFlow
  • Modular Design
  • Dependency Diagrams
  • Use Cases
  • Continuous Integration
  • Continuous Delivery
  • Continuous Deployment

Bibliotecas e Ferramentas

  • Typescript
  • React
  • Recoil
  • React Testing Library
  • React Router DOM
  • Cypress
  • Jest
  • Axios
  • Git
  • Webpack
  • SASS + Animations
  • NPM
  • Travis CI
  • Faker
  • Coveralls
  • Husky
  • Lint Staged
  • Eslint
  • Standard Javascript Style
  • React Flip Move

Features do React

  • Functional Components
  • UseState
  • UseContext
  • UseEffect
  • UseHistory
  • UseRef
  • UseParams
  • Custom Hooks
  • UseRecoilState
  • UseResetRecoilState
  • UseRecoilValue
  • UseRecoilSetState
  • Atom
  • Router
  • Memo

Features do Git

  • Alias
  • Log Personalizado
  • Branch
  • Reset
  • Amend
  • Tag
  • Tag Anotada
  • Stash
  • Rebase
  • Merge
  • Add
  • Commit
  • Push
  • Pull
  • Shortlog
  • Status

Features do Typescript

  • POO Avançado
  • Interface
  • Type Alias
  • Namespace
  • Module
  • Utility Types
  • Modularização de Paths
  • Build
  • Deploy
  • Generics

Features de Testes

  • Testes Unitários
  • Testes de Integração
  • Testes e2e
  • Cobertura de Testes
  • Test Doubles
  • Mocks
  • Stubs
  • Spies
  • Fakes
  • Dummies