<img src="https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge&logo=html5&logoColor=white" alt="HTML5 Badge" height="28"/><img src="https://img.shields.io/badge/CSS3-1572B6?style=for-the-badge&logo=css3&logoColor=white" alt="CSS3 Badge" height="28"/><img src="https://img.shields.io/badge/JavaScript-323330?style=for-the-badge&logo=javascript&logoColor=F7DF1E" alt="JavaScript Badge" height="28"/>

<img width="1920" height="1080" alt="image" src="https://github.com/user-attachments/assets/2a8a57b1-9571-4cd3-9491-8caf33ebcf44" />

EXAM SHELL PROGRAM

🎓 Exam Shell — Smart Simulator for the 42 Exam

Exam Shell is a web-based application designed to help students from the 42 school efficiently prepare for their exams. The platform allows users to generate questions based on 4 difficulty levels, while tracking their accuracy and mistakes in real time, supporting a data-driven study experience with spaced repetition and active feedback.

Built with performance, accessibility, and user experience in mind — using only Vanilla JavaScript, Semantic HTML5, and Responsive CSS3.

---

🚀 Key Features

• 📚 Automatic question generation based on the 4 difficulty levels used in the 42 exam.
• 📈 Performance tracking system: stores the number of correct and incorrect answers per level.
• 🔁 Smart repetition logic: missed questions are shown more often, reinforcing weaker areas.
• 🎨 Minimalistic and intuitive interface, focused on study flow and clarity.
• 🔄 Endless practice loop, enabling consistent training with randomization.
• 🧑‍💻 100% client-side: no backend or installation required.
• 💾 Optional data persistence via localStorage

---

💻 Technologies & Skills Demonstrated

| Technology | Purpose | |------------|---------| | JavaScript (ES6+) | Core logic for generating questions, controlling app flow, state management, timers, and DOM manipulation. | | HTML5 | Semantic structure, accessible layout, and organized component hierarchy. | | CSS3 (Flexbox & Grid) | Responsive layout design, smooth animations, custom variables, and visual consistency across devices. |

---

🎯 Project Goals

42 is a school that values autonomy, rigor, and hands-on mastery. This project aims to:

• Help students practice consistently and efficiently;
• Automate the tracking of individual performance;
• Simulate the exam environment with a real-world rhythm;
• Showcase my ability to create full web applications from scratch, using only native web technologies.

---

🧪 Live Demo

<p align="center"> <a href="https://youtu.be/cpDrSKj4Dc0" target="_blank"> <img src="https://img.youtube.com/vi/cpDrSKj4Dc0/hqdefault.jpg" alt="Exam Shell Demo" width="400" height="300"> </a> </p> <p align="center"> <strong>▶️ Click the image above to watch the Exam Shell demo on YouTube</strong> </p>

---

📦 Getting Started

You can run Exam Shell locally in just two steps:

1. Clone the repository:

git clone https://github.com/your-username/exam-shell.git

🛣️ Roadmap

[ ] Random question generation per level

[ ] Accuracy and mistake counter

[ ] Responsive design (mobile/desktop)

[ ] Save progress using localStorage

[ ] Performance history screen

[ ] Timer per question *(coming soon)*

[ ] Export results

[ ] Competitive mode with ranking *(future)*

👨‍💻 About Me

Hi! I'm Allan Rabelo, a Full Stack Developer passionate about building educational tools, interactive interfaces, and user-centric web apps that truly help people learn better and faster.

This project reflects my practical skills in JavaScript, HTML, and CSS, with a strong focus on clean logic, minimalist UI, and real-world application.