Live websites on Khan Academy.



Oh noes won't bother you if you code at KhanHub. You can now enjoy life without him.

Keep your cool while coding with an in-browser and a live website preview

Customize your coding experience with different editor themes.

Why I made this

To me, Khan Academy has a very small coding environment. Limited functionality, very tiny previews, and all those other sad things.

My goal, ever since I became an HTML/CSS/JS guy was to expand KA's coding platform and give everyone the BEST coding experience ever while still following the guidelines.

On the beginning of October, I made a project that used Local Storage, a long-believed disallowed functionality, but then Evan Lewis told me and said the Entire Khan Academy could use it. I was really excited that I impacted the whole Khan Academy, but in a small way. I want to make a bigger impact this time and give everyone the top coding experience and also, I want to share my knowledge with all of you.

I hope you enjoy my project and make it part of your coding life. Happy Coding.


User Guide

Using the Editor

The editor is very simillar to the Khan Academy HTML editor but it has some differences. To check it out, create a project in the Projects section.

Why isn't my work showing in the in-browser preview?

The reason why it isn't showing is because for this editor, you will have to press the Reload button for it to work. If you don't press it, the program won't run.

How do I Live Preview my website?

Add a bit of code in the editor, and when you're satisfied with it, press the Live Preview button. You can then see your website live.

Why can I only make five projects?

Evan Lewis said that if using Local Storage, massive ammounts of data cannot be stored. That's why you have a limit of five projects only.

How do I deploy my live website to KA?

The instructions are a little complicated here, so read carefully.

1. After you have finished coding up your site, press the Deploy button. A popup window should show.
2. Follow the instructions of copying the code and pasting it into a KA webpage. Don't forget to save it!
3. If someone goes to your webpage and clicks the screen, they will see the live website. You can modify the code to have a descriptive screenshot. That will not be explained in this tutorial.
3.5. Don't try to display your live website on document load because your computer and/or the other user's computer will block it. It has to be done on mouse click or key press.

If you have any questions, please ask me.

Happy Coding. -LeviathanProgramming

Choose Theme

Copy all the code and paste it into a KA webpage


All code from this website is owned by LeviathanProgramming. If any of this work is copied and used without permission of the original creator, the person who copies it will be reported to the Khan Academy Guardians, possibly inflicting a Ban on their own account. If any one person wants to use some of this work for their own, they must ask the creator first and also write the line of code below in their project if he approves of it:

<!--This code was originally made by @LeviathanProgramming at Khan Academy. kaid_1111587369709668626687999-->

Please follow these rules carefully. Happy Coding.

+New Project
-Delete Project