Overview
Code Champ is a comprehensive SaaS platform designed to help users learn programming through an integrated coding environment. It includes an IDE with an automatic solution evaluation engine, enabling learners to write, test, and evaluate their code in real-time.
Project Goals
The aim was to create a scalable, intuitive platform to facilitate effective programming education. Initial steps included designing the architecture and mockups to ensure an engaging and user-friendly interface for students.
Development Process
The platform’s development focused on three core components:
Web Client
Built using VueJS and Tailwind CSS, providing a modern, high-quality user experience with intuitive navigation and responsive design.
Nginx was used for content delivery, ensuring fast and efficient frontend performance.
Server
Developed as a Spring Boot service, this component manages communication queues, efficiently handling requests and responses to and from the execution nodes.
PostgreSQL was used for data management, supporting the storage and retrieval of user data, code submissions, and evaluation results.
Execution Node
Configured using Docker and Apache Kafka, the execution nodes securely execute user-submitted code and return outputs to the server.
This modular design supports system scalability, allowing the addition of execution nodes as demand grows.
Technologies Used
Frontend: VueJS, Tailwind CSS, Nginx
Backend: Java, Spring Boot, Apache Kafka, PostgreSQL, Maven
Execution Node: Java, Docker, Apache Kafka
Achievements
Designed a fully scalable architecture that supports dynamic load handling through the addition of execution nodes.
Created a modern, user-friendly web interface, fostering an intuitive learning environment.
Implemented a secure and efficient execution engine, allowing students to run code directly on the platform with real-time feedback.
Results
Code Champ successfully combines interactive learning with advanced backend infrastructure, making it a robust tool for aspiring developers.