Clean Architecture no Front-end (update 2021-05-11)

Transcript

1. Clean Architecture no Front-end De webmaster para arquiteto de software 💁
2. Por que você veio assistir essa palestra? eu tenho 3 palpites…
3. Porque você viu um outro dev falando sobre 👻
4. Porque você gosta de aprender e acha que deve saber esse assunto 🥸
5. Porque você tá se sentindo engessado pra escrever testes e para fazer implementações 🤣
6. …se você não esta aqui por esse último ponto, reveja essa palestra 2~4 meses depois! 🦄
7. Clean Architecture é pensando pro backend
8. Angular.js 1 MVC
9. Redux Event Sourcing & CQRS
10. Mas dá pra aplicar no front-end? 🤔
11. Clean Architecture, Hexagonal Architecture, Onion Architecture, Ports and Adapters…
12. Alta coesão Baixo acoplamento Como alcançar isso? 😱
13. Complexidade instrumental vs Complexidade inerente
15. Principais problemas de lidar com front-end hoje em dia? Javascript fatigue 💩
16. Libs com “conceitos inovadores"
20. A tech parece chata porquê você provavelmente conhece bastante dela
22. Resumo, foca no problema!
23. Data fetching & Painting layer Local & Global state fl ow
24. Data fetching Nome bonito pra fazer uns request
25. Painting/Render layer Nome bonito pra onde tá os HTML
26. Local state fl ow Nome bonito pros objeto do componente
27. Global state fl ow Nome bonito pros Redux/Vuex/NGRX
28. Sabendo as dores vamos traçar um ponto em comum
30. Como usar sem virar o novo MVC no Front-end?
31. Focar no principal! e põe na cabeça duas pequenas coisas…
32. Simplicidade & Separação
33. Separation of concerns Inversion of control Dependency Injection Entity
34. Separar data fetching de painting layer Separar responsabilidade em funções Separar separar lógica do componente (e-commerce) * Hooks é uma forma de separar
35. map/ fi lter/reduce.. Cria o fl uxo e o "usuário" implementa a estratégia
41. Parabéns, você sabe clean arch!
42. igorhalfeld.com - @igorhalfeld