Web Module

How to use the HTML/CSS/JS editor with live preview

1

Open a web assignment

The editor is loading after you've opened your web assignment. You'll see "Loading editor..." in the center of the screen while CodeDesk prepares your coding workspace. Once loading is complete, you'll be able to start writing and editing your code.

Open a web assignment
2

Switch between files

You can see multiple files listed in the left sidebar (index.html, script.js, and style.css) with index.html currently selected and highlighted. Click on any file name in the sidebar to switch between your different code files and edit them. The currently active file will be highlighted in blue, and its contents will display in the main code editor.

Switch between files
3

Live preview updates automatically

As you type and edit your HTML code on the left, the preview on the right automatically updates to show your changes in real-time. You don't need to manually refresh or save your file to see how your webpage looks - CodeDesk instantly displays the results of your code modifications.

Live preview updates automatically
4

Submit your web project

Submit your web project