{"id":20710690,"url":"https://github.com/mahdi-q/note-app-react-project","last_synced_at":"2025-10-08T05:11:46.218Z","repository":{"id":243274877,"uuid":"811940386","full_name":"mahdi-q/Note-App-React-Project","owner":"mahdi-q","description":"A web application for writing and organizing your notes, developed using the React.js library.","archived":false,"fork":false,"pushed_at":"2024-12-12T10:52:19.000Z","size":82,"stargazers_count":1,"open_issues_count":0,"forks_count":2,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-27T18:52:43.085Z","etag":null,"topics":["note-app","react-app","react-note-app","react-web-app","web-app","web-application"],"latest_commit_sha":null,"homepage":"https://note-app-react-project.vercel.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mahdi-q.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-06-07T15:55:50.000Z","updated_at":"2024-12-12T10:52:23.000Z","dependencies_parsed_at":null,"dependency_job_id":"39b7f49d-8207-44fc-841a-61a71dcd9604","html_url":"https://github.com/mahdi-q/Note-App-React-Project","commit_stats":null,"previous_names":["mahdi-q/note-app-react-project"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mahdi-q%2FNote-App-React-Project","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mahdi-q%2FNote-App-React-Project/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mahdi-q%2FNote-App-React-Project/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mahdi-q%2FNote-App-React-Project/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mahdi-q","download_url":"https://codeload.github.com/mahdi-q/Note-App-React-Project/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248824693,"owners_count":21167343,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["note-app","react-app","react-note-app","react-web-app","web-app","web-application"],"created_at":"2024-11-17T02:12:52.527Z","updated_at":"2025-10-08T05:11:46.208Z","avatar_url":"https://github.com/mahdi-q.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Note App React Project\n\nA web application for writing and organizing your notes, developed using the React.js library and TypeScript.\n\n## Table of Contents\n\n- [Installation](#installation)\n- [Usage](#usage)\n- [Features](#features)\n- [Key Concepts](#key-concepts)\n- [Contact Information](#contact-information)\n\n## Installation\n\n### Prerequisites\n\n- Node.js and npm should be installed on your machine.\n\n### Steps\n\n1. Clone the repository:\n   ```bash\n   git clone https://github.com/mahdi-q/Note-App-React-Project.git\n   ```\n2. Navigate to the project directory:\n   ```bash\n   cd Note-App-React-Project\n   ```\n3. Install the dependencies:\n   ```bash\n   npm install\n   ```\n4. Run the app:\n   ```bash\n   npm run dev\n   ```\n5. Click on the link provided in the terminal to open the app in your browser.\n\n## Usage\n\nTo start using the Note App, follow the steps below:\n\n1. Open the app in your browser.\n2. Add a new note by entering a title and a description.\n3. Manage your notes by marking them as completed or removing them.\n4. Use the sorting options to organize your notes based on different criteria.\n\n## Features\n\n- **Add Notes**: Add notes with a title and description.\n- **Remove Notes**: Delete notes from the list.\n- **Mark as Completed**: Mark notes as completed.\n- **Status Display**: View the number of notes in the following statuses:\n  - All\n  - Completed\n  - Open\n- **Sort Notes**: Sort notes based on:\n  - Latest\n  - Earliest\n  - Completed\n\n## Key Concepts\n\nThis project explores several important concepts from the React library:\n\n- **Lifting State Up**: Share state between components by lifting it up to the nearest common ancestor.\n- **Derived States**: Derive state values from props or other state variables.\n- **useReducer Hook**: Manages complex state logic with a reducer function.\n- **Children Props**: Pass components as props to other components.\n- **useContext Hook**: Access context values without prop drilling.\n- **Custom Hook**: Reusable function that encapsulates logic using hooks.\n- **CSS Modules**: Use CSS Module to have the modular styles.\n- **Tests**: Use Vitest and React-Testing-Library for developing project tests.\n\n## Contact Information\n\nFor any questions or feedback, please contact me at [ghasemi84mahdi@gmail.com](mailto:ghasemi84mahdi@gmail.com).\n\n---\n\nThank you for using the Note App! Happy note-taking!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmahdi-q%2Fnote-app-react-project","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmahdi-q%2Fnote-app-react-project","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmahdi-q%2Fnote-app-react-project/lists"}