Home How Tos Learn How to code With Google Blockly (No Keyboard Required)

Learn How to code With Google Blockly (No Keyboard Required)


Back in the 80s, home computers users had to use BASIC programming languages to write their own software. It didn’t take long before PCs started arriving with a number of ready-made software, killing programming right away and leaving the job to professionals. This has, since then, had a series of detrimental effects on the computer skills people have nowadays.

To reverse the trend and give people another reason to start coding, Google recently introduced Blockly, a coding program that teaches the different principles of programming without necessarily requiring you to enter any of the programs as a text. You don’t have to type or do anything traditional programmers do. All you have to do, instead, is move different blocks around on-screen and that is it—you’ll be coding the modern way.

Although our guide will only be teaching you about a handful of features in Blockly, we trust and hope that this introduction will inspire you to master the ropes around this program:

How to Use Blockly

Step 1

You can begin by visiting <a href=”https://blockly-demo.appspot.com/static/demos/code/index.html”> Google Blockly Website</a>, where you can start creating your programs. Next, click on “text” then the “Print”—located below. Now for the second time, click on “text,” and then the “ ” block somewhere at the top.

coding1Step 2

Drag the “ ” block towards the “print” block from the right to join them together. Now go ahead and click the space between the “ ” marks and type “hello World!” (Don’t put the quotation marks). You’d have successfully created your first program.

coding2Step 3

At the top-right corner of your screen, there’s a white triangle enclosed in a red background icon. Click on the triangle, and the program will pronounce “hello world!” This is a good start, but there’s room for doing better. Just click on the bin icon to trash everything and start from scratch.

coding3Step 4

Create something else, but very similar to the program we first had. But this time use the “item” block—beside the variable—instead of the “ ” block. You can try running the block once done. It should say “undefined” since “item” is a variable that we are yet to define.

coding4Step 5

To define the item variable, drag the “ ” block to besort it with the “Send Item To” block—under variables. Now type “Hello World” between the quotation marks to get the program working just like the first one.

coding6Step 6

The above step may appear pointless, but try adjusting the name as shown in the screen shot before running it. The “item” variable will end up greeting you by name. Note; there are a lot variable that you can play with by changing the word “item.”

Step 7

You can try a little bit of arithmetic using the relevant blocks under “math.” Try to create a program and you’ll see that it calculates a correct answer for you. Go ahead and modify it so it can calculate even more complicated sums.

coding8Step 8

In this step we’re going to look at how to generate several results using one program. First we’ll be generating the program shown below using a program concept by the name loop. You should note that everything in the loop carries out all value for the variable i—from 1 to 10. You can run it to print out the 5X table.

Step 9

The next step revolves around creating a loop inside a loop. To do this, just have the program modified as shown. Basically the program uses two different variables, I and J. You can use it to print out the 10X multiplication table—from 1×1 to 10 x 10.

Step 10

The final step involves another common programming feature—deciding on the instructions to execute as per the outcome of comparisons. Here, you’ll have to create a program that you’ll be supplying negative and positive numbers when prompted. Now go ahead and click the * block to add the Else parts and the Else if.


Leave a Reply