FACULTY OF COMPUTER SCIENCE &

ENGINEERING
DEPARTMENT OF COMPUTER SCIENCE & ENGINEERING

BACHELOR OF TECHNOLOGY
(COMPUTER SCIENCE & ENGINEERING)

(ACADEMIC SESSION: 2022–2026)

MAJOR PROJECT REPORT

ON

Code Craft
SaaS Online Code Editor Platform

Submitted By:
Dhaka Ravina Suresh
Registration No: 2022PUFCEBCEX12304

Ms. Sakshi Sharma Dr Shikha Sharma

(Project Guide) (Head of Department)

Poornima University
Plot No. 2027-2031, Ramchandrapura P.O.
VidhaniVatika Road, Sitapura, Jaipur,
Rajasthan- 303905 (India)
[Link]
 A
MAJOR PROJECT REPORT
on
Title
Submitted in partial fulfilment of the requirements for the award of the
Degree of

BACHELOR OF TECHNOLOGY

Poornima University, Jaipur (Academic Session: 2022–26)

Submitted By:

Dhaka Ravina Suresh

2022PUFCEBCEX12304
th
IV Year, Computer Engineering

Submitted To:

Department of Computer Science & Engineering

Faculty of Computer Science & Engineering, Poornima University

Ramchandrapura, Sitapura Ext., Jaipur, Rajasthan–303905

 Candidate’s Declaration

I hereby declare that the project entitled “Code Craft - SaaS Online
Code Editor Platform” is submitted by me in partial fulfillment of the
requirements for the award of Bachelor of Technology in Computer Science
and Engineering at Poornima University, Jaipur.
The work presented in this report is original and has not been submitted
for any other degree or diploma.

Date: Signature
Ravina Dhaka

1
 Certificate

This is to certify that the Major Project entitled “Code Craft - SaaS On-
line Code Editor Platform” submitted by Ravina Dhaka is a bonafide
work carried out under my supervision in partial fulfillment for the award of
Bachelor of Technology in Computer Science & Engineering.

Sakshi Sharma
(Project Guide)

Dr. Shikha Sharma

Head of Department

Dr. Ajay Khunteta

Dean

2
 Acknowledgement

I would like to express my sincere gratitude to my project guide for providing

valuable guidance and support throughout the project.
I would also like to thank the faculty members of the Department of
Computer Science & Engineering for their encouragement and suggestions.
Finally, I would like to thank my friends and family for their constant
support and motivation.

3
 Abstract

Code Craft is a cloud-based Software-as-a-Service (SaaS) online code editor

platform that allows developers to write, execute, and share code directly
from a web browser without installing any local development environment.
The platform supports multiple programming languages and integrates a
professional code editing experience using Monaco Editor. It enables users to
run code in real time through API-based execution services and provides fea-
tures such as syntax highlighting, theme customization, code snippet sharing,
and execution history tracking.
The system is developed using modern technologies such as [Link], Type-
Script, Convex backend services, and third-party APIs for code execution.
The platform also includes authentication and subscription features to dif-
ferentiate between free and premium users.
Overall, Code Craft provides an accessible and powerful development
environment that promotes learning, collaboration, and efficient software de-
velopment.

4
 Contents

1 Introduction 6
1.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
1.2 Problem Statement . . . . . . . . . . . . . . . . . . . . . . . . 6
1.3 Aims and Objectives . . . . . . . . . . . . . . . . . . . . . . . 7
1.4 Features . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
1.5 Future Scope . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

2 Project Plan 9
2.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
2.2 Duration of Training . . . . . . . . . . . . . . . . . . . . . . . 9
2.3 Workflow . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
2.4 Tools Used . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
2.5 Platform Used in Model Development . . . . . . . . . . . . . . 11
2.6 Libraries Used . . . . . . . . . . . . . . . . . . . . . . . . . . . 11

3 Working of the Project 12

3.1 Research and Requirements Gathering . . . . . . . . . . . . . 12
3.2 Initialization and Setup . . . . . . . . . . . . . . . . . . . . . . 12
3.3 Implementation . . . . . . . . . . . . . . . . . . . . . . . . . . 12

4 Conclusion 14

5 Future Work 15

6 References 16

5
 Chapter 1

Introduction

section

1.0 Introduction
In the modern era of software development, programming tools have
evolved significantly from traditional desktop-based compilers and editors
to cloud-based development environments. Developers increasingly require
flexible platforms that allow them to write, test, and execute code without
the need for installing complex software on local systems.
Online Integrated Development Environments (IDEs) provide an effec-
tive solution by allowing developers to access coding tools directly from a
web browser. These platforms eliminate the need for local setup and allow
developers to work from anywhere with internet connectivity.
The project Code Craft is a cloud-based Software-as-a-Service (SaaS)
platform designed to provide an online code editor capable of supporting
multiple programming languages. The platform allows users to write, edit,
and execute programs in real time while providing features such as syntax
highlighting, theme customization, and output display.
The primary goal of this system is to simplify the programming experience
by removing the need for installing compilers or development environments
on local machines.
section

6
1.0 Problem Statement
Traditional development environments require developers to install multiple
tools such as compilers, interpreters, libraries, and Integrated Development
Environments. This process often becomes complicated, especially for begin-
ners who are just starting to learn programming.
Some of the major challenges faced by developers include:

• Time-consuming installation and configuration of development tools

• Dependency conflicts between software packages

• Lack of portability across different systems

• Difficulty in sharing and collaborating on code

• Hardware limitations on local machines

These limitations highlight the need for a web-based platform that pro-
vides developers with a ready-to-use programming environment.
section

1.0 Aims and Objectives

The main aim of this project is to develop a web-based code editor platform
that enables developers to write and execute code directly in their browsers.
The major objectives of the project are:

• To design and develop a cloud-based coding environment

• To support multiple programming languages

• To provide a modern code editing interface

• To integrate real-time code execution capabilities

• To provide user authentication and data management

• To create a scalable and accessible system

section

7
1.0 Features
The Code Craft platform provides several useful features that improve the
coding experience for developers:

• Multi-language programming support

• Advanced code editing with syntax highlighting

• Real-time code compilation and execution

• Interactive output console

• User authentication and account management

• Code snippet storage and retrieval

• Responsive and user-friendly interface

section

1.0 Future Scope

Although the current version of Code Craft provides essential functionality
for coding and code execution, several enhancements can be implemented in
future versions.
Future improvements may include:

• Real-time collaborative coding between multiple users

• Integration of AI-based code suggestions

• Integration with Git repositories for version control

• Mobile application support

• Advanced debugging and code analysis tools

8
 Chapter 2

Project Plan

section

2.0 Introduction
The successful development of the Code Craft platform requires careful plan-
ning and systematic execution. This chapter explains the development pro-
cess, tools used, and workflow followed during the implementation of the
system.
section

2.0 Duration of Training

The development of the project was carried out during the final year major
project period. The project involved several stages including requirement
analysis, system design, development, testing, and deployment.
The approximate project timeline included:

• Requirement Analysis – 2 Weeks

• System Design – 2 Weeks

• Implementation – 6 Weeks

• Testing – 2 Weeks

• Documentation – 2 Weeks

9
 section

2.0 Workflow
The workflow of the project follows a structured development approach con-
sisting of the following stages:

1. Requirement Analysis

2. System Design

3. Development

4. Integration

5. Testing

6. Deployment

Each stage contributes to the successful completion of the project and

ensures that the system meets the required functionality.
section

2.0 Tools Used

Several modern development tools were used to build the Code Craft plat-
form.

• Visual Studio Code – Code editor used for development

• Git – Version control system

• [Link] – Runtime environment

• [Link] – Web application framework

• TypeScript – Programming language for type-safe development

section

10
2.0 Platform Used in Model Development
The platform was developed as a web-based application using modern fron-
tend and backend technologies.
The frontend was developed using React and [Link], which provide effi-
cient rendering and performance optimization features.
The backend services were implemented using Convex, which provides
serverless backend infrastructure and database management.
section

2.0 Libraries Used

Several external libraries were used to enhance the functionality of the plat-
form.
Monaco Editor
Monaco Editor is a powerful code editor developed by Microsoft. It pro-
vides features such as syntax highlighting, auto-completion, and error detec-
tion.
Clerk Authentication
Clerk provides secure authentication services that enable user login, reg-
istration, and session management.
Piston API
Piston API allows the execution of code in isolated environments. It
supports multiple programming languages and returns the output of executed
programs.

11
 Chapter 3

Working of the Project

section

3.0 Research and Requirements Gathering

The first phase of the project involved analyzing existing online coding plat-
forms and identifying the key features required for an efficient web-based
code editor.
Several platforms such as Replit, CodePen, and JSFiddle were studied to
understand how cloud-based code editors function.
The research phase helped identify the essential requirements for the Code
Craft system.
section

3.0 Initialization and Setup

The development process began by setting up the development environment.
[Link] and necessary development tools were installed. A [Link] project
was created as the base framework for the application.
The project structure was organized into frontend components, backend
services, and API integrations.
section

12
3.0 Implementation
The implementation phase involved developing various modules of the sys-
tem.
The user interface was designed using React components to provide a
clean and intuitive layout.
The Monaco Editor was integrated to provide a professional code editing
environment.
Authentication services were implemented using Clerk to ensure secure
user login and account management.
The code execution functionality was integrated using the Piston API,
allowing users to run programs in multiple programming languages.

13
 Chapter 4

Conclusion

The Code Craft project successfully demonstrates the development of a

cloud-based code editor platform that enables developers to write and ex-
ecute code directly from a web browser.
The system integrates modern web technologies such as [Link], Type-
Script, and Monaco Editor to provide a powerful coding environment. The
integration of code execution APIs allows users to test and run their programs
in real time.
The platform eliminates the need for installing development tools on local
systems and provides an accessible programming environment for students
and developers.
Overall, the project achieves its objective of simplifying the coding process
and improving accessibility to development tools.

14
 Chapter 5

Future Work

Although the current system provides core functionality, several improve-

ments can be made to enhance the platform.
Future enhancements may include:

• Real-time collaborative coding environment

• Integration with GitHub and version control systems

• AI-powered code assistance

• Support for additional programming languages

• Advanced debugging tools

• Offline coding capabilities

15
 Chapter 6

References

[1] T. Eisenman, “[Link]: The React Framework”, Vercel Documentation,

2023.
[2] Microsoft Corporation, “Monaco Editor Documentation”, Available:
[Link]
[3] Convex Inc., “Convex Backend Services Documentation”, Available:
[Link]
[4] Piston API Documentation, “Execute Code API”, Available: [Link]
[5] [Link] Foundation, “[Link] Official Documentation”, 2023.

16