DEV - Implement Prettier code formatting standard

[DrAcula27]

Overview

Propose formatting standard for the 311 Data repo with Prettier

More Info (optional)

Consider finding an existing open source project with well-documented code formatting rules that would work well with our codebase

Action Items

• Propose a code formatting standard. Consider providing...
  • .prettierrc
  • .editorconfig
  • examples of this formatting configuration on another repo

Resources/Instructions

• Link to @efrenmarin45 Dev.to article on Prettier: https://dev.to/efrenmarin/format-your-code-using-prettier-like-a-pro-fj8

[efrenmarin45]

The article goes over setting up Prettier and automating the formatting process by using git hooks. The two files used to format in the example (.prettierrc, .editorconfig) uses the default formatting VSCode comes with out the box. I'd recommend trying out the workflow locally on a personal project to get the gist of how formatting works.

[ryanfchase]

This ticket is ready to be picked up 👍

[traycn]

Hey @ryanfchase

Let's move this ticket back to Icebox as the Action Items aren't clearly defined and would have to involve collaboration with the dev team. I propose we follow these steps as individual Dev issues for the Epic (#1877):

1. Update this ticket with action items to add Prettier to our application with a default formatting dev team agrees on.
2. Developers run Prettier's default formatting locally to:
   • address any bugs/issues we come across
   • share our thoughts for custom formatting we'd like to implement as a team
     • define the teams standard for code formatting
     • NOTE: Add docs OR reference prettier config for devs to know what the teams formatting standards are
3. Update Prettier with the teams standard on code formatting in the config.

---

Btw @efrenmarin45 I really appreicate your article on Prettier! I agree with running Prettier locally. In our next team meeting let's all discuss the intent behind formatting and talk next steps in using Prettier in our development workflow.

[ryanfchase]

@traycn works for me, but I think we should just incorporate your proposed list into the action items of this ticket. I don't see a point of splitting it into multiple tickets when one dev should be responsible for integrating the prettier config files.

If Steps 1-3 are integrated into this ticket, then we can remove my proposed ticket "Implement and test Prettier configuration files" and "Implement and test Prettier configuration files" from the Epic.

Do you have thoughts on when we should actually perform and commit a Prettier format for the entire codebase?

[ryanfchase]

Moved ticket to New Issue Approval since we are discussing Action Items.

[traycn]

Let's set this ticket for Post-Launch and start working on this implementation when we're more moved along with Pre-Launch.

Concerning the Epic for this Prettier implentation, what was the reasoning behind creating an Epic? Also how do PMs decide on when a task is an Epic or an individual issue?