[HN Gopher] Blockly: A JavaScript library for building visual pr...
       ___________________________________________________________________
        
       Blockly: A JavaScript library for building visual programming
       editors
        
       Author : selvan
       Score  : 99 points
       Date   : 2021-07-23 09:21 UTC (1 days ago)
        
 (HTM) web link (developers.google.com)
 (TXT) w3m dump (developers.google.com)
        
       | pan69 wrote:
       | Reminds me a bit of Macromedia/Adobe Authorware.
       | 
       | https://en.wikipedia.org/wiki/Adobe_Authorware
        
       | usertanooki wrote:
       | I've been using this and a custom React wrapper at work to build
       | an automation tool for legacy Windows apps with a lot of success:
       | https://etacautomation.com
       | 
       | Blockly is vanilla JS and very easy to extend as needed (I added
       | a better type system, for example), and their new plugin system
       | is super helpful. Its performance isn't quite there, but I have
       | high hopes for the future with the changes I've seen so far. The
       | devs have been wonderful to work with, too.
        
         | NoahKAndrews wrote:
         | Is your type system open source? Better typing is something I'd
         | love to have for the FIRST Tech Challenge blocks environment.
        
         | mic-kul wrote:
         | what is your tech stack if you don't mind sharing?
        
       | wryun wrote:
       | The NFP I work for has used this extensively - thanks Google!
       | 
       | A few years ago we did a bunch of short free "hour of code"
       | courses with a few different block flavours:
       | 
       | https://groklearning.com/hoc/
       | 
       | (search for blockly)
        
       | dvh wrote:
       | Are these block-based visual editors Turing tarpits or entry
       | drugs?
        
         | amitport wrote:
         | They're both IMO. You can do much but if you're inclined to
         | learn it will help with some concepts
        
         | k__ wrote:
         | Depends on how general the solution is, I guess.
        
       | mcv wrote:
       | I used that blockly maze to teach kids at my son's primary school
       | some programming. It starts out simple, and then you progress
       | through loops, conditions, and eventually they have to implement
       | a real wall-following algorithm.
       | 
       | I had 3 students at a time so I could help them a lot, which some
       | kids definitely needed. But some didn't, and came up with some
       | really interesting algorithms.
        
       | [deleted]
        
       | 123pie123 wrote:
       | This looks great, I can't believe I've not seen it before. I'll
       | be looking to introduce this to my kids
       | 
       | This is almost the next stage from learning scratch
       | (https://scratch.mit.edu/)
        
         | CuriousSkeptic wrote:
         | If you need a next stage from scratch, do consider Kojo.
         | 
         | https://kogics.net/kojo
        
         | mch82 wrote:
         | Scratch 3.0 is actually implemented using Blockly.
         | https://en.scratch-wiki.info/wiki/Blockly
        
       | c-py wrote:
       | I built a tool to create deployment scripts for AWS ECS based on
       | Blockly: https://craftydeploy.com/
       | 
       | It didn't really hit the mark - but working with Blockly was a
       | great experience nonetheless
        
       | corentin88 wrote:
       | Wondering if Google Apps Script editor is using Blockly? I
       | couldn't see it in the list of projects using it.
        
       | misterdata wrote:
       | At work we built a BI tool around Blockly in 2013. Still in daily
       | use: https://www.dialogic.nl/wp-content/uploads/2018/02/demo1.gif
        
         | vanderZwan wrote:
         | That looks really nice!
         | 
         | The interface designer in me immediately wants to scream _"
         | Fitt's Law!"_1 and move the header with run/select/save from
         | above the output to between the output and the code blocks
         | though.
         | 
         | EDIT: Actually, Fitt's Law tells us _not_ to do that. But
         | scrolling to find those buttons is also wrong. Why not make it
         | a sticky header?
         | 
         | 1 https://www.interaction-
         | design.org/literature/topics/fitts-l...
        
           | mikeyjk wrote:
           | I remember getting into a discussion on Reddit where someone
           | claimed tagging on to a bus was faster by pressing the card
           | right up against the card reader. Always felt like an abuse /
           | misinterpretation of fits law to me.
        
             | vanderZwan wrote:
             | If I understand your sentence correctly it's a bit of an
             | edge-case (pun not intended).
             | 
             | When designing interfaces for a screen, the edges (assuming
             | that moving the mouse to the edge doesn't cause scrolling)
             | can be considered "infinitely" wide or tall for the purpose
             | of Fitt's law. This is a really old insight:
             | 
             | https://www.joelonsoftware.com/2000/04/27/designing-for-
             | peop...
             | 
             | Pressing your card against the card reader is the same
             | idea: you don't have to be precise with your motor
             | functions, because as soon as you hit the card reader you
             | know you're close enough. So people can be faster with this
             | approach.
             | 
             | (with that in mind, my earlier solution is actually wrong:
             | the buttons shouldn't be put between the output and the
             | code, they should be made _sticky_ )
        
           | victor106 wrote:
           | Unrelated question:- how are ui/ux courses from interaction-
           | design.org?
        
             | vanderZwan wrote:
             | I wouldn't know, I never took them. However, looking at the
             | "people behind" page1 I _can_ say that they have an
             | impressive list of well-known experts in the field there.
             | So at the very least they have that going for them.
             | 
             | 1 https://www.interaction-design.org/about/people-behind
        
         | TechBro8615 wrote:
         | Cool! Is there any write up about this?
        
       | jokoon wrote:
       | I'm really curious if this could be used for people who need to
       | write code but aren't trained for it or because it's not their
       | job. A lot of people are not willing to learn coding, and I
       | really feel there are possible effort to make it more simple.
       | 
       | The first thing that scare those people is the whole "plain text"
       | thing. Spelling errors in programming are not forgiving and
       | that's the first thing learners have trouble with.
       | 
       | One example that comes to mind is science. There often is data to
       | process, and excel can obviously do many things, but I'm really
       | confident that more could be done.
       | 
       | Programming feels like something that is often done by experts,
       | but it really really doesn't have to.
       | 
       | Of course, programmers often disagree that beginners should be
       | given tools to replace experts programmers, but it's still better
       | to have someone who can do the job of a programmer.
        
         | usertanooki wrote:
         | I've had some success teaching workshops to adults who aren't
         | familiar with programming for the product I use it on. A lot of
         | them are able to really grasp how to get things done within a
         | session, but figuring out more advanced things (e.g. loops,
         | functions, dictionaries) is still somewhat clunky.
        
           | jalk wrote:
           | Exactly - it still takes a programming mindset. In my
           | experience watching people using Scratch et. al. When ppl
           | start to acquire that mindset, the guardrails of visual
           | programming turn into hurdles.
        
             | themolecularman wrote:
             | Would you recommend people skip Blockly if they want to
             | teach people to code?
        
       | onion2k wrote:
       | The blocks not fitting neatly inside one another in the "do" and
       | "else" blocks is quite infuriating.
        
         | cpcallen wrote:
         | This was originally a rendering bug, but one which turned out
         | to be a massive improvement and so has been kept as a feature:
         | https://developers.google.com/blockly/guides/app-integration...
        
       | konsumer wrote:
       | One thing I love about blocky vs scratch is that it outputs
       | regular code, in several languages. This means you can use it as
       | "guard rails" up until you understand the concepts, then start
       | using the generated language when you need more. It's also a DSL,
       | in the sense that you can generate regular code from any blocks
       | you make, at any level of the code flow, and you can mix that
       | with already-made blocks for your target language. I started work
       | on a Minecraft bot/mod tool that outputs JavaScript, for example,
       | and added the full API (that is available in JavaScript code) so
       | if you feel limited by the the blocks, you can just focus on the
       | code. I stopped working on it, because the library it depends on
       | to interact with Minecraft stagnated (and got really out of date
       | with Minecraft versions) but a similar approach could be applied
       | to pretty much anything. https://github.com/konsumer/botmodblock
        
       | dang wrote:
       | Past related (I think?) threads:
       | 
       |  _BlocklySQL: A new block-based editor for SQL_ -
       | https://news.ycombinator.com/item?id=25517043 - Dec 2020 (38
       | comments)
       | 
       |  _Blockly is a library for building visual programming editors_ -
       | https://news.ycombinator.com/item?id=10763057 - Dec 2015 (40
       | comments)
       | 
       |  _Google Blockly is a library for building visual programming
       | editors_ - https://news.ycombinator.com/item?id=9987641 - Aug
       | 2015 (1 comment)
       | 
       |  _Google 's Blockly Games_ -
       | https://news.ycombinator.com/item?id=8211031 - Aug 2014 (18
       | comments)
       | 
       |  _Google Blockly - a visual programming language_ -
       | https://news.ycombinator.com/item?id=4050426 - May 2012 (123
       | comments)
        
       | vanderZwan wrote:
       | I've just spent half an hour searching through my saved contalks
       | folder trying to find a talk from (I think) last year where a
       | someone talks about their new compiler research regarding block-
       | based languages, specifically to make it easy to design and
       | implement custom block based languages. Does this ring a bell
       | with anyone?
        
       ___________________________________________________________________
       (page generated 2021-07-24 23:02 UTC)