JSFoo Pune 2020

On component architecture, performance, security for front-end, and emerging trends

Codemods - A Paradigm Shift in Migrating Large code-bases

Submitted by Rajasegar Chandiran (@rajasegar) on Jan 16, 2020

Duration of the session: 30 mins full talk Status: Confirmed & Scheduled

Abstract

Codemod is a mechanism to make sweeping changes across your code with ease and effectiveness, assisting in large-scale migrations of the code-base. This can be performed through automated tools such as jscodeshift. Many JS frameworks rely heavily on codemods to make the associated code migrations seamless, so that the developers using the frameworks don’t have to rewrite a significant amount of code when they move on to new APIs or to a new version of the framework itself. Frameworks such as React, Vue, Angular and Ember have published a lot of codemods (and codemod tools) to assist the developers to carry out large-scale code migrations for the applications written in the frameworks.

Outline

Codemods - Why and What, Problem with Regex pattern matching, Find & Replace Limitations, AST, How codemods work, Tooling around codemods - jscodeshift, recast, astexplorer.net, ast-types, codemod-cli and possibly a small demo of creating a codemod if time permits.

Speaker bio

I am working with Freshworks as a front-end developer. I am passionate about open-source software and currently writing codemods for the Ember.js community.
Having studied and written
a lot of codemods in Javascript, I become more involved in the tooling using ASTs(Abstract Syntax Trees). So then I explored writing codemods even for other languages like Ruby for doing large-scale migrations for Ruby on Rails also. In the process, I became more familiar with the AST tooling like parsers, compilers and so on, such as Babel, JSCodeshift and ESCodegen. I have published a lot of official codemods for the Ember.js framework and work closely with the Core team on improving the codemod tooling for the framework.

Links

Slides

https://drive.google.com/file/d/1fHmdLBZktBE_yvhP4Oj75zoFOMYGuob5/view?usp=sharing

Comments

  • Zainab Bawa (@zainabbawa) 3 months ago

    Thank you for today’s rehearsal Rajasegaran. Here are the points from today’s feedback:

    1. Detailed presentation. Hands-on.
    2. Real world examples are missing. Have you used CodeMods in your company? What was the outcome? Share examples because developers want to learn about real-world implementation.
    3. Do a short comparison of alternatives of CodeMods with other options along parameters such as community support, optimization, etc This will help participants to understand evaluate CodeMods.
    4. Have all the code snippets ready, and added in your slides as screenshots.
    5. Internet connectivity is an issue. Have all demos offline.
    6. You need to add punch to convince audience on why they should consider CodeMods. Right now, the presentation sounds like a report of CodeMods. Real-world examples with patterns and anti-patterns will help.
    7. Explain how confident and accurate can you be when writing CodeMods for large codebases. This is complex, so some guidelines will help. Add guidelines with practical experience. Because larger benefit for CodeMods is for larger codebases.
    8. Show a more complex function as an example rather than the current example.
    9. After the initial introduction where you start with a story, have a slide afterwards which shows participants how you will walk them through the talk.
    10. Add a contact info slide at the end of the presentation.
    11. Where you have borrowed graphs, quotes or content from other sources, attribute the source in the slide itself.

    Submit your revised slides by 18 February latest so that we can do a final review.

Login to leave a comment