Refactoring to a Single Page Application

on YouTube ↗43m

" summary

Describes migrating a legacy monolithic web frontend (HTML, CSS, JavaScript served from a single-language stack like Java or Rails) into a Single Page Application. Covers progressive extraction of frontend code and practical techniques for incrementally converting parts of the UI into an SPA, drawing on experience from Workshare.

AI-written summary · about

" chapters (28)

1. 0:00Refactoring intro
2. 1:14MPA versus SPA
3. 3:21Refactoring definition
4. 4:04Business context
5. 7:00First monolith: Circus
6. 9:50SPA evolution plan
7. 10:11Spike: Supernova
8. 11:57First microservice: Bruxelles
9. 13:22Backend transformation
10. 14:04Embracing JavaScript
11. 15:54Results and takeaways
12. 16:15JavaScript build
13. 19:10Frontend dependencies
14. 20:57SPA app structure
15. 22:02App layout
16. 24:30Authentication handling
17. 25:56Strategic iframe use
18. 28:26Legacy app integration
19. 30:10Testing and maintenance
20. 31:56Deployment and coexistence
21. 34:06CSS in hybrid apps
22. 35:08Current state and future
23. 36:15Designer involvement
24. 37:19Performance issues and fixes
25. 37:59Existing small SPAs
26. 38:41Browser support and SEO
27. 40:56Team collaboration
28. 42:22Q&A

" related talks

• 41mMigrating from Monolithic to Future-Proof MFsDavid Serrano · Micro Frontends Conference 2024
• 32mFrom Monolith to Micro FrontendJuan Carlos · Micro Frontends Conference 2024
• 24mA Frameworkless Approach to Building Your Single Page ApplicationAntonio Dell'Ava · CSS Day 2019
• 24mScaling Frontend Development using Micro-frontendsMashhood Rastgar · NG-MY 2019
• 22mBreak Up With Your Frontend MonolithElisabeth Engel · JS Kongress 2017
• 25mMicro Frontend: a microservice architecture from your frontend web appsWilson Mendes · JSConf.Asia 2018
• 23mRefactoring for Progressive Web AppsErica Stanley · #PerfMatters Conference 2019
• 28mMaking Single Page Apps accessibleJess Budd · Laracon AU 2019