MetaBrainz Foundation

Refactor existing Jade templates for React pages

Aim: Learn about Pug and React, and merge several near-identical Pug templates into a single generic file Time estimate: 3 hours

Several of our existing Pug templates are nearly identical - such as entity/delete.jade, relationship/edit.jade, search.jade and registrationDetails.jade. Duplication is bad, so we'd like to see these merged into a single template, with any variation handled by parameters passed from the express-js routing functions that use those templates.

To do this, you'll want to have a quick read through the Pug docs (Jade was renamed to Pug a while back, hence the file extensions). Then, take a look at the templates directory in the BookBrainz site repository and try to figure out which files to merge, and how to deal with variation.

Then, clone the repository on GitHub and locally, create a git branch for your work, prefixed "pug-template-merge-" and ending in your GCI username (eg. "pug-template-merge-bob"). Create the new Pug template file, replace references to the old template files in the routing code (src/server/routes), and then delete the old template files. Finally, push your work to GitHub, and create a new Pull Request containing the changes.

Task tags

  • react
  • pug
  • bookbrainz
  • refactor
  • javascript

Students who completed this task

BayMinimum

Task type

  • code Code
close

2016