Remix

Make your own version of SkillConnect Learning Platform

Get an exact, working copy in your account, then change anything with chat.

Original by jyonirmala13

Start free with 40 credits. No card needed.

Start fresh from this prompt

Builds a brand new app from the first prompt only, so later changes to the original are not included.

Build a fully functional, responsive web application called SkillConnect based on my BCA college presentation, “Skill Development – A Technology-Based Solution for Better Learning and Employment Opportunities.”

The application should work similarly to Coursera, with an original design and working features. It must address the skill gap among students, job seekers, rural and low-income youth, and employers.

1. Dashboard and registration

- Create a modern homepage with Login, Sign Up, Dashboard, Courses, Career Guidance, AI Assistant, My Learning, Certificates, and Opportunities.
- Allow learners to create profiles and select their interests, current skills, and career goals.
- Provide a clean, professional, mobile-friendly interface.

2. Course learning system

- Display courses in programming, Java, Python, web development, AI, communication, digital literacy, and job readiness.
- Each course must have a description, difficulty level, modules, lessons, learning resources, and quizzes.
- Add course enrollment, lesson navigation, progress tracking, and course completion status.
- Include actual teaching content with explanations, examples, and practice questions. Do not create empty course cards or buttons that do nothing.
- Use publicly available learning resources or original educational content. Clearly label external resources.

3. AI teaching assistant and chatbot

- Add an interactive AI tutor that explains concepts in simple language, answers learner questions, provides examples, and generates practice quizzes.
- Include a chatbot interface with a message box, send button, chat history, and helpful responses.
- If an AI API is required, provide a clear integration setup using secure environment variables. Never expose API keys in frontend code.
- If no API is configured, provide a working demo mode with predefined educational responses and clearly explain its limitations.

4. Skill assessment and personalized recommendations

- Create an interactive skill assessment quiz.
- Calculate results and identify strengths and areas for improvement.
- Recommend courses based on the learner's answers, interests, and career goals.
- Explain why each course is recommended.

5. Career guidance

- Include career paths such as software developer, web developer, data analyst, AI-related roles, and other suitable entry-level careers.
- Show the skills required, suggested courses, learning roadmaps, and practice projects for each career.
- Let learners choose a career goal and view a step-by-step learning plan.

6. Certificates and portfolio

- Track completed courses, quiz scores, projects, and achievements.
- Generate a downloadable completion certificate for courses completed within the application.
- Allow learners to add projects and descriptions to their portfolio.
- Clearly distinguish platform-generated certificates from certificates issued by external institutions.

7. Internship and opportunity matching

- Create an opportunities page for internships, projects, and entry-level jobs.
- Include search, filters, eligibility details, skills required, and application links.
- Use verified or clearly identified sample listings. Do not invent real employers or claim that a learner has applied when they have not.

8. Progress dashboard

- Show enrolled courses, completed lessons, quiz scores, learning progress, earned certificates, and recommended next steps.
- Save progress so that users can continue learning after returning.

9. Technical requirements

- Build a working frontend and backend where supported.
- Use a database for user profiles, courses, enrollments, assessments, and progress.
- Implement authentication, input validation, secure data handling, and appropriate privacy protections.
- If a backend service or API is unavailable, provide a functional demo with realistic sample data and clearly identify the limitations.
- Every navigation item, button, form, quiz, and interactive component must work.
- Include loading states, error messages, empty states, and success feedback.
- Make the app accessible, responsive, easy to use, and suitable for a college classroom demonstration.

10. Presentation requirements

- Use the application name SkillConnect.
- Use a modern education-platform design with course cards, progress indicators, a sidebar or navigation bar, and a professional color scheme.
- Include sample learner data and sample courses so the application looks complete during the presentation.
- Make the homepage demonstrate the social problem, proposed solution, beneficiaries, benefits, and implementation plan from my presentation.
- Add a demo account or easy demo access so my teacher can test the application without complicated setup.

Final instruction: Build the complete working application, not just a UI mockup or landing page. Test all major user flows, fix errors, and provide the running preview and instructions for using it. Prioritize a functional course-learning experience, AI tutor demo, skill assessment, career recommendations, progress tracking, and certificates.

Start fresh from this prompt

Builds a brand new app from the first prompt only, so later changes to the original are not included.