- It is a clone of Leetcode Ide
Version-1.Leetcode-IDE.mp4
Understanding Folder Structure
-
There are two folders
clientfor frontendbackendfor backend. -
In
clientfolder:app.jsis the Home page or main page.componentsfolder have all the components :CodeEditor- The editor for writing codes [ Multiple themes/Language support]CodeInput- For taking user input same as in leetcode ideCodeOutput- For showing the result of the codeNavbar- It is the basic navbar above editor for providing features of Run Code and theme selection etc.
libfolder contains a filedefineTheme.jswhich is used to define a new theme for the editorboilerCodescontains the initial codes for all the languages in the editor
-
In
backendfolder:index.jsis the main file of execution.- A post request
/runis created using Express inside it which is the main request of this project. - It gets the
user-code,code-languageanduser-inputas request. - Then it creates two separate files one for code [like 'a.cpp','a.py','a.js'] and other file for input ['input.txt'] using
generateCodeFile.js - Now Node child process [ exec ] is used to compile the compiled language [cpp] or interpret the interpreted languages [py,js] using
executeCodeFile.js - Return the error or result as promise to frontend.
This was all about the folder structure and working of the files.
For Deploying the project
- As I was not getting any idea how to create a file on mongodb database and then compile that file.
- I researched a lot about it and then I found some online compiler api's that gives support to all languages.
- I will be implementing that in my project and then will deploy it.
