Upgrade to Pro — share decks privately, control downloads, hide ads and more …

How to migrate legacy frontend?

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Igor Halfeld Igor Halfeld
July 29, 2022
Programming
1
130

How to migrate legacy frontend?

Avatar for Igor Halfeld

Igor Halfeld

July 29, 2022
Tweet

More Decks by Igor Halfeld

See All by Igor Halfeld
Modular monoliths with fastify
Avatar for Igor Halfeld igorhalfeld
0
190
Patterns for perfect components in Vue.js
Avatar for Igor Halfeld igorhalfeld
0
110
Clean Architecture no Front-end (update 2021-05-11)
Avatar for Igor Halfeld igorhalfeld
0
60
Step by step I followed a career in software
Avatar for Igor Halfeld igorhalfeld
0
700
Using AI to create memes
Avatar for Igor Halfeld igorhalfeld
0
530
Deninho, the TS children
Avatar for Igor Halfeld igorhalfeld
1
220
Micro Front-ends, what they don't tell you
Avatar for Igor Halfeld igorhalfeld
0
390
CSS in JavaScripto, the anti-pattern that is good
Avatar for Igor Halfeld igorhalfeld
1
100
Front-end Clean Architecture
Avatar for Igor Halfeld igorhalfeld
2
290

Other Decks in Programming

See All in Programming
360° Signals in Angular: Signal Forms with SignalStore & Resources @ngLondon 01/2026
Avatar for Manfred Steyer manfredsteyer
PRO
0
130
CSC307 Lecture 04
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
660
IFSによる形状設計／デモシーンの魅力 @ 慶應大学SFC
Avatar for がむ gam0022
1
310
AIによる高速開発をどう制御するか？ ガードレール設置で開発速度と品質を両立させたチームの事例
Avatar for tonkotsuboy_com tonkotsuboy_com
7
2.4k
CSC307 Lecture 05
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
500
QAフローを最適化し、品質水準を満たしながらリリースまでの期間を最短化する #RSGT2026
Avatar for shibayu36 shibayu36
2
4.4k
AWS re:Invent 2025参加 直前 Seattle-Tacoma Airport(SEA)におけるハードウェア紛失インシデントLT
Avatar for tetutetu214 tetutetu214
2
120
そのAIレビュー、レビューしてますか？ / Are you reviewing those AI reviews?
Avatar for r-kagaya rkaga
6
4.6k
CSC307 Lecture 09
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
1
840
余白を設計しフロントエンド開発を 加速させる
Avatar for karacoro / からころ tsukuha
7
2.1k
プロダクトオーナーから見たSOC2 _SOC2ゆるミートアップ#2
Avatar for Kenta Suzuki kekekenta
0
220
AI時代の認知負荷との向き合い方
Avatar for OptFit Corp. optfit
0
160

Featured

See All Featured
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
Avatar for Sara Fernández Carmona sarafernandez
0
120
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
302
51k
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
97
6.5k
Crafting Experiences
Avatar for Bethany Jepchumba bethany
1
49
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9.1k
30 Presentation Tips
Avatar for Ian Lurie portentint
PRO
1
220
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
2.9k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.6k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
54
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
74
11k
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
359
30k

Transcript

  1. Como migrar front-end legado? 💩

  2. Igor Halfeld Software Engineer igorhalfeld.com - @igorhalfeld

  3. treinamento.vuejsbrasil.org

  4. 70% negócio & 30% tech

  5. Tudo é sobre produto!

  6. A grande ilusão…

  7. Tipos de projeto legado 😌

  8. React com Hooks e Prop Types

  9. Vue 1 com Sass

  10. React com Class Component e Prop Types

  11. Angular 1 e sass

  12. jQuery com bootstrap

  13. Em resumo, todos já caíram ou vão eventualmente caindo em

    um projeto com código legado

  14. Complexidade instrumental vs Complexidade inerente

  15. None

  16. Escrever código é uma forma de otimizar processos

  17. Código legado só é ruim se você tem que mexer

    nele 👀

  18. Débito técnico é ruim?

  19. Vamos simular um usecase

  20. None

  21. - Login - Header - Menu - Conteúdo

  22. Como? 😏

  23. None

  24. - Login - Header - Menu - Conteúdo

  25. Nginx 😍

  26. Testes E2E (cypress) do que for ser refatorado

  27. Nginx App 1 Front 2

  28. None
  29. None
  30. None
  31. None

  32. *Foco no problema. *Estratégico sempre antes do operacional. *Tecnologia nova

    é legal, mas o básico muitas das vezes já funciona (boringtechnology.club).

  33. igorhalfeld.com - @igorhalfeld