Using Elm to Introduce Algebraic Thinking to K-8 Students

TL;DR

This paper explores using the functional programming language Elm to teach algebraic thinking and programming concepts to K-8 students through graphics, emphasizing declarative design and immediate feedback to enhance learning.

Contribution

It introduces a curriculum integrating Elm and GraphicSVG for K-8 students, demonstrating how declarative graphics support algebraic thinking and programming understanding.

Findings

Children connect graphics and math within the first hour.

Variables are introduced as a natural extension, accepted by students.

Advanced students learn state and interaction concepts easily.

Abstract

In recent years, there has been increasing interest in developing a Computer Science curriculum for K-8 students. However, there have been significant barriers to creating and deploying a Computer Science curriculum in many areas, including teacher time and the prioritization of other 21st-century skills. At McMaster University, we have developed both general computer literacy activities and specific programming activities. Integration of these activities is made easy as they each support existing curricular goals. In this paper, we focus on programming in the functional language Elm and the graphics library GraphicSVG. Elm is in the ML (Meta Language) family, with a lean syntax and easy inclusion of Domain Specific Languages. This allows children to start experimenting with GraphicSVG as a language for describing shape, and pick up the core Elm language as they grow in sophistication. Teachers see children making connections between computer graphics and mathematics within the first hour. Graphics are defined declaratively, and support aggregation and transformation, i.e., Algebra. Variables are not needed initially, but are introduced as a time-saving feature, which is immediately accepted. Since variables are declarative, they match students' expectations. Advanced students are also exposed to State by making programs that react to user taps or clicks. The syntax required to do so closely follows the theoretical concepts, making it easy for them to grasp. For each of these concepts, we explain how they fit into the presentations we make to students, like the 5200 children taught in 2016. Finally, we describe ongoing work on a touch-based Elm editor for iPad, which features (1) type highlighting (as opposed to syntax highlighting), (2) preservation of correct syntax and typing across transformations, (3) context information (e.g. displaying parameter names for GraphicSVG functions), and (4) immediate feedback (e.g. restarting animations after every program change).