Uploaded image for project: 'Planet4'
  1. Planet4
  2. PLANET-3285

Define rules to improve JS code consistency across repos.

XMLWordPrintable

    • Icon: Task Task
    • Resolution: Fixed
    • Icon: Should have Should have
    • None
    • 1
    • Code Refactoring
    • Sprint #91

      The current JS codebase has a bunch of implementation differences that we may address to improve our overall code quality for the frontend across the core Planet4 repos (I guess master theme, blocks plugin, and EN). 

      As we are not using any heavily opinionated frameworks as React or Angular (despite GPNL using Vue), maybe we can just use strong conventions across our code to achieve "framework-like" consistency even without using one.

      For example, there are many different ways of instantiating a script, encapsulating in closures, or waiting for the DOM to be ready. 

      Some scripts have no encapsulation at all: https://github.com/greenpeace/planet4-master-theme/blob/develop/assets/js/load_more.js

      This one uses IIFE: [https://github.com/greenpeace/planet4-master-theme/blob/develop/assets/js/posts_report.js
      ]

      This one uses a jQuery closure: https://github.com/greenpeace/planet4-master-theme/blob/develop/assets/js/dashboard.js

      This one relies use `$(document).ready`: https://github.com/greenpeace/planet4-master-theme/blob/develop/assets/js/post_tag.js

       

      I think we could settle and document some consistency rules / recommendations to improve the code, for example:

      • How do we open and close scripts? IIFE, document.ready, other methods?
      • How do we create objects? Object literals, proper functions with constructor?
      • How do we compose objects?
      • Should we use some kind of namespace? 
      • What flavor/version of ECMAScript are we using? For example, GPNL has Babel on his build config. 
      • What features of ES do we want to use? arrow functions? spread operators? const?.
      • Are we happy with our toolchain? 
      • And so on...

      Goal of this story is to come up with specific rules to implement later on. Please create follow up ticket to implement in code

       

       

            pcuadrad Pablo Cuadrado (Inactive)
            pcuadrad Pablo Cuadrado (Inactive)
            Votes:
            0 Vote for this issue
            Watchers:
            0 Start watching this issue

              Created:
              Updated:
              Resolved: