Table of Contents

Starter Packs in Codio

Nick Updated by Nick

What is a Starter Pack?

A starter pack is a fully-functional Codio unit and a quick starting point for course development. Each starter pack can be slightly or greatly different from the others. However, each starter pack usually shares certain things in common, like:

  • Pre-defined CSS rules under .guides/styles.css
    • Note: We can use @import lines of CSS code inside of styles.css that can pull in stylesheets from Amazon S3. The @import lines can be used for common used CSS rules used across multiple Codio unit.
  • A pre-defined layout. The layout consists of various panels (zero-indexed) that consist of the Codio Guide in one panel and may consist of other panels that can included coding files, static/dynamically preview-able HTML files, a Bash terminal or third-party applications.

Codio can have up to four panels and has the ability to show or hide the file tree as well as place the Codio Guide either to the left or the right. For most cases, we have the Codio Guide to the left. For Codio units using a third-party application like Jupyter Notebook, R Studio or OmniDB, we usually have the guide to the right, but also collapsed (to be toggled in the Settings area).

  • A pre-defined Codio top menu. We can choose to hide/show any of the options in the top Codio Menu by modifying the .codio-menu file under the /workspace directory.
  • Pre-defined settings. In the Codio backend, under Settings, there are a number of radio buttons to toggle certain feature on or off. In this same area, we can automatically run javascript files upon startup.
  • Fully set up filetree. All files published into the Starter Pack will be automatically accessible upon the creation of a new Codio Unit.
  • Guide Pages. There may be one or more Codio Guide Pages that appear upon the creation of a new Codio unit using a Starter Pack with example copy present.
  • Third party applications. Not all units will have third party applications by default, but Starter Packs allow us to have them present upon the creation of a new unit to expedite the development process.
  • Code Assessments. Not all units will have code assessments by default, but Starter Packs allow us to have them present upon the creation of a new unit to show, as an example, how the tests function and run.
When creating a starter pack, you can choose which version of the stack to use. For the starter packs in the sections below, the stack version has been set to Use the latest version, which means that the latest version of the stack will be used when you initially create a Codio unit with one of the starter packs. Once a Codio unit is created, you can change the stack in the Project > Stack > Settings... menu as you normally would.
Both the RStudio and JupyterLab Starter Packs rely on the same base Stack (Ubuntu 22.04 + JupyterLab + RStudio) and their difference is in their user-level configuration.

RStudio Starter Pack

Codio units created with the RStudio Starter Pack open an RStudio window using an open tab of "Preview" type with the RStudio Server URL https://{{domain8787}} in the Guide Layout configuration. When a student opens one of these Codio units, they should see an RStudio window with four panels, as described by the Using RStudio collapsed guide page (which students can expand by clicking the right sidebar). This description of the basic RStudio interface is configured in the Guide Settings using the .guides/load.js file shown in the Workspace Files section; specific configurations for Guide Layout and Guide Settings are shown in the Guide Configuration section. For information on how to make updates to the stack pertaining to the RStudio Starter Pack, see the Stack Updates for RStudio section below.

For more information on the RStudio Starter Pack, see Using the RStudio Starter Pack.
Workspace Files

This section explains how the Codio workspace files are set up. These are files located in the /home/codo/workspace (or simply ~/workspace) directory of Codio.

.codio

{
    // Preview button configuration
    "preview": {
        "RStudio": "https://{{domain8787}}"
    }
}

.codio-menu

{
    "Logo": false,
    "Codio": false,
    "Project": {
        "Restart Box...": true,
        "Resync File Tree": false,
        "Export as Zip": false,
        "Settings...": false,
        "Stack": false,
        "Permissions...": false,
        "Box Info": false,
        "Reset Box...": false,
        "Create Copy...": false,
        "Share...": false,
        "QR Code for Preview URL": false,
        "Delete...": false,
        "Exit": false
    },
    "File": false,
    "Edit": false,
    "Find": false,
    "View": false,
    "Tools": false,
    "Education": {
        "Mark as Completed": true,
        "Code Comments": false,
        "Earsketch": false,
        "Jupyter Lab": false
    },
    "Help": false,
    "Run": false,
    "Debugger": false,
    "Status": false,
    "Preview": false,
    "Toggle sections list": false,
    "Online": false
}

.guides/load.js

The line .guides/load.js must be in the Scripts text area under the Codio settings for the following line to be called.
$("#guide").load("https://ecornell.s3.amazonaws.com/Codio/Reuseables/RStudio/guideText.txt");

.guides/style.css

@import "https://s3.amazonaws.com/ecornell/Codio/CSS/styles.css";

Guide Configuration

This section describes how the Codio guide is set up.

Guide Editor

<img src="https://ecornell.s3.amazonaws.com/Codio/Reuseables/RStudio/quadrants.png" />

<div id="guide">

</div>

Guide Settings

For an ungraded RStudio Codio unit, make sure USE MARK AS COMPLETE is toggled off and HIDE MENU is toggled on:

Guide Settings for an ungraded Codio assignment using the RStudio Starter Pack

For a graded RStudio Codio unit, make sure USE MARK AS COMPLETE is toggled on and HIDE MENU is toggled off (this is the default with the starter pack):

Guide Settings for a graded Codio assignment using the RStudio Starter Pack

Guide Layout

For the Open Tabs, you will want to use the same URL to serve RStudio Server:

https://{{domain8787}}/

Guide Layout configuration for RStudio Starter Pack
Stack Updates for RStudio

The version of R is tied to the version of Ubuntu operating system, so upgrading the R version amounts to upgrading the Ubuntu version if there is a new long-term support (LTS) version of Ubuntu available. Upgrading the version of Ubuntu may or may not upgrade the version of R, depending on whether the the new version of Ubuntu comes with a new version of R.

When doing stack updates, make sure to use a GigaBox with plenty of RAM (e.g., 16GB) because some of the updates may take a really long time on a standard Codio box and may fail (in some cases) due to insufficient memory (standard Codio boxes only have 756MB of RAM as of April 12, 2024).

To update the Ubuntu operating system:

sudo apt update && sudo apt dist-upgrade

If updating Ubuntu also updates R in the process, reinstall RStudio using Codio's Tools > Install Software utility (available from the Codio menu while in Edit mode) — this will ensure that rstudio-server-codio.service is properly enabled and rstudio-server.service is disabled. Failing to do this may cause unexpected behavior, such as the RStudio Server login screen being presented to users when they load a Codio unit.

If R gets updated when you update Ubuntu, you may need to update or reinstall R packages using R commands in an R terminal. To start an R terminal, enter R at the ~/workspace$ prompt.

To update all R packages, run the following R command (this will take several minutes):

update.packages(ask = F, Ncpus = 4)

To maintain R compatibility with JupyterLab, make sure that the R packages IRkernel, languageserver, and repr are up-to-date by running the R command:

install.packages(c("IRkernel", "languageserver", "repr"))

After updating IRKernel, reinstall the R kernel in JupyterLab with the R command:

IRkernel::installspec()

JupyterLab Starter Pack

The JupyterLab Starter Pack uses the same stack as the RStudio Starter Pack, but its workspace files are configured for JupyterLab rather than RStudio. Since the stack has Julia, Python, and R installed, the JupyterLab Starter Pack can be used for projects in all three languages.

For more information on the JupyterLab Starter Pack, see Using the JupyterLab Starter Pack.
Workspace Files

This section explains how the Codio workspace files are set up. These are files located in the /home/codo/workspace (or simply ~/workspace) directory of Codio.

.codio

{
    // Preview button configuration
    "preview": {
        "JupyterLab": "https://{{domain3000}}/lab"
    }
}

.codio-menu

{
    "Logo": false,
    "Codio": false,
    "Project": {
        "Restart Box...": true,
        "Resync File Tree": false,
        "Export as Zip": false,
        "Settings...": false,
        "Stack": false,
        "Permissions...": false,
        "Box Info": false,
        "Reset Box...": false,
        "Create Copy...": false,
        "Share...": false,
        "QR Code for Preview URL": false,
        "Delete...": false,
        "Exit": false
    },
    "File": false,
    "Edit": false,
    "Find": false,
    "View": false,
    "Tools": false,
    "Education": {
        "Mark as Completed": true,
        "Code Comments": false,
        "Earsketch": false,
        "Jupyter Lab": false
    },
    "Help": false,
    "Run": false,
    "Debugger": false,
    "Status": false,
    "Preview": false,
    "Toggle sections list": false,
    "Online": false
}

.codio-jupyter

Add a .codio-jupyter file to ~/workspace when you want Codio to use nbgrader for assessment grading. It is possible to configure nbgrader using the .codio-jupyter file, but the configuration settings are limited. Instead, leave .codio-jupyter empty and add an nbgrader_config.py file to ~/workspace with fine-tuned configuration settings. For example, you can define custom pre-processors to control what students see on Codio's feedback form after an assignment is Marked as Completed.

nbgrader_config.py

Add an nbgrader_config.py file to ~/workspace to adjust the configuration settings for nbgrader. Here is one example of an nbgrader_config.py file with a custom pre-processor named ClearTracebacks that gives you the ability to hide or replace traceback messages in Codio's feedback form:

from nbgrader.preprocessors import NbGraderPreprocessor
class ClearTracebacks(NbGraderPreprocessor):
    '''
    Custom preprocessor that removes traceback messages
    (i.e., `output['traceback'] = []`) 
    or replaces traceback messages with another message 
    (i.e., `output['traceback'] = ['replacement_message']`).
    '''
    def preprocess_cell(self, cell, resources, cell_index):
        # Remove or replace traceback messages in graded cells
        if 'nbgrader' in cell.metadata and cell.metadata.nbgrader.grade == True:
            for output in cell.outputs:
                if 'traceback' in output:
                    output['traceback'] = ['Traceback messages have been hidden.']
        # Remove or replace traceback messages in solution cells
        if 'nbgrader' in cell.metadata and cell.metadata.nbgrader.solution == True:
            for output in cell.outputs:
                if 'traceback' in output:
                    output['traceback'] = ['Traceback messages have been hidden.']
        return cell, resources

# Initialize configuration
c = get_config()

# Configuration settings
c.ClearHiddenTests.begin_test_delimeter = "BEGIN HIDDEN TESTS"
c.ClearHiddenTests.end_test_delimeter = "END HIDDEN TESTS"
c.LockCells.lock_all_cells = False
c.LockCells.lock_grade_cells = True
c.LockCells.lock_readonly_cells = True
c.LockCells.lock_solution_cells = True
c.ExecutePreprocessor.interrupt_on_timeout = True
c.ExecutePreprocessor.timeout = 90
c.ClearSolutions.code_stub = {
    "julia": "# YOUR CODE HERE\nerror(\"Your code is missing.\")\n# END OF YOUR CODE",
    "python": "# YOUR CODE HERE\nraise NotImplementedError(\"Your code is missing.\")\n# END OF YOUR CODE",
    "R": "# YOUR CODE HERE\nstop(\"Your code is missing.\")\n# END OF YOUR CODE",
}

# Clear hidden tests and tracebacks from Codio's student feedback report;
# controls what students see after their assignments are Marked as Completed.
c.GenerateFeedback.preprocessors = [
    'nbgrader.preprocessors.GetGrades',
    'nbconvert.preprocessors.CSSHTMLHeaderPreprocessor',
    'nbgrader.preprocessors.ClearHiddenTests',
    ClearTracebacks,
]

.guides/load.js

The line .guides/load.js must be in the Scripts text area under the Codio settings for the following line to be called.
$("#guide").load("https://ecornell.s3.amazonaws.com/Codio/Reuseables/JupyterLab/JupyterLab_Guide.txt");

.guides/style.css

@import "https://s3.amazonaws.com/ecornell/Codio/CSS/styles.css";

Guide Configuration

This section describes how the Codio guide is set up.

Guide Editor

In the Guide Editor, put the following HTML code:

<div id="guide">

</div>

Guide Settings

For an ungraded JupyterLab Codio unit, make sure USE MARK AS COMPLETE is toggled off and HIDE MENU is toggled on:

Guide Settings for an ungraded Codio assignment using the JupyterLab Starter Pack

For a graded JupyterLab Codio unit, make sure USE MARK AS COMPLETE is toggled on and HIDE MENU is toggled off (this is the default with the starter pack):

Guide Layout configuration for graded Codio assignments using the JupyterLab Starter Pack

Guide Layout

Two-panel layout with notebook.ipynb as an open tab of Jupyter Lab type (panel 0):

Guide Layout for using Jupyter Notebooks in JupyterLab

Stack Updates for JupyterLab

In contrast to the RStudio starter pack, updating stack components for the JupyterLab starter pack do not require upgrading the Ubuntu operating system, although you may want to upgrade Ubuntu to the latest long-term support (LTS) version for potential performance enhancements.

When doing stack updates, make sure to use a GigaBox with plenty of RAM (e.g., 16Gb) because some of the updates may take a really long time on a standard Codio box and may fail (in some cases) due to insufficient memory (standard Codio boxes only have 756Mb of RAM as of April 12, 2024).

First upgrade the Python package manager pip to the latest version:

pip install --upgrade pip

To update jupyterlab, update the JupyterLab extensions jupyter-lsp, jupyterlab-lsp, and nbgrader at the same time:

pip install --upgrade jupyterlab jupyter-lsp jupyterlab-lsp nbgrader

To upgrade other JupyterLab extensions, first get information about them using

jupyter labextension list

If there are outdated JupyterLab extensions in the list, try updating them with

pip install --upgrade extension1 extension2 ...

To install/uninstall JupyterLab extensions:

pip install extension1 extension2 ...
pip uninstall extension1 extension2 ...

To enable/disable JupyterLab extensions:

jupyter labextension enable extension1 extension2 ...
jupyter labextension disable extension1 extension2 ...

eCornell Python Starter Pack

This starter pack is a basic starting point for Python development using Python 3.6.7. Is has a 3 panel layout with the guides left, a code file in the upper-right and a terminal in the lower right. PyTest is the framework used for automated testing.

  • Testing Framework: PyTest
    • The auto grader first runs .guides/test/runner1.sh. This file first ensure the student's code compiles. If it doesn't, an error is returned and the auto graded does not run. If the code does compile, the PyTest unit tests will run under the .guides/test/test1.py file.
  • Layout: A 3 panel layout with the guides left, a code file in the upper-right and a terminal in the lower right.
  • Stack Software: (To include):
    • Python 3.6.7
    • PyTest 5.2.1
    • geopandas 0.7.0
    • ipython 6.2.1
    • matplotlib 3.2.1
    • nbgrader 0.5.5
    • notebook 5.7.8
    • numpy 1.16.3
    • pandas 1.0.3
    • scikit-learn 0.22.2.post1
    • scipy 1.2.1
    • seaborn 0.10.0
    • tornado 6.0.2

Mocha/Selenium JS Auto Grading

This starter pack involved using Mocha, Selenium and NodeJs for front-end web development. It has a two-panel layout with the guides left with a code file and preview file to the right. A more in-depth article on this can be found here.

Ubuntu22 WebDev

This starter pack is a very generic starter pack using Ubuntu 22.04.2 LTS. This essentially is a bare-bones starting point for Codio units that need this version of Ubuntu.

  • Testing Framework: None
  • Layout: A 2 panel layout with the Codio guides left and an editable HTML file to the right
  • Stack: Ubuntu22 webdev
  • Stack Software: (To include):
    • Node v18.17.0
    • Ubuntu 22.04.2 LTS
    • Python 3.11.2
    • Flask 2.1.3
    • ipython 8.13.2
    • matplotlib 3.7.1
    • notebook 6.5.4
    • numpy 1.24.2
    • pandas 2.0.1
    • pytest 7.3.1
    • requests 2.30.0
    • scikit-learn 1.2.2
    • scipy 1.10.1
    • seaborn 0.12.2
    • tornado 6.3.2

How did we do?

Mocha/Selenium Autograding

Configuring Partial Point Autograders in Codio

Contact