explaingit

ronreiter/interactive-tutorials

4,698PythonAudience · writerComplexity · 3/5Setup · moderate

TLDR

Source code for 13 free beginner coding tutorial websites, learnpython.org, learn-js.org, and others, where visitors read short lessons and run code directly in the browser without installing anything.

Mindmap

mindmap
  root((interactive-tutorials))
    What it does
      Browser-based coding
      No install needed
      13 language sites
    Languages covered
      Python
      JavaScript
      Go
      Rust and more
    Architecture
      Markdown tutorials
      IDEOne API execution
      Domain-based routing
    Contributing
      Write Markdown
      Pull request
      Docker local setup
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Contribute new tutorials or exercises for any of the 13 supported programming languages by writing Markdown files and submitting a pull request.

USE CASE 2

Run a local copy of one of the tutorial sites using Docker to preview and test your changes before submitting.

USE CASE 3

Fork the project to create your own interactive coding tutorial site for a programming language or topic not yet covered.

Tech stack

PythonMarkdownDocker

Getting it running

Difficulty · moderate Time to first run · 30min

Requires IDEOne API credentials to enable in-browser code execution, Docker simplifies local setup.

In plain English

This repository is the source code behind a family of free websites where beginners can learn programming languages by writing and running code directly in the browser. Each site covers one language. The collection includes learnpython.org, learnjavaonline.org, learn-js.org, learn-c.org, learn-cpp.org, learn-php.org, learnshell.org, learn-perl.org, learnrubyonline.org, learn-golang.org, learnrust.org, learncs.org, and learn-html.org. The core design is that visitors read a short lesson and then type or modify code in an embedded editor on the same page, running it without installing anything on their own computer. Code execution is handled through an external API called IDEOne, which means the code runs on a remote server and sends the result back to the page. Credentials for that service are needed to make execution work in a local development copy. The tutorials and exercises are stored as Markdown files, a plain-text format that is easy to read and edit. When someone visits one of the sites, the server loads all the Markdown files into memory and serves them as pages. The domain name determines which language site is displayed, and a single shared codebase runs all of them. Changing which site runs locally is done by setting an environment variable before starting the server. The project invites contributions. Anyone can write new tutorials or exercises and submit them via pull request. The setup supports running a local copy with Docker or without it, and the README covers both paths briefly. The project is supported by DigitalOcean. A number of individual contributors are credited in the repository.

Copy-paste prompts

Prompt 1
I want to contribute a new Python tutorial to learnpython.org that covers list comprehensions. Show me the Markdown format and folder structure I need to follow in the interactive-tutorials repo.
Prompt 2
Walk me through setting up a local development copy of the interactive-tutorials project using Docker so I can preview my changes to learn-js.org.
Prompt 3
I want to add a new language tutorial site to the interactive-tutorials codebase. What environment variable controls which language site is served, and what other changes are needed to add a new language?
Prompt 4
Show me how the interactive-tutorials server loads Markdown tutorial files into memory at startup and converts them to HTML pages when a visitor requests a lesson.
Open on GitHub → Explain another repo

← ronreiter on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.