Show HN: Easylang – A browser-based first programming language | Hacker News Reader

Show HN: Easylang – A browser-based first programming language

easylang.online

167 pointschkas55 comments

Hi. I made Easylang to help beginners get started with programming. It is open source.

https://github.com/chkas/easylang

Why I think Easylang is for beginners better than Python.

https://easylang.online/blog/easyl_pyth.html

UPDATE: The posted link goes directly to the beginner tutorial. This is the start page of the IDE.

https://easylang.online/ide/

Open articleView on HN

You're my man! The only complaint is array index starts with 1. Can we break backwards compatibility please and make it 0?

This is a controversial topic. Here is why I consider for a beginner programming language 1-based indexing to be better.

https://easylang.online/blog/easyl_pyth.html

or you could allow both and in general an arbitrary starting index, like fortran

Couple observations:

- you should have a code snippet on your landing page

- in your python comparison it is unclear why easylang decides that a is a number.

It is similar to the way it used to be in BASIC. a is a number, a$ is a string, a[] is an array.

That does not make it easier though... you explained just now, and I understood, but where am I to pull it out of (because it is not intuitive at all) if not documentation? Just like with any other languages... Similarly, they will run into languages where arrays begin with 0. Beginners should be taught how to think about it and such, not shove it under the rug. Who is your target audience?

> where am I to pull it out of (because it is not intuitive at all) if not documentation?

It is in the documentation. Quoting from the documentation:

> String variables end with the $ character.

The principal problem though is that you're dropped into the first of 4 tutorial/documentation pages, and have to hit "back" (which is unintuitive since I didn't get there from anywhere else on the site) to see the list of tutorials and documentation pages.

Yes. I should have posted this link.

https://easylang.online/ide/

I did not mean to say that it is not in the documentation... What I am saying is that it is not intuitive at all, and it has to be documented for anyone, not just for "beginners to programming" to know. The reason I am saying this is that "counter-intuitive" and "not intuitive" is often mentioned as a reason for the language being more beginner-friendly.

To be fair, most of programming is not intuitive.

  i = 20
  # ... some lines later (not modifying i)
  for i in range(10): # non-intuitive for many - range goes from 0 to 9
    print(i)
  # ... some lines later (not modifying i)
  print(i) # what value should be printed here?

Or a subtle (and hard to spot when not isolated like this) one character difference creating a behavior change:

  i := 20
  for i := 0; i < 10; i++ {
    fmt.Println(i)
  }
  fmt.Println(i)

  i := 20
  for i = 0; i < 10; i++ {
    fmt.Println(i)
  }
  fmt.Println(i)

And that's with a primitive part of programming. There is no language whose behavior can be fully intuited by all people, beginner or not. Some things will have to be taught or read through documentation and examples.

> Who is your target audience?

Beginners

There are tutorials integrated in the IDE, among others one for beginners. The examples are the documentation.

> Similarly, they will run into languages where arrays begin with 0. Beginners should be taught how to think about it and such, not shove it under the rug.

Just to add to that: I am reading the book "Programming Algorithms in Lisp: Writing Efficient Programs with Examples in ANSI Common Lisp" written by "Vsevolod Domkin" and it explains it well enough for a beginner, I would say, at page 49; "Why Are Arrays Indexed from 0".

Also similar to perl since $ and [] are essentially sigils.

This may be a lost cause, but I don't think a beginner language should have mutable data at all. The only reason we really need mutability is for speed - our programs have to run on actual machines and for a long time we didn't have efficient ways of working with immutable data structures. It's a lot easier to reason about immutable data. And any non-programmer is not going to expect mutable data - from the beginning when they started learning math all the way up to MS Excel wizards, all the data has been immutable.

Mutation is a deep magic that learners shouldn't start with. It's pure premature optimization. Also everything should be expressions, no statements, why force people to learn extra syntax? Thank you for listening to my TED Talk.

...but thank you for making this tool! I love the IDE - simple, clear, and self-documenting!

When I started programming at age ten, mutable data was t so simple and obvious it never occurred to me that it could be any other way, let alone what the advantages would be.

Mutating is not an issue for single threaded code that beginners write, and it is completely intuitive (unlike FP) so not sure what GP is thinking about.

Mutable variables are not intuitive for beginners. Out there in the "real world", non-programmers will happily write extremely complex Excel spreadsheets, SQL queries and even Pandas/Jupyter notebooks, but will become completely stumped even by simple for loops.

People will handle even very complex code as long as it's "just math formulas", but add mutation and temporal reasoning into the mix and it immediately causes cognitive overload.

Sorry, "temporal reasoning" is not on the table. And if someone is having problem dealing with loops then recursion must be completely beyond them and rocket science.

The examples you give are symptomatic of usage patterns, and the tools you name lend themselves to copy-paste constructs for beginners. That is all.

p.s.

> non-programmers will happily write extremely complex Excel spreadsheets, SQL queries and even Pandas/Jupyter notebook

but for the life of them would not be able to troubleshoot if the copy-paste operation had a hiccup.

Sorry, you just haven't dealt with any real-world scenarios and real-world people.

Yes, recursion is not acceptable.

No, this isn't about copy-paste. In the "real world" non-coders produce write-only code. (Nobody can read or reproduce somebody else's "formulas", but they will happily write their own, spanning multiple pages.)

Troubleshooting and writing complex code is acceptable for non-coders, as long as the programming language is not Turing complete. (The human brain seems to have real trouble processing Turing-complete constructs, it is somethig that needs explicit training. Recursion or loops doesn't matter.)

> Sorry, you just haven't dealt with any real-world scenarios and real-world people.

I've been a professional s/e since 1986. Have seen quite a bit and all varieties of dev teams, rest assured.

> In the "real world"

You seem to be arguing for the merits of e.g. Exel type of programming, which I have not addressed at all. We were actually discussing "beginners".

McMaster University teaches w/ Elm (only the runtime mutates), which is probably more aligned with your interests.

http://outreach.mcmaster.ca/

We call it "variable", because it's variable

Made a bouncing circle:

https://easylang.online/ide/#run=color%20999%0Amove%200%200%...

This feels a lot like a BASIC and logo had a child and that is not a bad thing. Love the easy graphics, simple syntax, and removing all the punctuation.

Love the a = number input typecast.

End will be a source of bugs. Use endfor endelse endif endwhile. This helps new programmers track nested loops and logic. Yes, end is simple, but end applies to many things, and will end in a pattern where people will start doing this to sort it out:

end # while

Also, inline comments should be ok. Then you get end # while instead of the above two liner.

Honestly, this is a nice little language.

I got the same feeling...

Reminded me of COMAL(1) with the turtle graphics 'hook' to get kids immediately interested. I actually have some fond memories of teaching Comal to grade school (8-10 year old) kids :-)

1) https://en.wikipedia.org/wiki/COMAL

This is great and thank you for making programming more approachable!

I think some of the numbers would benefit from units. For example colours, size, coordinates etc can all be represented by the number 444.

Therefore `circle 444` could mean a large circle a grey circle, a centred circle.

I had to read the example before I understood the code there is all.

Perhaps a prefix x444, y444, c444, w444 would help?

I agree, though you can make this argument for any other programming language.

    circle 444
    or
    circle(444)

Named parameters are sometimes nice.

    circle r=444
    or
    circle(r=444)

I'd like to see something like this for JavaScript, and I'd like it to be built into web browsers.

Learning JavaScript provides a lot of leverage since it is built into basically every web browser and can be used for everything from web apps to server-side apps to pseudo-desktop apps.

I assume there are some pretty good programming tutorials that use the developer console. It's a pretty good environment for learning I think. Maybe not done yet. I think a really interesting angle is being able to access and modify things on a web page that a kid may be familiar with.

The Chrome dev tools has editing built in to the console. Takes a little getting used to using Ctrl-enter but works well otherwise.

It looks like a BASIC. Are there any benefits over other educational/games-oriented BASICs?

How does it compare to educational languages, like Hedy?

https://www.hedycode.com

The best attempt at creating a learnable programming language I've seen is this design document by Bret Victor: http://worrydream.com/#!/LearnableProgramming

It is now ten years old but I don't know if it has even been put into practice? To be fair, it would be a lot of work to include all the IDE features and Easylang comes reasonably close to it already. However, if I could recommend one paragraph it is the one on "Recomposition", which is an extremely clear explanation of why functional programming matters for learnable programming.

Every so often I re-read Bret's post to see what I can add to our learning environment. We use CodeMirror as our editor so we have pop-over help, color syntax highlighting and an optional autocomplete (optional because feedback from teachers was that it was too distracting).

We have a 'fluid' turtle that allows for the learner to follow execution to a point, although we do need to add in the ability to see which line of code is being executed at any given time, and the ability to control the execution speed better, maybe with a slider.

We're currently implementing (based on teacher feedback) a series of graduated environments where each 'level' unlocks more IDE features and primitives. For example, this is 'artSpace', a 2D environment (we also have a 3D environment):

https://turtlespaces.org/weblogo/?profile=artspace (warning, 40mb load)

You need to provide one brief tutorial at a time, otherwise it is overwhelming for learners.

You should focus on developing this further, I see lots of potential.

Beautiful, I'm going to use this in my next programming class!

Pleased to hear that. If you have any questions or feedback, please don't hesitate.

No parens, brackets, etc... Thank you :)

You’d like Ruby :)

Nope, love LISP:)

No parens???

This reminded me a little of Hedy language:

https://www.hedycode.com/

It starts off super simple, like:

print something

and then introduces all the fiddly concepts like quoting, escaping etc. 1 by 1 until it turns into python.

The designer had a neat talk about it at the strange loop conference.

One of the themes they talk about is the difference between "easy to learn" and "easy to teach" which I found insightful.

https://www.thestrangeloop.com/2022/hedy-a-gradual-programmi...

https://www.youtube.com/watch?v=fmF7HpU_-9k

This does not turn into Python.

They were talking about Hedylang

I was referring to "This reminded me a little of Hedy language".

Pyret (https://www.pyret.org) is already filling this role very nicely (browser-based Python-like for use in teaching), and has the advantage of having been designed by people whose careers are devoted to the study of programming pedagogy. It’s the language used in the front half of Data-centric Introduction to Computing, which is available online for free (https://dcic-world.org/2022-08-28/index.html). The second half of the book transitions to Python, at which point the reader/student is well-prepared to understand aspects of Python that can be tricky for first-time programmers.

Similar but used in production by a lot of htmx people: https://hyperscript.org/

You might be interested in Pyret, if only because the stated goals are similar.

https://www.pyret.org/

Reminds me of Logo: https://en.wikipedia.org/wiki/Logo_(programming_language)

Python has a Logo-ish mode called turtle graphics:

https://docs.python.org/3/library/turtle.html

Show HN: Particles – the URL contains the whole program code - https://news.ycombinator.com/item?id=31883209 - June 2022 (21 comments)

Show HN: Learn Basics of Programming in 40 Minutes - https://news.ycombinator.com/item?id=30136967 - Jan 2022 (3 comments)

Easylang – An easy online programming language and development environment - https://news.ycombinator.com/item?id=29218101 - Nov 2021 (36 comments)

Monte Carlo Methods or Why It's a Bad Idea to Go to the Casino - https://news.ycombinator.com/item?id=29217539 - Nov 2021 (70 comments)

Show HN: An Easy Programming Language That Runs in the Browser via WebAssembly - https://news.ycombinator.com/item?id=28863847 - Oct 2021 (9 comments)

Blackjack Probabilities, Card Counting – Calculation and Simulation - https://news.ycombinator.com/item?id=28025561 - Aug 2021 (23 comments)

Show HN: Learn the Basics of Programming in 20 Minutes - https://news.ycombinator.com/item?id=27245000 - May 2021 (5 comments)

Show HN: A programming language and framework for writing small canvas web apps - https://news.ycombinator.com/item?id=26779898 - April 2021 (2 comments)

Show HN: A modern BASIC-like teaching and learning programming language - https://news.ycombinator.com/item?id=22841336 - April 2020 (48 comments)

Show HN: The program code is in the URL - https://news.ycombinator.com/item?id=22266563 - Feb 2020 (5 comments)

Show HN: A Basic-Like Programming Language That Runs in the Browser - https://news.ycombinator.com/item?id=21178687 - Oct 2019 (6 comments)

Show HN: A small programming course for everyone - https://news.ycombinator.com/item?id=20982002 - Sept 2019 (12 comments)

Show HN: A few simple games not only for kids - https://news.ycombinator.com/item?id=20745142 - Aug 2019 (28 comments)

Monte Carlo methods – Why it's a bad idea to go to the casino - https://news.ycombinator.com/item?id=20359100 - July 2019 (161 comments)

Not to mention Show HN: Atto – BASIC computer that runs in the browser - https://news.ycombinator.com/item?id=27724236 - July 2021 (71 comments) (shameless plug ;D)

Static typing can’t be easy for beginners when they’re expected to cast a string to a number without variables having data type keywords. Type inference is often an example of abstraction confusing users with what’s really going on…

If facility is your concern, you should go for dynamic typing where assigning a string with a number gets converted automatically. No kid should have to deal with that. Give them the full amount of abstraction, it’s the runtimes responsibility.

Otherwise, you brought up some good points, Python and JS really aren’t as kid friendly as we think.

As much as I love BASIC from a nostalgia standpoint, Logo is still better -- Scratch is basically blocks-based Logo, and so Logo makes more sense as a first text-based language.

There's plenty of Logos out there at varying degrees of complexity as well: Lynx, Terrapin, turtleSpaces etc.

And they don't have static typing!

Reply on news.ycombinator.com