Skip to content

Project structure refactor #51

@Bentroen

Description

@Bentroen

Overview

With the implementation of upcoming features demanding more complex code, as well as more advanced interactions between different parts of the project, the project's structure must be in a good state to support these additions. Postponing refactorings can lead to technical debt that's difficult to overcome later. Features implemented to follow the current structure leave more work to be done later when we change to a new structure.

As such, this issue highlights pending refactorings that were not yet completed, due to the faster iterations we undertook to release the project sooner. Right now, before we expand further, is the most appropriate time to work on these changes, as they touch practically every file on the repo. There are not as many features built on top of the current structure to make changing it too difficult, and all subsequent additions to the project will benefit from it.

Pull requests created to address these changes should not change public-facing features. (Note that this does not include the API as it's not part of our public API yet.)
This, thus, basically includes commits marked with the refactor, chore, build, test, and style conventional commit types (but no feat or fix commits must be present). These include:

  • Structural changes to the frontend project;
  • Any change to the backend and shared projects that does not disrupt what's returned to the frontend;
  • Build, test, linting and overall project structure changes to conform to the new structure

Tasks

  • [All] Remove imports between frontend <-> backend (and vice-versa) (refactor: split shared into packages #50)
  • [All] Remove imports from frontend/backend in shared (refactor: split shared into packages #50)
  • [All] Add automatic GitHub releases and deployments based on semver (or calver)
  • [All] Remove eslint-plugin-prettier and leave formatting to prettier
  • [All] Add pre-commit hook to auto-format commits
  • [All] Upgrade ESLint and accompanying plugins to version 8 and migrate to flat config
  • [All] Better document API and classes, and add this to the contributing guide
  • [All] Fix remaining TODOs across the codebase
  • [All] Add README coverage report and CI status badges
  • [All] Add E2E tests
  • [Shared] Refactor thumbnail's canvasFactory module (it's hacky to allow the same code to be imported in frontend and backend)
  • [Shared] Write tests for song obfuscation module
  • [Backend] Change api/v1/ prefix to just v1/ - as the backend is already hosted in the api subdomain
  • [Backend] Refactor song-browser and song modules to provide a single /song API path with flexible querying
  • [Frontend] Move all images into the /img subfolder
  • [Frontend] Remove docs from /public folder
  • [Frontend] Better structure component and page modules' naming convention and locations
    • The current module division doesn't make it clear whether or not something is only used by a page, or is a global component - for instance, upload form components are generic components and may be moved out of the upload module
  • [Frontend] Remove client/ path division from components
    • The 'use client'; directive at the top of each module already indicates whether something is a client component, rendering the nesting unnecessary
    • Some components are currently misplaced (server components in client/ folder and vice-versa) - it can easily lead to mistakes in component placement
    • [Optional] Consider using client-only and server-only packages for better enforcement
  • [Frontend] Consider using one component per module
  • [Frontend] Content of pages is split between pages/ and components/ directories arbitrarily. Make this uniform
  • [Frontend] Add Storybook for component testing

Metadata

Metadata

Labels

No labels
No labels

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions