Skip to content

AbdullahButt2611/Code_Editor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Code Editor

Web Application



The "Code Editor" repository contains code for a web application that allows users to write, edit, and test code in real-time. The application is similar to popular code editors like CodePen and JSFiddle, and offers a range of features for developers and designers alike.

The code in the repository is written primarily in HTML, CSS, and JavaScript, and uses a range of front-end tools and libraries to provide a rich and responsive user interface. Some of the tools and libraries used include jQuery, Ace Editor, and Bootstrap.

Overall, the "Code Editor" repository offers a valuable resource for developers and designers who want to build their own web-based code editors, and provides a range of features and tools to support code editing, sharing, and collaboration.



Features


Following are some of the new features and learning encountered while creating this amazing project:
  • Real-time code editing and previewing:
    Users can write and edit code in the editor pane and see the changes reflected in real-time in the preview pane.
  • Multiple language support:
    The code editor supports multiple programming languages, including HTML, CSS, JavaScript, and more.
  • Code highlighting and auto-completion:
    The editor includes syntax highlighting and auto-completion for common programming constructs, making it easier for users to write code quickly and accurately.
  • Code sharing and collaboration:
    Users can share their code with others and collaborate on projects in real-time.
  • User-friendly interface:
    The interface is designed to be intuitive and user-friendly, with clear labeling and easy-to-use controls.
  • Customizable layout:
    Users can customize the layout of the editor pane and preview pane to suit their preferences.
  • Error highlighting and debugging:
    The editor highlights syntax errors and other issues in the code, making it easier for users to identify and fix problems.
  • Responsive design:
    The editor is designed to be responsive and mobile-friendly, allowing users to edit and test code on a range of devices.
  • Code history and revision control:
    The editor includes features for tracking code revisions and history, allowing users to revert to previous versions of their code if necessary.
  • Integration with external libraries and APIs:
    The editor can be integrated with external libraries and APIs to provide additional functionality and features.
  • Potential for customization and expansion:
    The code editor can be customized and expanded with additional functionality to meet the specific needs of users and projects.



Resources


Follwing resources have been used in maintaining this project:



Demo

The Demo of this working project can be found on
rebrand.ly/CodeEditor_MABCORP



Video

You can exclusively watch the video on this project from the making to deploying on my channel with the link given below

Video Link

If you like my video then do Like the Video and share it with others.



Application Interface

GUI for this Project



Technology Stack


Follwing technologies have been used at the core of this application to make it stand in the market place:
  • HTML
  • CSS
  • JavaScript



Advancement

Not Recommended Yet



Deployment Details

The website is deployed using the free hosting provided by Vercel



Later on the link was customized using the well-known URL shortener and customizer **Rebrandly**:



Developer

Muhammad Abdullah Butt
abdullahbutt12292210@gmail.com

Instagram
FaceBook
YouTube
Portfolio
Project Displayer

About

The "Code Editor" repository contains code for a web application that allows users to write, edit, and test code in real-time.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published