feat: Virtual Science Lab — full-stack educational platform

[Copilot]

Implements a complete web platform for virtual science experiments, with role-based access for students and teachers, a 3D interactive lab, and progress tracking.

Backend (server/)

• Express + Mongoose REST API with JWT auth and bcryptjs password hashing
• Models: User, Student, Experiment, Result
• Routes: /auth (register/login), /students, /experiments, /results, /teacher
• express-rate-limit on all routes (20 req/15min auth, 200 req/15min API)
• Seed endpoint (POST /experiments/seed) restricted to authenticated teachers

Frontend (client/)

• React 18 + Vite + Tailwind CSS v4
• Auth: Login/Register with role selector; student registration is a 2-step flow (credentials → profile: name, school, wilaya, commune, education level)
• Student Dashboard: experiment cards per education level (Primary/Middle/High) showing subject, category, completion status, and score
• Virtual Lab: React Three Fiber 3D scene — lab table, clickable Battery/Switch/Bulb, animated wire rendering, bulb glow with pulsing pointLight when circuit is closed
• Quiz: unlocks after circuit completion; multiple-choice with score saved to DB
• Teacher Dashboard: student table with filters (wilaya, level, school) + results table (student, experiment, status, score, date)

Circuit logic (simplified)

// Step-gated interaction — each click advances the circuit state
const handleBattery = () => { if (step === 0) { setBatteryConn(true); setStep(1); } };
const handleBulb    = () => { if (step === 1) { setBulbConn(true);    setStep(2); } };
const handleSwitch  = () => { if (step >= 2)  setSwitchOn(s => !s);               };

const isComplete = batteryConn && bulbConn && switchOn; // triggers bulb glow + quiz unlock

Docs

• docs/PLATFORM_OVERVIEW.md: architecture, API reference, data models, getting-started guide
• docs/PROMPT_ENGINEERING.md: 8 AI prompt templates for extending the platform

Original prompt

Create a full web platform called "Virtual Science Lab".

The platform is an educational system where students can perform virtual scientific experiments online and teachers can monitor their activity.

Technology stack:

• Frontend: React
• 3D Lab: React Three Fiber (Three.js)
• Styling: Tailwind CSS
• Backend: Node.js with Express
• Database: PostgreSQL or MongoDB

---

AUTHENTICATION SYSTEM

Create a login system with:

• Email or Username
• Password
• Role selection:
  • Student
  • Teacher

---

STUDENT PROFILE DATA

Students must provide:

• Full Name
• School Name
• Wilaya
• Commune
• Education Level

Education levels:

1. Primary School
2. Middle School
3. High School

---

SUBJECTS PER LEVEL

Primary School:

• Scientific Education

Middle School:

• Physics
• Natural Sciences

High School:

• Physics
• Chemistry
• Biology

---

STUDENT DASHBOARD

After login students can see:

• Education Level
• Subjects
• Experiments list

Each experiment should appear as a card with:

• Experiment image
• Subject name
• Experiment title
• Start button

Example experiments:

Physics | Electricity
"Electric Circuit Simulation"

Physics | Mechanics
"Free Fall Simulation"

Chemistry | Inorganic Chemistry
"Test for Mercurous Radical"

---

VIRTUAL LAB ENVIRONMENT

When the student clicks an experiment, open a virtual laboratory environment.

The lab should contain:

• A laboratory table
• Scientific tools
• Interactive equipment

Students can:

• Drag and drop tools
• Connect components
• Run experiments

---

FIRST EXPERIMENT: ELECTRIC CIRCUIT

Create a simulation where the student must build a simple electrical circuit.

Tools available in the lab:

• Battery
• Light bulb
• Wires
• Switch

Behavior:

If the student connects a closed circuit correctly:

The bulb lights up.

If the circuit is incomplete:

The bulb stays off.

---

3D IMPLEMENTATION

Use React Three Fiber to create the laboratory scene.

Include:

• Lab table model
• Interactive objects
• Drag and drop interaction
• Basic physics or logic

3D models should be loaded using GLTF format.

---

TEACHER DASHBOARD

Teachers should be able to:

• View students

• View experiment results

• Filter by:

  Wilaya
  Commune
  School
  Level

Teacher dashboard should show:

Student name
School
Experiment
Completion status
Date

---

DATABASE STRUCTURE

Users table:

• id
• username
• email
• password
• role

Students table:

• id
• name
• school
• wilaya
• commune
• level

Experiments table:

• id
• title
• subject
• level

Results table:

• student_id
• experiment_id
• result
• date

---

USER INTERFACE DESIGN

Use a modern UI with:

• Experiment cards
• Dashboard layout
• Sidebar navigation
• Clean educational style

---

BONUS FEATURES

Add:

• Experiment instructions
• Quiz after experiment
• Progress tracking
• Score system

---

Goal:

Build a realistic virtual science laboratory platform where students can learn science through interactive experiments. and alawys please create md files have infos to use it for the furutre prompt engeieng

Created from VS Code.

---

📍 Connect Copilot coding agent with Jira, Azure Boards or Linear to delegate work to Copilot in one click without leaving your project management tool.