Every time we write code we learn something new.
How to optimize a compute-heavy function
A new algorithm for a machine learning model
How to center a div
As we build, we’re constantly learning and adding new knowledge, even when we’re not explicitly trying to. At GitHub Next, we want to make that learning process faster, easier, and more fun!
Introducing Learning Sandbox
Learning Sandbox can spin up a personalized learning environment, tailored to any scenario. It generates an interactive sandbox, breaking down complex topics and walking you through them step by step. All of this content is tailored to your personal experience levels and specific needs, helping you with building your mental model while allowing you to make progress on your specific task.
Let’s say you’re creating a website using Svelte and want to surprise your users with a fun cursor effect. Let’s spin up a sandbox to explore!
On the homepage, you can see a list of all the sandboxes you’ve created. Let’s create a new one!
Whew, that was a whirlwind tour of the basic interface! There are many other fun features, but let’s talk about the underlying principles behind Learning Sandbox. These are our North Stars, guiding the project to make sure it’s maximally useful.
Learn by doing
An environment that supports constructive trial and error
Most materials that demonstrate concepts to developers are static and read-only. Developers often manipulate their current development environment to support better debugging as they implement new things they learn. To cement developers’ understanding of new concepts, what’s needed is a combination of hands-on practice, dynamic update of content, and a tight feedback loop.
Learning Sandbox provides an environment that is interactive – developers can play with code and see changes right away. The sandbox lowers the cost of iteration so developers quickly test out new concepts and their understanding, invalidate wrong mental models, and try many things out. The auto-generated content in Learning Sandbox is also dynamic, and updates as developers ask questions. If the user runs into an error as they experiment with their code, Learning Sandbox can help them fix it.
Learn as you go
Content that matches the developer’s scope and task
Developers most often learn new things as they perform everyday work. Today they use ad hoc approaches by cobbling together understandings from a variety of sources. They might conduct searches, consult documentation, and ask questions of their colleagues, including virtual colleagues like ChatGPT. Not only is the experience fragmented, but developers need to spend extra cognitive effort to figure out how those scattered understandings can be applied to their own task.
By kicking off a session in Learning Sandbox from a user-provided statement, the AI-generated explanations and examples are customized to their topic and their particular task. In addition, all the content is bite-sized and skippable, giving the user full control of the start, end, and depth of their learning.
Tailored to you
A bespoke path to understanding new concepts
Tutorials, documentation, and other explanation materials target a general user profile and set of use cases. What’s more, there is a noticeable lack of materials and content around advanced programming topics, to serve the needs of seasoned developers.
With Learning Sandbox we are leveraging LLMs to generate content tailored to the individual developer. At the start of the session the developer prompts Learning Sandbox with their description of what they are looking for, as well as their level of knowledge of languages, frameworks, packages etc. In addition the developer can have new concepts presented and explained to them in terms of concepts that they already know and understand.
Onward!
When you work towards a specific goal, you don’t necessarily need a comprehensive tour of a topic, but you need to rapidly absorb the concepts that are going to be relevant to your task – you want to see how concepts can be applied to your situation.
Developers today are stuck between a glut of semi-related examples on the internet, and contrived, isolated “hello world” tutorials that don’t offer enough guidance to help with real tasks. Our ultimate goal with Learning Sandbox is to simplify how developers learn new concepts, empowering them to grow their skills in a way that suits the tasks that they want to accomplish.
Want to see more examples? Here are a few fun ones:
Select text in codemirror
Animate letters in individually in react