Skip to content

Latest commit

 

History

History
54 lines (42 loc) · 2.46 KB

README.md

File metadata and controls

54 lines (42 loc) · 2.46 KB

clean-todo-firebase

clean-todo-firebase is a task management (to-do) project that uses Clean Architecture to ensure a scalable and maintainable design. This web application is based on React for the user interface, Express for the server, and Firebase as the backend for data management.

Features

  • Clean Architecture: Implements Clean Architecture principles to separate concerns and facilitate code evolution.
  • Task Management: Allows users to efficiently add, edit, delete, and list tasks.
  • Firebase as Backend: Uses Firebase Firestore for data storage, providing fast and robust integration with cloud services.
  • SSR and Rehydration: Utilizes server-side rendering (SSR) to enhance user experience and SEO optimization, with client-side component rehydration.
  • User-Friendly Interface: Developed with Tailwind CSS to provide a modern and responsive user experience.

Technologies Used

  • Frontend: React, Tailwind CSS
  • Backend: Express, TypeScript
  • Database: Firebase Firestore

Installation

To install and run the project, follow these steps:

  1. Clone the repository.
  2. Install the dependencies: 
    npm install
  3. Set the Firebase environment variable: 
    export GOOGLE_APPLICATION_CREDENTIALS="/home/user/Downloads/service-account-file.json"
  4. Make sure to set up an authentication method in Firebase and configure a Firestore database.
  5. Compile and run the server: 
    npm run dev

Missing Features

  • Task Pagination: The pagination for tasks is not fully implemented yet. This feature needs to be correctly integrated to handle multiple pages of tasks and navigate between them.
  • Task Detail Page: The functionality to open a task on a separate page is not yet available. Each task should be clickable and open in its own dedicated view to allow better task management and display detailed information.
  • Correct Path Implementation: The project currently uses relative paths for importing elements, such as: 
    import { Todo } from "../../../core/entities/Todo";
    Ideally, paths should be implemented in a more organized and clean way using aliases, like this: 
    import { Todo } from "@core/entities/Todo";
    This will make imports clearer and more maintainable as the project scales.

Contributions

Contributions are welcome. If you would like to collaborate, feel free to open an issue or submit a pull request.