# A Free P5 Python Online Editor with Live Edit | Designed For Teachers and Students Learning to Code | Strive Editor Alpha

https://code.strivemath.com/ is a free-to-use online code editor for writing p5 code in Python. It comes with built-in live edit features (No login is needed to use Live Edit) and many functions to help teachers explain coding concepts.

Note: This is a very early Alpha version of the Strive Editor; we’re releasing this as proof of concept and to get feedback from the community. So don’t be surprised if you get some strange, unexpected errors.

## Functions to help teachers explain coding concepts

We have a whole library of utility functions we’re developing at GitHub - StriveMath/p5.teach.js: p5.teach.js is a library for p5.js developed by Strive to aid in teaching coding Some of these include

• Flexibility with the handedness of the coordinate systems in 2D and 3D.
• Grids in 2D and 3D `drawTickAxes()` and `draw3DAxes()`
• `crosshair()` tool to locate the mouse easily
• `die()` draws a single die that displays a number 1-6
• `responsiveText()` draws text positioned upwards and rightwards independent of rotation and scale.
• `drawVector()` draws a vector from a point with optional dash rendering.
• `createMovableCircle()` ****creates a circle that users can drag about the canvas with their mouse.
• `drawBarGraph()` draws a simple bar graph given an Array of data.
• Time-developing functions to go back and forth between two values, either sinusoidal oscillation with `wave()` or triangular oscillation with `bounce()`

## Highly detailed kid-friendly docs

See https://learnpython.strivemath.com/ for more.

For the most common p5 commands, we’ve made highly detailed and visual docs to help students learn the basics and find help on their questions.

We have a few ideas that we’re planning on working on in the future and would love to hear from you about which of these features would be the most useful.

• Block-based coding with live edit.
• Developing tons of free educational content that could either support teachers or be used by students independently. See this video as an example: https://youtu.be/PdQyJ5v_EyM
• Support for lesson plans and notes in the editor.
• AI code assistant/tutor.
• Classroom management tools for managing multiple students.
• Coding portfolios

With code.strivemath.com, we’ve launched p5-python-web (run p5 python in the browser and p5.teach.js (utility functions to help teachers). See this forum post for more information

## Feedback?

13 Likes

Feature request: Switch between JavaScript and Python would love to have live edit for vanilla p5js

4 Likes

@Tammy thats definitely on the roadmap!

2 Likes

Great Efforts into enhancing the tools available for Math teachers.

1 Like

Can you import other Python libraries like numpy or matplotlib?

1 Like

Great progress y’all! I have one suggestion. p5.teach.js is a library that @two.ticks developed during GSoC a couple of years ago. The name collision seems avoidable–maybe go with p5.learn.js or something specific to math education?

@georgefernandez we haven’t tested it in the editor yet, but Skulpt does have support for these libraries and there are a few community projects building on these: GitHub - ebertmi/skulpt_matplotlib: Partial matplotlib pyplot implementation for skulpt GitHub - ebertmi/skulpt_numpy: Partial numpy implementation for skulpt

Hi everyone I’m Maxim, one of the lead developers on the code editor. I’ve taught creative coding for the last few years on my YouTube channel and in many workshops. I’ve always wanted the ability to collaborate in real-time with my students and always felt Python is a better language for beginners which is why I am so excited about this alpha launch. Looking forward to hearing your feedback, and please feel free to reach out with any questions.

1 Like

I can’t wait to try this!

I tried it, and loved it… here’s my hack https://code.strivemath.com/projects/051fd498-360d-4b5d-ab21-798286567cfc?live_id=strive-OJCH29

a bit of feedback… it’s a bit unclear what save does, in that it seems to

a. Refresh the screen which scares you that it’s lost all your code, then b. generate a new file (with a new cute name)…

Why did you reverse the y axis… is that a python thing or just an arbitrary decision?

Great work… I could well imagine using this with a class.

Tom

Hi Tom, I agree with you about the reversed Y axis and it’s something I noticed immediately too, and it goes against all computer graphics programming traditions. I suspect it suits maths better. I wonder if there could be a setting in the options (which current just has font size) so we can toggle between computing axis and maths axis modes?

1 Like

My precalculus students suggested reversing the y-axis in a similar environment that I created with them, and that design decision made its way to this environment. A small group of us would meet on Fridays to plan/debrief coding lessons, debug a hacked version of the p5 Editor we were using, and preview ideas from calculus. They formed a consensus that their classmates would benefit from a right-handed coordinate system, so I implemented it.

You can switch back to the computer graphics standard by calling `coordinateMode(TOP_LEFT)`. I believe it used to be `coordinateMode(LEFT_HAND)`.

2 Likes