https://github.com/ahmed-maher77/edumanage__learning-platform
A React-based CRUD web application that allows users to manage instructors and courses, featuring operations to create, read, update, and delete records with high accessibility and responsive design.
https://github.com/ahmed-maher77/edumanage__learning-platform
bootstrap crud crud-application educational-project js localstorage oop react react-router react-router-dom reactjs responsive-design sass-framework scss scss-framework user-friendly-interface
Last synced: 2 months ago
JSON representation
A React-based CRUD web application that allows users to manage instructors and courses, featuring operations to create, read, update, and delete records with high accessibility and responsive design.
- Host: GitHub
- URL: https://github.com/ahmed-maher77/edumanage__learning-platform
- Owner: Ahmed-Maher77
- Created: 2024-09-06T19:13:17.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2025-09-07T22:33:11.000Z (10 months ago)
- Last Synced: 2025-09-08T00:21:07.488Z (10 months ago)
- Topics: bootstrap, crud, crud-application, educational-project, js, localstorage, oop, react, react-router, react-router-dom, reactjs, responsive-design, sass-framework, scss, scss-framework, user-friendly-interface
- Language: JavaScript
- Homepage: https://ahmed-maher77.github.io/EduManage__Learning-Platform/
- Size: 1.36 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# EduManage - Learning Management Platform
A learning management web application with full CRUD functionality to manage instructors and courses, featuring a responsive and accessible interface, modern UI design, smooth user experience, and persistent data storage for seamless management.
---
## 💻 Technologies
- **📱 Frontend**
- **React.js** → Builds dynamic, component-based UIs with efficient rendering.
- **JavaScript (ES6+)** → Powers application logic with modern, clean, and modular code.
- **🎨 Styling**
- **SCSS** → Provides maintainable, reusable, and scalable styling with variables and nesting.
- **Bootstrap** → Ensures responsive layouts and prebuilt UI components for faster development.
- **✈️ Routing**
- **React Router v6** → Handles client-side navigation in SPAs.
- **🛠️ Build Tools**
- **Create React App** → Zero-config React setup with build tools.
- **Node.js** → Runtime environment and dependency management.
- **⚙️ Deployment & Assets**
- **gh-pages** → Simplifies deployment of the app to GitHub Pages.
- **SVG** → Delivers crisp, scalable icons and animated shapes with lightweight performance.
---
## 🌐**Demo (Live Preview):**
👉 **Live Preview:** https://ahmed-maher77.github.io/EduManage__Learning-Platform/
---
## 🎥 **Demo Video:**
📹 **Watch Video on LinkedIn:** coming soon
---
## ✨ Key Features
- **CRUD Operations**: Complete Create, Read, Update, Delete functionality for instructors and courses
- **Professional Landing Page**: Modern hero section with animated blue gradient background and floating elements
- **Accessibility First**: WCAG compliant with ARIA labels, keyboard navigation, and screen reader support
- **Responsive Design**: Optimized for all device sizes with Bootstrap grid system
- **Data Persistence**: localStorage integration for seamless data management
- **Modern UI/UX**: Clean interface with smooth animations and reduced motion support
- **Auto-Scroll Navigation**: Smooth scroll to top on route changes with motion preference respect
- **Initial Loader**: Professional loading screen with animated spinner
- **Enhanced Forms**: Comprehensive validation with proper error messaging and accessibility
---
## 👀 Website Preview:
---
## 📥 Installation Instructions for Local Setup:
```bash
# Prerequisites
- Node.js (v14 or higher)
- npm or yarn
# Clone the repository
git clone https://github.com/Ahmed-Maher77/EduManage__Learning-Platform.git
cd EduManage__Learning-Platform
# Install dependencies
npm install
# Start development server
npm start
```
The application will open at `http://localhost:3000`
---
## 📱 Usage
1. **Landing Page**: Professional homepage with feature overview
2. **Dashboard**: Central hub for managing instructors and courses
3. **Instructors**: Add, edit, and manage instructor profiles
4. **Courses**: Create and organize course listings
---
## 📬 Contact & Contribution
- 🧑💻 **Portfolio:** https://ahmedmaher-portfolio.vercel.app/
- 🔗 **LinkedIn:** https://www.linkedin.com/in/ahmed-maher-algohary
- 📧 **Email:** ahmedmaher.dev1@gmail.com
> Contributions, suggestions, and bug reports are welcome. Feel free to open issues or pull requests.
---
## ⭐ Support
If you found this project helpful or inspiring, please consider giving it a ⭐. Your support helps me grow and share more open-source projects like this!