Contact person: React.js Frontend for Campus2Career Platform

Phone:Show

Email:Show

Location: Murwāra, India

Budget: Recommended by industry experts

Time to start: As soon as possible

Project description:
"The Campus2Career Platform requires a complete frontend implementation for two portals: Student Portal and Campus Ambassador Portal. The backend is already planned. The frontend should be developed using React.js, TailwindCSS, Framer Motion, [login to view URL] (@react-three/fiber), React Router, Axios, and Context API/custom hooks. The Student Portal enables students to register, view and enroll in courses, manage their profiles, track placements, and use referral codes. Key sections include a personalized Dashboard with a welcome message, quick links to Explore Courses, My Courses, Placements, and Referrals, as well as static announcements or updates. The Profile Page displays personal details such as name, email, phone, college, year, department, and referral code, with optional editing of phone or email.

The Courses Section lists all available courses with title, description, duration, syllabus summary, and mentor name. Students can view Course Details including syllabus, mentor info, start/end dates, price, and benefits. The My Courses section shows enrolled courses with status (Active/Completed) and additional course details. The Placements Section showcases students who have been placed, with filters by company or course. The Referral Section shows the ambassador who referred the student or allows entering a referral code if none was used.

The Campus Ambassador Portal provides a single ambassador per college with access to both profile management and student monitoring features. The Dashboard displays quick stats such as the number of referred students, registered students from their college, and total course registrations via their code. My Profile shows ambassador details (name, email, college, year, department) and referral code, along with performance metrics for referrals, registrations, and placements. Student Management includes a table of all students from the same college with name, email, registered courses, status (Active/Completed), and placement status, plus search and filter functionality. The Performance Section presents graphs or tables showing student registrations, course completions, and placements.

Common Features for both portals include secure login/register/logout, responsive design for mobile, tablet, and desktop, a Help/Contact Us section with static information, and smooth animations using Framer Motion and 3D illustrations via [login to view URL] / React-Three-Fiber.
The frontend will handle updates to the database in a structured manner. Student registration will add an entry to the students table, while course registration will add records to the course_registrations table. When a referral is used, the student will be linked to the corresponding record in the campus_ambassadors table. Placement achievements will be recorded in the placements table, and campus ambassador performance will be automatically calculated based on referrals and course registrations. The frontend must follow clean, modular, and production-ready coding practices, implementing reusable UI components such as cards, tables, forms, and modals. It should ensure input sanitization, safe rendering, and maintain a modern, professional interface using TailwindCSS, Framer Motion, and [login to view URL]" (client-provided description)