# ANN: 🎓🏗️ Course website template based on Computational Thinking @ MIT

**URL:** <https://discourse.julialang.org/t/ann-course-website-template-based-on-computational-thinking-mit/137004>\
**Category:** Teaching & Outreach\
**Tags:** website, course, teaching, pluto, computationalthinkin\
**Created:** [May 6, 2026, 1:28pm UTC](https://discourse.julialang.org/t/ann-course-website-template-based-on-computational-thinking-mit/137004 "2026-05-06T13:28:12Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![fonsp](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/fonsp/32/222349_2.png) [@fonsp](https://discourse.julialang.org/u/fonsp)\
**Post date:** [May 6, 2026, 1:28pm UTC](https://discourse.julialang.org/t/ann-course-website-template-based-on-computational-thinking-mit/137004/1 "2026-05-06T13:28:12Z")

</div>

Are you using Julia to teach a course? The Pluto team would like to announce [`computational-thinking-template`](https://github.com/JuliaPluto/computational-thinking-template), a repository template for building **awesome looking course websites**! It features a sidebar, a colorful homepage, built-in search, GitHub Actions, “Edit this Page” links, run with Binder, and much more!

 ![image](https://global.discourse-cdn.com/julialang/original/3X/3/a/3a2d5072de8708adb873fb4965d2ca5535ee2673.png)

This template has **excellent integration with [Pluto.jl notebooks](https://plutojl.org)**. You can place notebooks in the repository, and they will automatically turn into course pages. You can use Pluto [frontmatter](https://plutojl.org/en/docs/frontmatter/) to set the title, description, chapter number and image of a lecture, and it will automatically show in the homepage, sidebar and on web search results.

## Based on Computational Thinking

This template is based on the successful online course [Computational Thinking at MIT](https://computationalthinking.mit.edu/). The technology behind this course is open source (developed by the Pluto team), and now available as a standalone template.

## Getting started

You start using the template by filling in your course details (name, teachers, university logo, theme color, etc). Then you add course material. You can write lectures in Markdown, HTML, or as Pluto notebooks. There is [documentation about writing lectures in Pluto](https://plutojl.org/en/docs/lectures/),

# Interactivity

Students learn by doing! This website is designed to engage students in the following ways:

- **Show the code** – all pages have a “View code” button that you can use to reveal the code behind any cell. [Example](https://computationalthinking.mit.edu/Fall24/data_science/random_walks/)
- **Run it yourself** – all pages have an “Edit or run” button that explains how to download and run this notebook yourself. You can also run notebooks directly online, using Binder. [Example](https://computationalthinking.mit.edu/Fall24/homework/hw3/)
- **Homework** – you can write your homework as Pluto notebooks, which gives students a reliable and interactive environment to work in. Packages will work without a fuss, and you can write exercise prompts that respond to students’ work. [Learn more about homework in Pluto](https://plutojl.org/en/docs/homework/)
- _(optional)_ **Sliders and buttons** – if you set up a Linux web server with PlutoSliderServer.jl, you can make all the PlutoUI.jl elements interactive on your website. [Learn more about PlutoSliderServer](https://plutojl.org/en/docs/plutosliderserver/)

# Other ways to export Pluto notebooks

This template adds a new option for publishing your Pluto notebooks online as web pages. `computational-thinking-template` is great if you want to make a complete website (with search, sidebar, homepage, etc), but there are also simpler options. Check out the complete overview on our documentation:

> **[📕 Notebooks online – Pluto.jl notebooks as web pages](https://plutojl.org/en/docs/notebooks-online/)**
>
> How to turn Pluto.jl Julia notebooks into web pages by hosting them on a website. How to make them interactive with PlutoSliderServer.

# Authors

This template is based on the course [Computational Thinking at MIT](https://computationalthinking.mit.edu/) by Alan Edelman, David Sanders, Shashi Gowda and others, where the technical/visual code was written by [me](https://github.com/fonsp) from the [Pluto.jl team](https://github.com/JuliaPluto). Later, [Luca Ferranti](https://github.com/lucaferranti) turned the course into a template format.

---

<div class="post-metadata">

**Author:** ![langestefan](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/langestefan/32/207923_2.png) [@langestefan](https://discourse.julialang.org/u/langestefan)\
**Post date:** [May 6, 2026, 2:12pm UTC](https://discourse.julialang.org/t/ann-course-website-template-based-on-computational-thinking-mit/137004/2 "2026-05-06T14:12:27Z")

</div>

Really cool, congrats. I will share it with my university colleagues.

> Note that this is a **static** webpage, so sliders will not work. Students will still be able to play with interactivity by downloading the notebook or running it on binder.

So I know this is a tough problem to solve and has been asked for many times, but people will compare this to to python where this technology is available.

edit: I missed [Precompute the pluto notebooks –&nbsp;OPTIONAL — Name of your course](https://juliapluto.github.io/computational-thinking-template/mod3_publish_website/precompute_output/) 🙂

---

<div class="post-metadata">

**Author:** ![fonsp](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/fonsp/32/222349_2.png) [@fonsp](https://discourse.julialang.org/u/fonsp)\
**Post date:** [May 6, 2026, 3:13pm UTC](https://discourse.julialang.org/t/ann-course-website-template-based-on-computational-thinking-mit/137004/3 "2026-05-06T15:13:00Z")

</div>

Yes! Julia needs WebAssembly support! Then we can bake it into any website automatically.

But indeed, right now you have the option to run a Linux server to make your sliders etc interactive. 🙂 It works really well!

---

<div class="post-metadata">

**Author:** ![Datseris](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/datseris/32/13406_2.png) [@Datseris](https://discourse.julialang.org/u/Datseris)\
**Post date:** [May 20, 2026, 8:51am UTC](https://discourse.julialang.org/t/ann-course-website-template-based-on-computational-thinking-mit/137004/4 "2026-05-20T08:51:36Z")

</div>

Thank you so much for sharing this, this definitely looks fantastic. I know for sure that I will be using this, if not relatively soon, for sure within the next 2-3 years!

> [@fonsp](#):
>
> Julia needs WebAssembly support!

Makie does have some amount of web assembly support: [WGLMakie | Makie](https://docs.makie.org/dev/explanations/backends/wglmakie) . Can you perhaps comment why this is not sufficient in this case?

---

<div class="post-metadata">

**Author:** ![j-fu](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/j-fu/32/11373_2.png) [@j-fu](https://discourse.julialang.org/u/j-fu)\
**Post date:** [May 20, 2026, 1:06pm UTC](https://discourse.julialang.org/t/ann-course-website-template-based-on-computational-thinking-mit/137004/5 "2026-05-20T13:06:42Z")

</div>

The issue is about being able to run the whole notebook in the browser. This could allow to run Pluto notebooks without any installation needs, making them even more accessible for entry level students and the like. Having parts of WGLMakie using web assembly is not sufficient for this.

In an [older post](https://discourse.julialang.org/t/jupyterlab-lite-and-status-of-julia-running-wasm/129957/3) I discussed this a bit more.

---

<div class="post-metadata">

**Author:** ![langestefan](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/langestefan/32/207923_2.png) [@langestefan](https://discourse.julialang.org/u/langestefan)\
**Post date:** [May 20, 2026, 1:32pm UTC](https://discourse.julialang.org/t/ann-course-website-template-based-on-computational-thinking-mit/137004/6 "2026-05-20T13:32:59Z")

</div>

Why was the Binaryen approach from WebAssemblyCompiler.jl abandoned? That seems awesome?

---

<div class="post-metadata">

**Author:** ![langestefan](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/langestefan/32/207923_2.png) [@langestefan](https://discourse.julialang.org/u/langestefan)\
**Post date:** [June 22, 2026, 8:58am UTC](https://discourse.julialang.org/t/ann-course-website-template-based-on-computational-thinking-mit/137004/7 "2026-06-22T08:58:33Z")

</div>

I was looking through [GitHub - bmlip/course: 5SSD0 Bayesian Machine Learning & Information Processing · GitHub](https://github.com/bmlip/course) again and was expecting to see the template in use. Any plans for that? 🙂

---

<div class="post-metadata">

**Author:** ![fonsp](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/fonsp/32/222349_2.png) [@fonsp](https://discourse.julialang.org/u/fonsp)\
**Post date:** [June 23, 2026, 9:55am UTC](https://discourse.julialang.org/t/ann-course-website-template-based-on-computational-thinking-mit/137004/8 "2026-06-23T09:55:35Z")

</div>

Hey! We didn’t use it, to make the site easier to maintain by everyone in the teaching team 🙂 My colleagues already had to learn Pluto, so I just used the basic [static export template](https://github.com/JuliaPluto/static-export-template) to limit how many new skills / technologies were needed. I found it more important that we share ownership of the site, than that the site looks cool and colorful ⭐

But I’m working with this course one more year, so maybe this year we will do it! I’m also working on “multiplayer” data visualisations this year, where students attending the lecture can control data points live from their phone, and see a Julia viz update on the screen.
