Real Talk JavaScript

Episode 6: Upgrading JavaScript Apps with Sam Julien

Episode Summary

John and Ward talk with Sam Julien about how he approaches upgrade to Angular and other JavaScript applications. Sam spent the last few years at a non-profit with a series of refactors and migrations/rewrites with his team. For example: - Rewriting the C# API, first to unit of work (complete rewrite), then refactoring to CQRS - Adding ES6, followed by TypeScript, to the AngularJS front ends - Migrating the front ends from Gulp to Webpack and from Bower to npm - ngUpgrade (still in process when I left) - Determining whether to update to Webpack 4 or move to the CLI later - Several large data structure refactor projects initiated by the business that affected the entire stack (from SQL to Angular) They had to evaluate the risk of maintenance vs the risk of updating vs the risk of rewriting. They used a mix of determining the business impact, the technical debt, and developing proof of concepts to figure this out each time. I feel like this is a constant issue teams face, especially smaller teams that are not working for software companies (though software companies, of course, do this as well, but are perhaps more driven by end-user needs/sales).

Episode Notes

Recording date: 2018-09-20

Tweet

John Papa https://twitter.com/john_papa

Ward Bell https://twitter.com/wardbell

Sam Julien https://twitter.com/samjulien

Notes:

(0:00:59) you've got javascript, what do you do?

(0:02:30) Taylor Swift - Shake it Off - from the mailbag

(0:04:04) Sam talks about his time at a non-profit to help upgrade a project

(0:04:35) Sam talks about using Hot Towel, Gulp, Bower and npm

(0:05:00) Sam talks about his Angular v1 app https://angularjs.org/

(0:05:20) Hot Towel https://johnpapa.net/hottowel/

(0:06:00) Sam talks about adding ES6

(0:06:23) Gulp https://gulpjs.com/

(0:06:37) Babel https://babeljs.io/

(0:07:00) WebPack https://webpack.js.org/

(0:07:19) Sam went to NgConf to learn about the next version of Angular https://www.ng-conf.org/

(0:07:50) Angular https://angular.io/

(0:08:03) Sam talks about where he looked for guidance on upgrading Angular

(0:08:40) Ward asks Sam if Gulp and WebPack are comparable

(0:10:00) Sam talks about issues he faced with Webpack and how they tackled it

(0:12:21) Sam talks about how they approached the upgrade in terms of the infrastructure

(0:12:58) Sam says nobody was talking about how the mental shift of starting Angular apps changed from v1 to v2

(0:13:30) Ward talks about the tool change shift

(0:13:50) Ward discusses how he shifted from Gulp to the Angular CLI for builds

(0:17:29) John asks Sam about the churn in JavaScript tooling

(0:18:11) Sam compares angular.js to jQuery

(0:18:21) Ward coins the phrase "Script Kitty"

(0:20:39) Sam refers to the Indiana Jones swap https://www.youtube.com/watch?v=0gU35Tgtlmg

(0:21:23) Ward asks Sam if he found a strategy that worked in upgrading old to new angular

(0:21:48) ngupgrade https://angular.io/guide/upgrade

(0:23:00) Sam talks about Change detection in upgrades

(0:23:30) John asks Sam ho wlong the upgrade took for his team

(0:24:00) Sams talks about how long it took him and his team to upgrade

(0:26:29) Sam says he was allowed 30% of their time on technical debt to upgrade/refactor

(0:25:33) John asks Sam if the time investment was worth the upgrade

(0:27:10) Ward proposes that it may be better to re-do the app vs upgrade

(0:28:13) Sam talks about how to weigh the factors for upgrade vs re-do

(0:34:02) Sam talks about the unit of work pattern https://docs.microsoft.com/en-us/aspnet/mvc/overview/older-versions/getting-started-with-ef-5-using-mvc-
4/implementing-the-repository-and-unit-of-work-patterns-in-an-asp-net-mvc-application

(0:34:27) John asks if it's good to look at how long the app took to write in the first place, when upgrading

(0:41:51) Ward says it often is faster to rewrite the code than upgrade it

(0:43:54) Ward is deeply suspicious

(0:48:50) Gatsby https://www.gatsbyjs.org/

(0:52:25) Someone to follow - Katerina Skroumpelou https://twitter.com/psybercity

(0:52:53) Someone to follow - Pamela Ocampo https://twitter.com/pmocampo?lang=en

(0:53:33) Someone to follow - https://twitter.com/jdjuan Juan Herrera https://twitter.com/jdjuan?lang=en ngColumbia

(0:54:00) Someone to follow - Brandon Roberts https://twitter.com/brandontroberts?lang=en

Resources