Codelearn is online application which can help you learn to code. After registration you'll have access to LearnGround and PlayGround. Former contains different lectures and excercises about programming topics, later is here for you just to play with code and test it in your browser. In PlayGround you can save your projects and then share them or just load them later and do some changes. LearnGround saves your progress and code you wrote as an excercise for every lecture, so you can change or just check it later.
- HTML (beta)
- CSS (in progress)
- Colors
- Selectors
- Positioning
- Backgrounds
- Typography
- Flexbox
- Animation
- Media Queries
- Pseudo Classes
- Pseudo Elements
- Margins, Paddings, Borders
- Javascript (next in line)
To HTML editor lives inside of <body> tag, so it's better to avoid using <!DOCTYPE>, <html> and <head> elements.
Learn Ground is place where you'll learn to code. It consists of 3 parts and you can change width of left and right size by dragging handle bar.
On the left side you have 3 tabs for writting HTML, CSS and Javascript
On the right side you have 3 tabs prepare - Theoretical part of lesson exercise - Practical part of lesson with hidden solution see - Rendered result of your code
All the important buttons have their place in navbar Lessons - opens the sidebar with list of lessons Completed - marks your lesson as completed Incomplete - if you marked the lesson as completed, but you find out, it is not. Run - runs your code, changes right side tab to 'see', saves your code. Logout - destroys your current session
It is place to try the things you learn, or just try whatever is on your mind and practise. You can save your code if you made something worth it.
In contrast to Learn Ground, there are no tabs, but 3 areas above each other for HTML, CSS and JS which you can resize as you wish.
There is your result page
Save - Opens modal to save project Fork - Create copy of this project New - Create new project Delete - Removes project, irreversable action Projects - Opens modal with projects you saved Download - Downloads zipped archive with your project (in progress) FullScreen - Opens your last saved version of a project in a new screen (in progress) Run - runs your code. Logout - destroys your session
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent