Translation missing: en.general.accessibility.skip_to_content
Your First BBC Micro:Bit JavaScript Program

Your First BBC Micro:Bit JavaScript Program

We have covered many tutorials for the BBC micro:bit using their block code editor. In this tutorial, we will be stepping up the game by introducing a text-based coding language called JavaScript. 

MakeCode Software

Regardless of which OS you are using go to the MakeCode website with any internet browser. The page is broken down into a series of sub-categories with your created projects being at the top along with some premade programs for Tutorials, Games, Radio Games, Fashion and many more!

You can click on any of these to load the code, however, if you wish to start your first or a new project click on the big purple box labelled New Project.

You have 2 coding options within this which can be changed by using the  At the top of the page you will notice a slider-style button, click on it to change the coding window to JavaScript mode.

Block Mode

JavaScript Mode

You should now have a screen that looks like this.

The program that we are going to create will display a smiley face to the user when the press the A button it will say "Hello" and when they press button B it will ask how they are.

Coding the Program

Step One)

On line 4, type

basic.showLeds

Press the enter key, the program will add a series of dots on lines 3, 4, 5, 6 and 7. This is the grid for your LEDs, a # symbol will light the LED while the . will turn it off. Using the two symbols create a smiley face of your choice, or copy the one in the image below.

Original LEDs Smiley Face LEDs

Step Two)

Click on line 10 (this should be your first blank line). Type the following line of code 

input.onButtonPressed(Button.A, function () {
Press Enter two times, you will notice that it has added a }) and moved it to line 12.

Click on line 11 and type 

basic.showString("HI")

You have now coded the A button to show the word "HI" whenever it is pressed.

Step Three)

Highlight and copy lines 10, 11 and 12, pasting them onto line 13. Modify the code so that it works with the B button as seen below.

input.onButtonPressed(Button.B, function () {
basic.showString("How Are You?")
})

Well done, you have completed your first JavaScript program for the BBC Micro:bit, the only thing left to do now is to transfer the file across.

  

Uploading your Program to the micro:bit 

In the bottom left corner of the MakeCode page, you will find a textbox along with a purple download button. Click on the word untitled in the textbox and give your program a new name.

Press the Download button and the file will download to your downloads folder unless you specified a specific place.

Once the file has downloaded, open up the window for the download location and a separate window for the MICROBIT. Click and drag the file from downloads over to the micro:bit. 

Once it has finished, the MICROBIT window will close and reopen, please note that while the file you just copied does not appear in the window, it will have been copied across.

Previous article Comparing the BBC Micro:Bit V1 and V2, what is different?