The JavaScript Migration Trend pt.2
June 26, 2023 — Zinderlabs
In the previous part of this series, we discussed the growing trend of JavaScript projects needing significant upgrades and changes. We continue the story by sharing our findings and approaches to upgrading JavaScript projects.
1. Introduce Typescript
We strongly advocate for TypeScript and will always push projects toward introducing TypeScript. Developers new to TypeScript may experience an additional debugging time when working with type errors. However, TypeScript has only benefits over time and increases developer speed and experience.
Our key takeaway: Focus on developer experience in this process. TypeScript should increase your productivity and shouldn’t be an obstacle. Take the necessary time to dial in the required configuration. Take a pragmatic approach, and don’t be too rigid initially.
2. Introduce monorepo
We introduced monorepos in multiple projects, which improves maintainability and developer experience. Bigger projects with multiple apps scattered around different repositories are challenging to manage and keep track of. Moving to a monorepo, we can consolidate our codebase into a single repository and use the necessary tooling to keep everything organized and streamlined.
We migrated a 6-year-old project from Lerna to Nx, which allowed us to consolidate our packages into Nx apps and libs. While the process was not without its challenges, such as getting our SASS styles to work again, we could use Codemod to fix all the import paths, which was more efficient than manual fixes. While writing the codemod took some time, it was more fun and challenging than fixing every path manually!
3. Gradual migrations
While a full-scale rewrite might be ideal for some projects, it’s not always feasible or practical. Sometimes, you need to take a more gradual approach to upgrading your app.
There are two ways to approach the upgrade process. Firstly, you can take a bottom-up approach by integrating, e.g., React components into an existing AngularJS application alongside AngularJS routing. Alternatively, you can begin by creating a wrapper and router using the new technology and incorporate the older pages into the updated framework.
Following this approach, you can gradually upgrade your app while minimizing user disruption.
Conclusion
Whether you need to improve performance, increase security, or comply with new regulations, migrating your app to a modern JavaScript framework can provide numerous benefits.
If you’re considering upgrading your app and need assistance, don’t hesitate to contact us. We’d be happy to discuss your project and provide a customized solution that meets your specific needs. Let’s work together to take your app to the next level.
From workshops to actual implementation, our team has the expertise and experience to guide you through the entire migration process.