The blockly/html code editor, Learn-Code!

Project URL: https://learn-code.glitch.me

Hi there! My latest project is new-learn-code. It’s used a learning resource (I’ll get to that in a minute)
It’s a code editor that very unique, used by Kidz.

Made for functionality, this app allows you to code, save, load, and code Blockly.

Now, as a learning resource, the whole entire webpage is unpublished, but I’ll give you a sneak peak of one part: (the try it in the editor thing)

Editor perks:

Saving! - URL or LocalStorage!
CDN from a button! - Get Jquery from a click and others! (more coming I promise)
Blockly Editor! - Need a hand? Just use the blockly editor!
Editor font size! - Accessibility is #1! You can change the font size to see it better!
IMPORTING AND EXPORTING PROJECTS! :grinning: - You can now import a file or project, and put it in! (this is also a way for extra files as it allows you to copy the js/img stuff) You can also export your project as a single html file, and use it offline!!!
You can also change the language of the blockly editor!

Update meanings:

  • “1” means done, but not released yet
  • “2” means not done.
  • “3” means released.
  • “4” means canceled.
  • “5” means coming up :grin:

Still to go:

  • 1: Make the host
  • 1: Make the homepage
  • 333333: Be better than GlitchyPastePen (just kidding @khalby786) Learn Code >>>> @khalby786’s GPP
  • 5: Formatting!
  • 5: Maybe my very own support widget
  • 3: No ads :grin:

I’m learning more math everyday!!!

Bookmarklet for a optional superpower coming soon :crazy_face:





Since the last 5 or so posts have been updates I’m just going to make this part-of topic into a big thread for my updates.

Current Update: Responsive-ness!

3 Likes

Wouldn’t it just be easier to use vs code even if you’re learning?

1 Like

?

VS code has a tutorial?

Plus, learn-code’s made to also let Raspberry pi computers work with it.

no but there’s hundreds of them on the Internet

2 Likes

The bottom ui is huge on my computer. Kids usually have pretty decent eyesight, the problem is, imagine someone presented their project on a monitor, or maybe a tv.
Also it’s a bit confusing to have code just floating in space for blockly, most of us will be like where does it start?

wow! blockly!

1 Like

I’m just a bit confused. The text editor has only HTML and CSS, but once you click Blockly, you have every language from PHP to Dart.

3 Likes

Blockly only enables stuff like a prompt or alert box. This is supported, but ya know that Lua can’t run HTML lol.

Plus blockly was mostly forked

I’m sure there is a way to run Lua on a webpage, but it probably isn’t practical. This is why I was asking why you had it in your project if you cannot use it at all.

You would have to compose the whole entire language. However with blocks you can only use the block code, so there is a limit. To even make the blocks you have to create what code they can make for example:

Blocks:
print("Hello")

Javascript:
alert("Hello")

Lua:
print("Hello")

and so on.

NEWEST UPDATE FOR LEARN CODE:

  • THEMES! (Also I mean a lot of themes, not only dark and light)
  • COMMENT KEYBOARD SHORTCUT! (Use Ctrl+/ to do this!!)
  • ERRORS! (linting)
  • CODE FOLDING! (close functions with ease)
  • SUPPORT FOR MOBILE! (panels aren’t affected tho so you will need to start dragging them)
  • JS AUTOCOMPLETE!
  • WE ADDED VUE!

You can find most of these in the “options panel.”

Enjoy!

1 Like

I want this removed - it’s creepy to some people.

Maybe don’t remove it, but give the user an option if they want it on or not. Most services have a feature like this but they ask for user consent.

Yeah, or at least tell us. We have DPA to think about

Data Protection Act

2 Likes

Ya, I’m trying to implement it but I’m not sure how to make it. Passwords are automatically removed from the playback and CodeMirror does not work with the code put in. However older editors do show code as they were not removed from playback before.

I’ll make a ToS on the site to let people know (° ͜ʖ °)

@Alt if you need help making a login /sign up I can help

Thanks. I could use it :slight_smile:

New update :tada:

  1. Im a bit calmer :slight_smile:

  2. new editor

  3. Import image/Export project

  4. everyones suggestion: the huge bottom ui is gone :slight_smile:

  5. secret editor: alt + g (you must be in the editor to use this)

Sorry i did not update for two months lol

Please reply with your wanted features :slight_smile:

Learn code is now https://learn-code.glitch.me/ and the old one is now gone.

Update shortly :grinning: