Dev Tech Education
DevTechEducation
☠️ Problem Statement ☠️
Consider you have to create a website using CRUD which contains
- Creating a user (user can be a student, admin, or a teacher)
- On the homepage user is able to see all the courses offered by the company
Once the user clicks on any course there are some conditions
- If the user has bought that course then he can see all the lectures in it
A lecture contains the lecture name, lecture description, and lecture video (you can use youtube videos for reference)
- Make a payment gateway for purchasing the course after purchase user should be able to see the course
- Profile section where the user can add his basic info and see all the courses that he has enrolled
- Cart page where user can see all the courses added to the cart
- An admin can add any number of lectures in a course, also update the previous lectures and can also delete a lecture
- A teacher can add any lectures and update or delete any lectures other than all admin features
- Admin and teacher can see all the courses
💡 The Idea 💡
I am pursuing a Full Stack Web Development course at Masai school, In Masai school, I have given a project. It was a pretty good project to work on. The task was to create a course platform. Let's look at how I designed it
DevTechEducation landing page 👇 💻
🤵🏼 Student signup 👇 💻
🤵🏼 Student, 👨💼 Teacher and 👨✈️ Admin login 👇 💻
👨✈️ Admin dashboard 👇 💻
👨✈️ Create and Manage course 👇 💻
- Admin can create the new course.
- Admin can edit the existing course.
- Admin can remove the existing course.
List of course 👆🏼 💻
👨✈️ Create and Manage Subjects 👇 💻
- Admin can add subjects to an existing course.
- Admin can edit the existing subjects.
- Admin can remove the existing subjects.
👨✈️ List of Subjects 👆🏼 💻
👨✈️ Create and Manage lecture 👇 💻
- Admin can add lectures to an existing subjects.
- Admin can edit the existing lectures.
- Admin can remove the existing lectures.
👨✈️ List of lecture 👆🏼 💻
👨✈️ Create and Manage admin user 👇 💻
- Admin can add a new teacher to the course platform.
- Admin can edit the existing teacher.
- Admin can do active and inactive the existing teacher.
Teacher list 👆🏼 💻
👨✈️ Create and Manage student user 👇 💻
Admin can add a new student to the course platform. Admin can remove the existing student. Admin can do active and inactive the existing student.
Student list 👆🏼 💻
Admin profile page 👇 💻
Admin update profile and password 👇 💻
• Admin can update his profile and password
---------------------- Admin Part Done ----------------------
👨💼 Teacher dashboard 👇 💻
👨💼 Course and Subject List 👇 💻
👨💼 Create and Manage lecture 👇 💻
- Teacher can add lectures to an existing subject.
- Teacher can edit the existing lectures.
- Teacher can do active and inactive the existing lectures.
List of lecture 👆🏼 💻
👨💼 Create and Manage student user 👇 💻
Teacher can add a new student to the course platform. Teacher can remove the existing student. Teacher can remove the existing student.
Student list 👆🏼 💻
👨💼 Teacher profile info 👇 💻
👨💼 Teacher update profile and password 👇 💻
• Teacher can update his profile and password
---------------------- Teacher Part Done ----------------------
🤵🏼 Student dashboard 👇 💻
- Students can see all the courses and about course.
🤵🏼 💰 Purchase Course 💰 👇 💻
- Step 1: Click Buy Now
- Step 2: View Course
- Step 2: Make Payment
Card Details
- Card Number - 1234567891234567
- CVV Number - 123
- Exp Date - 01/12/25
- Card Holder - Dev Tech Education
🤵🏼 Now see Purchased Course in My Course 👇 💻
🤵🏼 📒 Now see all lectures 💻 👇
🤵🏼 💿 Play Video 💿 💻 👇
👨💼 Student profile info 👇 💻
👨💼 Student update profile and password 👇 💻
• Student can update his profile and password
---------------------- Student Part Done ----------------------
Project
Technology Used
• React
• Redux
• Redux-Thunk
• React-Router
• Material-UI
• Express-js
• Mongoose
• Google-Apps-Script
• Jsonwebtoken
• Bcryptjs
• Crypto-js
• Cors
• Universal-cookie
Tools
• VS Code
• Github
• Netlify
• Render
• Thunder Client
• Mongodb-Atlas
• CorelDRAW