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
130
Clean Architecture no Front-end (update 2021-05-11)
Avatar for Igor Halfeld igorhalfeld
0
74
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
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
Hatena Engineer Seminar #37「言語モデルの活用に関する研究」
Avatar for SlashNephy slashnephy
0
460
Honoでのサプライチェーン侵害対策 〜 3つのライブラリに学ぶ
Avatar for Yusuke Wada yusukebe
7
1.7k
「AIで開発し、AIを届ける」をEvalでつなぐ 〜AIネイティブに始めるプロダクト開発の実践〜 / Connecting "Develop with AI, deliver AI" with Eval
Avatar for r-kagaya rkaga
4
5.6k
ローカルLLMでどこまでコードが書けるか -縮小版 /　How much code can be written on a local LLM Shortened
Avatar for Naoki Kishida kishida
2
170
Performance Engineering for Everyone
Avatar for Elena Tanasoiu elenatanasoiu
0
250
TSKaigi Night Talks 2026_TypeScriptでサプライチェーンの整合性を型に閉じ込める
Avatar for ギークプラス ソフトウェア事業部 geekplus_tech
0
430
act1-costs.pdf
Avatar for Sumedh Bala sumedhbala
0
160
エンジニアにデザインハーネスを 〜デザインプロセスを規定するためのハーネス〜 / Design harness from an engineer's perspective
Avatar for r-kagaya rkaga
2
600
Vite+ Unified Toolchain for the Web
Avatar for Naoki Haba naokihaba
0
410
ECSアプリログをFireLensでコスト削減しようとしたけど諦めた話 in Fargate×Node.js
Avatar for アキキー | Akihisa Ikeda akihisaikeda
2
4.2k
作って学ぶ、 JSX (TSX) ランタイムの基本
Avatar for syumai syumai
7
1.7k
Spec Driven Development | AI Summit Lisbon
Avatar for Daniel Sogl danielsogl
PRO
0
230

Featured

See All Featured
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
360
30k
Chasing Engaging Ingredients in Design
Avatar for Sebastian Deterding codingconduct
0
230
Lessons Learnt from Crawling 1000+ Websites
Avatar for Charles Meaden charlesmeaden
PRO
1
1.3k
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
Avatar for Aleyda Solis aleyda
1
1.3k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
Avatar for David Carrasco davidcarrasco
3
180
A Guide to Academic Writing Using Generative AI - A Workshop
Avatar for Kenji Saito ks91
PRO
1
340
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.5k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
6
1.2k
From Legacy to Launchpad: Building Startup-Ready Communities
Avatar for Dug Song dugsong
0
240
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9.4k
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
Avatar for Yuki Nakata chikuwait chikuwait
0
630
The SEO Collaboration Effect
Avatar for Kristina Bergwall kristinabergwall1
1
500

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