Container Architecture lab types are in general release. Please contact support@vocareum.com to set up a compatible course.

Creating a VS Code Lab

From the course page select "Edit Assignments" and "New Assignment"

Create a name for the assignment and save.

Create a part for the new assignment. Selecting "+" under Parts.

Give the part a name and click Save Part. Set your lab type to VSCode and click Save Part again.

Remember to always Save Part after naming and before making any further changes to your lab

Configure Workspace and File System

Now that your VS Code lab is created select Configure Workspace to launch the VS Code IDE

On the left side of your VS Code IDE is the file tree. Here is a list of all directories that are created by the platform -

  • /voc/course - common to the entire course and not visible to learners

  • /voc/public - lab level directory which is visible to the learner

  • /voc/docs - README.md should go here

  • /voc/private - this is a directory for storing lab level resources not visible to the learners

  • /voc/public - lab level directory which is visible to the learner

  • /voc/scripts/grade.sh - store grading scripts here as grade.sh

  • /voc/startercode - store all the content here which is copied to the /home/labsuser directory for the learner

  • /home/labsuser - used for creating quiz.md before running "Generate Quiz" operation. This directory can also be used to develop and test startercode, scripts, etc.

Populating learner workarea

Navigate to /voc/statercode. This is where instructors will upload assignment materials to be populated in learners' environments.

To upload a file or folder, right-click on the startercode directory, select Upload, and choose a file.

Once an instructor has compiled their assignment materials in /voc/startercode click Update to make the work available to learners once the assignment is published.

Custom Workspace

If an instructor wants to initialize custom workspace settings for all learners, add a settings.json file to to the startercode under: /voc/startercode/.local/share/code-server/User and select "Update"

Autograding

Instructions to setup Autograding for VS Code can be found here

Extensions

Our VS Code environment comes with some global extensions preinstalled:

  • Python language support

  • Java language support

  • Clang (C/C++)

  • C# language support

  • ESLint (Javascript)

  • HTML & CSS language support

Installing Extensions Globally

Visit the Open VSX Registry (https://open-vsx.org/) for extensions compatible with the VS Code Lab.

Download the .vsix file of the extension you want to install from Open VSX Registry and upload it to the work area.

Run the following command in the terminal:

sudo /usr/local/vocareum/scripts/vocinstall.sh <path-to-extension>

Wait for success message in terminal then select Save Image.

Choose a name for the new container image and Save.

Return to the Part settings, adjust the Lab Type to the newly created image and select 'Save Part'.

The extension is now available for all learners.

MySQL Database

Our VS Code container features MySQL database allowing connection to an http server for full stack web app development.

In the Part settings select the lab type to use (currently only Visual Studio Code and Terminal lab types are supported). Under Lab Resources make sure to select "Database" and "MySQL DB".

Accessing the Database

To access the MYSQL client, simply type "mysql" into the command line.

Alternatively, to use VS Code’s MySQL extension start by clicking the Database icon on the left side bar of the VS Code environment.

Click on “Create Connection,” specify a name for the connection, and then save and connect to the server.

Did this answer your question?