{"id":21662461,"url":"https://github.com/youssefelghamour/CodeWave","last_synced_at":"2025-10-06T20:31:59.098Z","repository":{"id":264365169,"uuid":"893161945","full_name":"youssefelghamour/HolbertonSchoolDashboard","owner":"youssefelghamour","description":"Front-end dashboard built with React for students to track their courses, progress, scores, and view school updates and news.","archived":false,"fork":false,"pushed_at":"2025-01-23T16:11:09.000Z","size":19259,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-23T16:35:08.206Z","etag":null,"topics":["es6","javascript","normalizr","react","react-redux","react-router-dom","reactjs","redux","redux-middleware","redux-thunk","webpack"],"latest_commit_sha":null,"homepage":"","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/youssefelghamour.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-11-23T17:39:43.000Z","updated_at":"2025-01-23T16:11:13.000Z","dependencies_parsed_at":"2024-11-23T18:41:36.504Z","dependency_job_id":null,"html_url":"https://github.com/youssefelghamour/HolbertonSchoolDashboard","commit_stats":null,"previous_names":["youssefelghamour/holbertonschooldashboard"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/youssefelghamour%2FHolbertonSchoolDashboard","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/youssefelghamour%2FHolbertonSchoolDashboard/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/youssefelghamour%2FHolbertonSchoolDashboard/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/youssefelghamour%2FHolbertonSchoolDashboard/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/youssefelghamour","download_url":"https://codeload.github.com/youssefelghamour/HolbertonSchoolDashboard/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":235549352,"owners_count":19008006,"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":["es6","javascript","normalizr","react","react-redux","react-router-dom","reactjs","redux","redux-middleware","redux-thunk","webpack"],"created_at":"2024-11-25T10:16:17.138Z","updated_at":"2025-10-06T20:31:59.093Z","avatar_url":"https://github.com/youssefelghamour.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"![Dashboard1](./client/src/assets/hero1.png)\n\n[![MongoDB](https://img.shields.io/badge/MongoDB-%234ea94b.svg?logo=mongodb\u0026logoColor=white)](#)\n[![Express.js](https://img.shields.io/badge/Express.js-%23404d59.svg?logo=express\u0026logoColor=%2361DAFB)](#)\n[![React](https://img.shields.io/badge/React-%2320232a.svg?logo=react\u0026logoColor=%2361DAFB)](#)\n[![Redux](https://img.shields.io/badge/Redux-764ABC?logo=redux\u0026logoColor=fff)](#)\n[![NodeJS](https://img.shields.io/badge/Node.js-6DA55F?logo=node.js\u0026logoColor=white)](#)\n\n# CodeWave School Website\n\nThe **`CodeWave School Website`** is a school portal designed to help students track their academic progress and stay informed. It allows students to log in, view their courses, monitor their progress and scores, and keep up with the latest news and updates from the school.\n\n## Features\n\n- **Student Login**: Secure authentication for students to access their personalized dashboard.\n- **Course Management**: Students can view and track their enrolled courses, assignments, and scores.\n- **Progress Tracking**: Real-time tracking of academic performance and grades.\n- **School Updates**: Displays news, announcements, and updates from the school.\n- **Responsive UI**: A dynamic layout that adapts to both desktop and mobile devices.\n\n## Technologies Used\n\n- **JavaScript (ES6)**: Language used for building the dashboard.\n- **React**: Frontend JavaScript library for building the user interface.\n- **Redux**: State management library for handling user data and application state.\n- **React Router**: For dynamic routing within the application.\n- **Aphrodite**: Library for managing inline styles and dynamic styling in React.\n- **Redux Thunk**: Middleware for handling async actions in Redux to fetch data from the API.\n- **Normalizr**: Data normalization library for the data fetched from the API.\n- **Immutable.js**: Data structures for managing state immutability.\n- **Webpack**: Module bundler for JavaScript applications.\n- **MongoDB**: NoSQL database used to store application data.\n- **Node.js**: JavaScript runtime environment for building the backend.\n- **Express**: Web framework for building the backend API with Node.js.\n\n## Setup\n\n1. Clone the repository:\n\n```bash\ngit clone https://github.com/youssefelghamour/CodeWave.git\n```\n\n2. Navigate to the server directory:\n\n```bash\ncd CodeWave/server\n```\n\n3. Install server dependencies:\n\n```bash\nnpm install\n```\n\n4. Set up the database (inserts data into the database):\n\n```bash\nnode utils/dbSetup.js\n```\n\n5. Start the API:\n\n```bash\nnode api/server.js\n```\n\n6. In a separate terminal, navigate to the client directory and install dependencies:\n\n```bash\ncd CodeWave/client\nnpm install\n```\n\n7. Start the React app:\n\n```bash\nnpm start\n``` \n\n8. Visit the app at `http://localhost:8080`.\n\n9. You can visit the API help page at `http://localhost:5000`.\n\n\n## Demo Video\n\nhttps://github.com/user-attachments/assets/696b4831-04a2-4e3a-a542-8bdd7baaf242\n\n## Usage\n\nOnce CodeWave is set up, you can use the following steps to interact with the platform:\n\n- Sign up as one of theregistered students (example):\n    - **email:** youssefgr@email.com\n    - **password:** password1\n- Sign up as the admin:\n    - **email:** admin@email.com\n    - **password:** admin\n    - Admins can access the dashboard to manage data, create, delete, and update student profiles, courses, and other admin-level operations.\n\n## Authors\n\n- **Youssef El Ghamour** - [GitHub](https://github.com/youssefelghamour) | [LinkedIn](https://www.linkedin.com/in/youssefelghamour/)\n\n![Dashboard1](./client/src/assets/hero2.png)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyoussefelghamour%2FCodeWave","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyoussefelghamour%2FCodeWave","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyoussefelghamour%2FCodeWave/lists"}