A Web-Based IDE for Teaching with Any Language 2017

Slide 1

Slide 1 text

A Web-Based IDE for Teaching with Any Language Dan Armendariz David J. Malan Nikolai Onken SIGCSE 2017

Slide 2

Slide 2 text

Slides cs50.ly/sigcse-2017

Slide 3

Slide 3 text

Agenda 1. Introductions 2. Background 3. Motivation 4. Tour a. Introduction to the Cloud9 IDE b. Tour of its features 5. Assignments a. Adapting and writing assignments b. Limitations and technical considerations 6. Developing customizations a. Architecture overview b. Plugin API, documentation, examples

Slide 4

Slide 4 text

Background 1. On-Campus Cluster 2. Off-Campus Cloud 3. On-Campus Cloud 4. Client-Side Appliance 5. Server-Side Container

Slide 5

Slide 5 text

Alternatives ● Code::Blocks ● Codio ● CS50 Appliance ● Eclipse ● Koding ● NetBeans ● Visual Studio ● Vocareum ● ...

Slide 6

Slide 6 text

Deciding Factors ● Code editor ● File browser ● Terminal window ● Plugin model

Slide 7

Slide 7 text

Motivation ● Standardize students' environment ● Reduce technical difficulties ● Reduce annual time sinks ● Eliminate need for administrative privileges (in labs) ● Develop pedagogical tools

Slide 8

Slide 8 text

Tour ● Visit http://bit.ly/sigcse-2017-c9 ● Create a workspace ○ Select Harvard's CS50. ○ Run `update50` in terminal ● Overall layout of the GUI ● Less-Comfortable Mode ● Writing source code ● Compiling programs ● Debugging ● Using the terminal ● Collaboration options ● Revision history ● Using Cloud9 offline ● Experimental features

Slide 9

Slide 9 text

Break

Slide 10

Slide 10 text

Assignments Adapting and writing assignments for Cloud9 ● Limitations ● Deploying assignments ● Cloning workspaces ● Technical considerations for web-based assignments

Slide 11

Slide 11 text

SPL github.com/cs50/spl

Slide 12

Slide 12 text

Emscripten kripken.github.io/emscripten-site/

Slide 13

Slide 13 text

Web Assembly webassembly.org/

Slide 14

Slide 14 text

Tools ● debug50 ● help50 ● style50 ● submit50

Slide 15

Slide 15 text

Customizing Cloud9 API ● Developing Custom Plugins ● Customization capability ● Architecture overview ● Runners ● Documentation ● Developer mode ● Custom package repository

Slide 16

Slide 16 text

Cloud9: GUI made entirely of plugins

Slide 17

Slide 17 text

Developer Hub Documentation on development and many plugins cloud9-sdk.readme.io

Slide 18

Slide 18 text

Sample Plugins github.com/danallan/sigcse-c9-workshop Or clone danallan/sigcse workspace

Slide 19

Slide 19 text

Architecture Overview CDN Workspace Instance

Slide 20

Slide 20 text

Developer Mode Append to your workspace URL https://ide.c9.io/USER/WORKSPACE ?debug=2 https://ide.c9.io/USER/WORKSPACE ?debug=2&reset=1

Slide 21

Slide 21 text

Core SDK Great for offline, or Pull Requests for fixes github.com/c9/core

Slide 22

Slide 22 text

Education Plan c9.io/team/new?plan=School

Slide 23

Slide 23 text

Offline manual.cs50.net/cs50-ide/offline.html

Slide 24

Slide 24 text

Questions

Slide 25

Slide 25 text

Evaluation Form

Slide 26

Slide 26 text

A Web-Based IDE for Teaching with Any Language Dan Armendariz David J. Malan Nikolai Onken SIGCSE 2017