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

How to migrate legacy frontend?

Avatar for Igor Halfeld Igor Halfeld
July 29, 2022
Programming
130
1

How to migrate legacy frontend?

Avatar for Igor Halfeld

Igor Halfeld

July 29, 2022

More Decks by Igor Halfeld

See All by Igor Halfeld
Modular monoliths with fastify
Avatar for Igor Halfeld igorhalfeld
0
200
Patterns for perfect components in Vue.js
Avatar for Igor Halfeld igorhalfeld
0
120
Clean Architecture no Front-end (update 2021-05-11)
Avatar for Igor Halfeld igorhalfeld
0
67
Step by step I followed a career in software
Avatar for Igor Halfeld igorhalfeld
0
710
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
400
CSS in JavaScripto, the anti-pattern that is good
Avatar for Igor Halfeld igorhalfeld
1
110
Front-end Clean Architecture
Avatar for Igor Halfeld igorhalfeld
2
300

Other Decks in Programming

See All in Programming
3分でわかるatama plusのQA/about atama plus QA
Avatar for atama plus atamaplus
0
110
Codex CLIのSubagentsによる並列API実装 / Parallel API Implementation with Codex CLI Subagents
Avatar for 冨澤宝斗 takatty
2
850
Geminiをパートナーに神社DXシステムを個人開発した話（いなめぐDX 開発振り返り）
Avatar for T. Fujiba fujiba
0
140
モックわからないマン卒業記 ~振る舞いを起点に見直した、フロントエンドテストにおけるモックの使いどころ~
Avatar for Tasuku Watanabe tasukuwatanabe
3
440
Feature Toggle は捨てやすく使おう
Avatar for gennei gennei
0
430
Xdebug と IDE による デバッグ実行の仕組みを見る / Exploring-How-Debugging-Works-with-Xdebug-and-an-IDE
Avatar for shin1x1 shin1x1
0
340
2026-03-27 #terminalnight 変数展開とコマンド展開でターミナル作業をスマートにする方法
Avatar for SUZUKI Masashi masasuzu
0
300
PHPで TLSのプロトコルを実装してみる
Avatar for higaki higaki_program
0
740
[PHPerKaigi 2026]PHPerKaigi2025の企画CodeGolfが最高すぎて社内で内製して半年運営して得た内製と運営の知見
Avatar for Z.O.E. ikezoemakoto
0
340
AI時代の脳疲弊と向き合う ~言語学としてのPHP~
Avatar for Sakurai sakuraikotone
1
1.8k
iOS機能開発のAI環境と起きた変化
Avatar for Ryu-nakayama ryunakayama
0
160
Running Swift without an OS
Avatar for Kishikawa Katsumi kishikawakatsumi
0
240

Featured

See All Featured
So, you think you're a good person
Avatar for Per Axbom axbom
PRO
2
2k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3.3k
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
Avatar for Helen Beal helenjbeal
1
160
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
Avatar for Akash Hashmi akashhashmi
0
310
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
160
Accessibility Awareness
Avatar for Sarah Abderemane sabderemane
0
94
The B2B funnel & how to create a winning content strategy
Avatar for Katarina Dahlin katarinadahlin
PRO
1
330
Tell your own story through comics
Avatar for letsgokoyo letsgokoyo
1
890
AI Search:
Where Are We & What Can We Do About It?
Avatar for Aleyda Solis aleyda
0
7.3k
Navigating Algorithm Shifts & AI Overviews - #SMXNext
Avatar for Aleyda Solis aleyda
1
1.2k
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
9
800
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k

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