Prudal

Year

2025

Tech & Technique

React, React Query, JavaScript, TailwindCSS, Formik + Yup, Shadcn UI

Description

Full-featured English learning platform including public website, student and teacher dashboards, placement test engine, level-based course subscriptions, lesson progress tracking, teacher file/video uploads with student access, and interactive UI elements

Key Features:

Dedicated dashboards for both students and teachers
Teacher dashboard includes attendance tracking, exam management, grade correction, and student performance monitoring
Placement test engine to assess student levels
Secure online payment gateway for course subscriptions
Teacher uploads of videos, assignments, and lectures with download access for students
Public website for course browsing and general information
Level-based course subscriptions and lesson tracking
Interactive and responsive UI supporting various devices

Technical Highlights:

Responsive and dynamic UI built with TailwindCSS, ensuring consistent design and fast development across all screen sizes.
Integrated form management using Formik with schema-based input validation powered by Yup for secure and user-friendly forms.
Real-time backend services including authentication, database, and file storage with a clean JavaScript client.
Optimized data fetching, caching, and background updates using TanStack Query for a smooth and performant user experience.
Support for secure online payments and subscription flows via third-party payment gateway integration (e.g., Stripe).
Structured access control and role-based routing for students and teachers within their dedicated dashboards.
Efficient media upload and delivery system allowing teachers to upload lectures and assignments with controlled student access.

My Role

As the Front-End Developer, I was fully responsible for developing the entire front-end of the platform, including the public website, student dashboard, and teacher dashboard. I built responsive and accessible UIs using Tailwind CSS, efficiently managed server-state with React Query, and implemented dynamic forms using Formik with validation schemas powered by Yup. I also handled full integration with backend APIs to ensure smooth data flow and a seamless user experience.