Codio Interface

YouTube Video

Now that you’ve seen a few pages in Codio, let’s take a minute to discuss some of the features of the Codio user interface. Of course, Codio has some amazing documentation, so feel free to check that out as you work with Codio.

First, let’s look at the menu items at the top of the page. There are several available to you that are worth mentioning. For starters, you can click the Codio Icon at any time to go directly to your Codio dashboard. The first item on the Codio menu will take you directly here as well. There you can see all of the projects attached to your account, and create new projects at any time. However, you won’t see the projects attached to the course here, since they must be accessed directly through Canvas.

Under the Codio menu, you can also find options to manage your preferences. Here you can adjust things such as the editor settings and theme. Feel free to adjust the settings to match your personal preferences.

The Project menu allows you to work with the currently loaded Codio project. Generally you won’t need to access many of these items unless your project stops working. However, they are provided for your use in case you need them.

The File menu contains options for manipulating the file tree, such as creating new files, renaming them, saving them, and even downloading and uploading files. As you work on larger projects, you’ll be using many of these options to manage the files within your project.

Next, the Edit menu gives you access to the Undo and Redo action. Since Codio is a web-based platform, you’ll need to get used to using keyboard shortcuts to handle the Copy and Paste actions. For most systems, you can use CTRL+C for copy and CTRL+V for paste. On Mac, use CMD+C and CMD+V instead.

The Find menu contains entries for searching documents and performing a find-and-replace operation. Most of those actions should be pretty self-explanatory.

The View menu allows you to customize your view in Codio. Here we’ll find options for managing panels, open tabs, editor settings, and more. Feel free to make use of these options to arrange your Codio view as you prefer. Also, at the bottom of this menu is a Play Guide option, which is very helpful if you accidentally close the guide and need to reopen it.

Under the Tools menu, you’ll find an option for accessing the Terminal in your project. The Terminal gives you console access to the box that your project is running on, and allows you to install software and configure it as needed. As you work through the content in this program, we’ll slowly introduce the Terminal and some of the tasks it can perform. In addition, the Tools menu has options for working with SSH and Git, two more tools which will be introduced in later modules. Lastly, it also has an entry for the Command Bar, which is a quick shortcut to the full list of commands that can be performed in Codio. Feel free to check it out if you are looking for a particular command or action.

The Education menu is very important, though it only has a single entry. The Mark as Completed option allows you to indicate that you have completed this Codio project or tutorial. Once you select that option, your work will automatically be graded and your grade will be sent to Canvas. From there, you can access the next project or module in the course.

Finally, the Help menu gives you access to many of the support features in Codio. If you get stuck, you may want to review some of the help options available here. Of course, you can always post a message in the course help forum or email for assistance!

There are also a few other items in the interface you should be aware of. First, in the File Tree, there is a Play icon that can also be used to open the guide for the current project.

In the guide, there are a couple of options available by clicking the gear icon in the upper-right of the page. First, there is an option to Restore Current Files. This option will restore the contents of any currently open files back to the default contents from when you first opened the project. In addition, this menu also contains another way to mark the current project as completed.

That covers most of the major features of the Codio interface that we’ll be using in this course. If you have any questions about how to use Codio, feel free to contact the course instructors for assistance.