Create Your Own Code Editor With Syntax Highlighting using HTML, CSS & JavaScript

In this video, I will show you how you can create your own live code editor with syntax highlighting feature using HTML, CSS & JavaScript. I have used codemirror library to add syntax highlighting feature. You can create code editor like codepen, jsfiddle etc. This will be web based code editor where you can code HTML, CSS & JavaScript.

[kevinurielfonseca]

Thanks for this!! This is exactly what I had on mind to create but just did not have a good starting point!.

[semicolon]

can you do a java version of this please?

[divyangiherbals]

Hello I saw it and worked on that also but I couldnt do it so can you just share the full code in the comment section or in the description so I can just confirm?

[averagestudent]

if i copy paste the code it shows the different out put which does not matches with the code editor u have shown in the video

[ReckletGaming]

Can you add Undo Redo, Autocomplete and paste option. It may help me alot

[vmars]

*
I have tried many other promising / videos and THEY DONT WORK .
is there a web page (or source code) that shows it actually works ?
Thanks
*

[cristoferk]

Cool videos! I am making programming tutorials too! 😀

[rayvongregory]

Thanks for the tutorial!
I'm having an issue whenever I try updating my JS. It throws a "redeclaration of let/const" error. Is there a way around this?

[sounak]

"CodeMirror is not defined"
Showing this error in code.js file

[chaithanyakatari]

it would be better if you provide the source code.

[anaymittal]

If you have over 20 lines, it streches over the other editors and it doesnt work. How can i fix this?

[touchthetech]

this is'nt working?
i am not able to write anycode in the editor.

[_.GUTS_]

i dont get that text area it simply shows that box i cant type in it plz help me

[carlonnrivers]

Why do you write it as "<scri"+"pt>" and not "<script>"?

[web-made-easy]

I need source code. Could you please provide me the link.

[wondersky]

How to use codemirror others option like full-screen, hint, draggable columns, and auto close tags.

[catcodedbeginner]

IDK why some web developers use contemtWindow or contentDocument? Why they don't use srcdoc for make it more simple?.

[rupasarfare]

Hello can you please put the source code

[web-made-easy]

Thank You CodingFlag! I needed this for my site. I just subscribed to your channel.

[zero-fcol]

how did that div made into an editable div like textarea?