Considering using Prettier and research on setup via CL and Plugin

MicahBear commented 1 year ago

Dependency

https://github.com/hackforla/website/issues/5248

Overview

We need to consider implementing a solution like Prettier to prevent developers from pushing additional file changes due to formatting preferences in their IDE. This helps to reduce 50+ line changes when a simple alt text is changed due to a developer’s auto-format save.

Details

The discussion from Thursday (02-23-23) Office hours, considering the use of Prettier (opinionated code formatter) on website repo because many devs use it and have to remember to disable Prettier or it is forgotten, especially by just onboarded devs. The consensus was there is a need to research what that looks like and if it would be beneficial/easy.

Action Items

[ ] Invite other devs to comment on issue
- questions to ask:
  - Do you use it?
  - Do you like it?
  - If you don't use it, why don't you?
[ ] Research the process use and install Prettier locally -per project.
[ ] Research the process of using Prettier via editor.
[ ] Present and discuss with Website team.

Reservations & Concerns

What if people don't want to install prettier?
How does this impact PR reviews
What would we need to do to existing code in the repo

Resources/Instructions

ExperimentsInHonesty commented 1 year ago

@MicahBear we think this issue will need to be more thought out. Thanks for making the issue. Things to include in the planning are

What would we need to do to existing code in the repo
How does this impact PR reviews
What if people don't want to install prettier ?
etc.

Please also invite devs to leave comments on this issue Do you use it? Do you like it? Why don't you use it? Reservations & Concerns

ronaldpaek commented 1 year ago

@ExperimentsInHonesty I am not an expert on prettier and formatting, but I had some formatting issues. I thought it was my computer, but it's cause the site doesn't have any linter or config files to make the spacing and syntax uniform. Those issues arise from some people having trailing white space on save, where it removes white space, and others leaving it on. I thought we use docker as our container, so we don't have to worry about things being different on other's computers, but usually, when I use prettier, I have it installed. It formats on save, but if we were to apply prettier for the site, it would be a GitHub action where it would check/format the code before it lets you make a PR.

I don't know how to do all this 100%, but it's possible, and from what I can tell, we already have an SCSS Linter. All this can be done incrementally, meaning. Per file type of thing, that could potentially be a lot of small issues; of course, there is the format of every file, but I don't think that's feasible, and that is what you don't sure. 😄

github-actions[bot] commented 1 month ago

@nssensalo

Please add update using the below template (even if you have a pull request). Afterwards, remove the '2 weeks inactive' label and add the 'Status: Updated' label.

Progress: "What is the current status of your project? What have you completed and what is left to do?"
Blockers: "Difficulties or errors encountered."
Availability: "How much time will you have this week to work on this issue?"
ETA: "When do you expect this issue to be completed?"
Pictures (optional): "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either: 1) place your issue in the Questions/In Review column of the Project Board and ask for help at your next meeting, 2) put a "Status: Help Wanted" label on your issue and pull request, or 3) put up a request for assistance on the #hfla-site channel. Please note that including your questions in the issue comments- along with screenshots, if applicable- will help us to help you. Here and here are examples of well-formed questions.

_{You are receiving this comment because your last comment was before Tuesday, July 30, 2024 at 12:05 AM PST.}

nssensalo commented 1 month ago

Progress: I starting brainstorming then took a break in July because I figured it wouldn't be a good time to reach out to people oon break.

Blockers: I actually wanted to know more about the SCSS linter in github and how that fails to achieve what Prettier could prevent. I would love if a senior developer could walk/talk me through some of the previous problems and the github actions setup so I can get a more hands on idea of the problem.

ETA: After brainstorming this may need to be divided into smaller tickets or stages... But I will have an update of my progress by EOD Friday 8/9.

nssensalo commented 1 month ago

Update:

Delayed. Was planning to bring this up in office hours but they were canceled last Thursday. Will try again for office hours this week...

nssensalo commented 3 weeks ago

This issue will be better suited for a lead/team follow-up with more knowledge and experience with this project. I'm going to unassign and select a new issue.

hackforla / website