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
140
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
210
Patterns for perfect components in Vue.js
Avatar for Igor Halfeld igorhalfeld
0
140
Clean Architecture no Front-end (update 2021-05-11)
Avatar for Igor Halfeld igorhalfeld
0
76
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
540
Deninho, the TS children
Avatar for Igor Halfeld igorhalfeld
1
230
Micro Front-ends, what they don't tell you
Avatar for Igor Halfeld igorhalfeld
0
410
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
AIを上手に使っていこうとしたら越境せざるを得なくなった話 〜実践1年で見えた境界を越えなければならない理由と進め方〜 / Crossing borders with AI
Avatar for TomoyaKitaura tomoyakitaura
3
1k
型解析で実現する Go の言語内 DSL / Conference に Go! タイムテーブルの歩き方 for Gophers
Avatar for mazrean mazrean
0
130
PyO3 で既存 Python 評価器を Rust core 化する ー wasm-bindgen でブラウザにも配るための設計
Avatar for 𝕂' kdash
1
390
初心者DevRelとして参加者だった私が、DevRel Talks!#2に登壇するまでにしてきたこと
Avatar for Rai sokohirai
0
330
思考垂れ流し開発　～音声入力 × AIエージェント × 開発ハーネスによる試行錯誤～
Avatar for NPOS npostring
0
810
「つくるAI」だけではバグは見つからない　～テストに必要な「見つけるAI」を分離させる戦略～
Avatar for Masahiko Funaki(舟木 将彦) mfunaki
0
230
Hello, Hiroshima Geospatial Data! — Exploring DoboX with Python
Avatar for ぴっかりん ra0kley
0
170
DroidKaigi 2026 「個人開発という実験場: Android エンジニアが手にする4つの自由」
Avatar for SlashNephy slashnephy
0
220
The Good Stuff, Not the Slop: Engineering High-Quality Android Apps with Modern AI Tooling
Avatar for danybony danybony
1
180
Flow は今どうなっているか
Avatar for mizdra mizdra
PRO
0
920
業務時間外もAIに働いてもらう話
Avatar for taki colorful12
3
10k
From 6 People Classroom Meetup to 100 People Regional Conference / FOSS4G Hiroshima 2026
Avatar for YFurukawa furukawayasuto
0
110

Featured

See All Featured
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
304
22k
How to Align SEO within the Product Triangle To Get 
Buy-In & Support - #RIMC
Avatar for Aleyda Solis aleyda
2
1.8k
How To Speak Unicorn (iThemes Webinar)
Avatar for Michelle Schulp Hunt marktimemedia
1
570
Are puppies a ranking factor?
Avatar for Jono Alderson jonoalderson
2
3.9k
Building Experiences: Design Systems, User Experience, and Full Site Editing
Avatar for Michelle Schulp Hunt marktimemedia
0
600
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.6k
Stewardship and Sustainability of Urban and Community Forests
Avatar for Eric Wiseman pwiseman
0
510
Odyssey Design
Avatar for Ryan Kendrick rkendrick25
PRO
2
800
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
254
22k
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
61
10k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.8k
Ten Tips & Tricks for a 🌱 transition
Avatar for Manu Carrasco Molina stuffmc
0
190

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