[Improvement] Add ESLint and Prettier configuration to the frontend

[grantfox-oss]

Getting Started

1. Fork the repository: https://github.com/JointSave-org/Joint_Save
2. Clone your fork:

   git clone https://github.com/<your-username>/Joint_Save.git
   cd Joint_Save

3. Create a new branch:

   git checkout -b chore/eslint-prettier-setup

---

Overview

The frontend has no Prettier config and minimal ESLint rules beyond Next.js defaults. This leads to inconsistent formatting across contributions.

Requirements

ESLint

• Add @typescript-eslint/recommended, react-hooks/rules-of-hooks, react-hooks/exhaustive-deps
• Set no-console to warn, @typescript-eslint/no-explicit-any to error

Prettier — frontend/.prettierrc

{ "semi": false, "singleQuote": false, "tabWidth": 2, "trailingComma": "es5", "printWidth": 100 }

package.json Scripts

"lint": "eslint . --ext .ts,.tsx",
"lint:fix": "eslint . --ext .ts,.tsx --fix",
"format": "prettier --write .",
"format:check": "prettier --check ."

CI

Update .github/workflows/test.yml to run npm run lint and npm run format:check on every PR.

Acceptance Criteria

• npm run lint passes with no errors
• npm run format:check passes
• CI fails the PR if lint or format check fails
• CONTRIBUTING.md updated to mention running lint before committing

[Swayymalcolm99]

Can I take this on please?

[AnnieIj]

I have experience in frontend. I would love to work on this Project, and I am assuring you will get the best result. Thanks

[darius-daniel]

Hi! I'd like to work on this issue.

I have experience setting up ESLint, Prettier, and CI workflows in TypeScript/React projects. I'll add the requested linting and formatting rules, update the package scripts, integrate lint and format checks into the GitHub Actions workflow, and update CONTRIBUTING.md with the development guidelines.

Happy to submit a PR.

[JenyferMontano]

Hello. I'd love to set up the ESLint and Prettier configuration for the frontend.

I'm very familiar with configuring linting tools, formatting rules, and updating GitHub Actions workflows for CI/CD checks. I can get this sorted out and make sure all checks pass cleanly within a few hours.

[Franker24]

Hi! I would like to contribute to this issue.

I'm a Fullstack Developer with experience working with React, TypeScript, Next.js projects, and frontend development workflows.

I can help improve the frontend development environment by adding ESLint and Prettier configuration, setting up consistent code quality rules, updating package scripts, and integrating lint/format checks into CI.

I will keep the configuration aligned with the existing project structure and make sure contributors have a cleaner and more consistent workflow.

I would be happy to contribute to improving the project's frontend quality.

[retkatmun]

Hi, I'm a frontend developer with experience in HTML, CSS, Tailwind CSS, Vanilla JavaScript, and Python.

I have built and deployed responsive web applications and I'm comfortable working with Git and GitHub workflows. Based on the issue description, I believe I can complete this task effectively and follow the project's coding standards.

I'm eager to contribute to the project, improve my open-source experience, and deliver a quality solution within the expected timeframe.

Thank you for considering my application.

[grantfox-oss]

🦊 GrantFox — @Franker24 has been assigned to this issue as part of the Official Campaign campaign!

Next steps:

1. Open a Pull Request referencing this issue (e.g., Closes #16)
2. Your PR will be reviewed by the JointSave-org maintainers

Good luck! Track your progress on GrantFox.

[SudiptaPaul-31]

May I be assigned to this issue please my name is Sudipta Paul a active open source contributor with more than 50+ merged pr's and also an active contributor of GrantFox from begining and would love to work on this issue and get a pr merged