Camille McCue

Cheat Sheet / Updated 11-14-2022

Coding, or computer programming, is your way of communicating with technology. It’s the new literacy you need to master to be successful in the coming decades. Like any form of communication, coding takes place through language. Just as there are many human languages (English, French, Mandarin, Spanish, and so on), there are many coding languages! Two examples of coding languages are Scratch and JavaScript. Scratch is perfect as a coding language for kids because it’s easy and fun to use, Scratch coding for kids allows you to build programs by snapping together commands in the same way you assemble a puzzle. JavaScript is a step up in difficulty because it’s an authentic programming language, used by real coders. JavaScript powers many technologies, and you can use it to make both apps for your phone and control code for operating electronics gadgets. You can ease into JavaScript by using blocks to build programs (just like Scratch) and then switching to text-based coding when you’re ready. Here, discover tips for creating programs in Scratch, coding JavaScript apps in App Lab, and writing JavaScript code in MakeCode to operate the micro:bit electronics board.

Article / Updated 07-14-2022

When coding, it’s important to teach kids the basics of setting and finding position. Setting the position of an object means assigning it coordinates to put it in a specific place onscreen. Finding the position of an object means identifying its coordinates to know where it’s located. Using pseudocode While each programming language uses its own structure for setting and finding coordinates, a typical pseudocode expression you may write to set the position of an object looks like this: setx <em>x-coordinate</em> sety <em>y-coordinate</em> Or setposition <em>(x-coordinate, y-coordinate)</em> To find the current position of an object, you can write pseudocode for each separate coordinate: x-position for the x-coordinate of the object, and y-position for the y-coordinate of the object. You can also write position to describe the object position as a coordinate pair. Using Scratch to set position To set the x-coordinate of an object in Scratch, use the set x to <em>number</em> command in the Motion category. The minimum value of the x-coordinate ranges is -240, and the maximum value is 240. To set the y-coordinate of an object in Scratch, use the set y to <em>number</em> command in the Motion category. The minimum value of the y-coordinate ranges is -180, and the maximum value is 180. To set both the x-coordinate and y-coordinate of an object in Scratch, use the go to x: <em>number</em> y: <em>number</em> command in the Motion category. The range of the x-coordinate value is -240 to 240, and the range of the y-coordinate value is -180 to 180. In Scratch, you can set the size of an object using the set size to number % command in the Looks category. This sets the size of the object as a percentage of its original size. Percentages smaller than 100 shrink the object. Percentages larger than 100 grow the object. Using Scratch to find position To find the x-coordinate of an object in Scratch, use the x position command in the Motion category. To find the y-coordinate of an object in Scratch, use the y position command in the Motion category. You and your coder can use these commands in your programs when you need to write commands that require information about an object's position. As you code, sometimes you want to position an object (sprite) onscreen and then get its coordinates. You can do this for any sprite using either of these methods: Select the checkbox next to the x position command and the y position command in the Motion category to show these values onscreen. On the thumbnail of the sprite, click the “i” icon to expand its information center and then view the x: and y: values displayed there. In both methods, the coordinates of Scratch Cat are (60, -18). Using JavaScript To set both the x-coordinate and y-coordinate of an object in JavaScript, identify the object you want to position, and then use the setPosition command. Here are the steps for how to position an image of a mouse onscreen in the Code.org App Lab, using JavaScript. In App Lab, click the Design button above the emulator of the mobile device. In the Workspace, select Image →   Choose. The Choose Assets dialog box opens. Click the Upload button. Select the file you want, and then click the Choose button. The uploaded file appears in the dialog box. The name of the uploaded image file shown here is mouse.png. In the App Lab program workspace, type these commands: >image("character", "mouse.png"); setPosition("character", 160, 225, 100, 100); Here is what these commands do: The first command creates an image reference identification, character, and links the file, mouse.png, to this identification. The second command displays the image in character according to four quantities: the x-coordinate of the object, the y-coordinate of the object, the width of the object in pixels, and the height of the object in pixels. In App Lab, the range of the x-coordinate value is 0 to 320, and the range of the y-coordinate value is 0 to 450. When using JavaScript to program images displayed on a webpage, these values have larger maximum values, representing the larger size of a computer screen. The image below shows the mouse positioned at the coordinates (160, 225), which is the exact center of the screen. You can see that the mouse is positioned by its upper-left corner where the tip of its tail is located. The mouse has a width of 100 pixels and a height of 100 pixels. To find the x-coordinate of an object in JavaScript, use the getXPosition("character"); command where character is the identification reference of the object. To find the y-coordinate of an object in JavaScript, use the getYPosition("character"); command where character is the identification reference of the object. You and your coder can write the following code to find and display onscreen the coordinates of an object named character. This assumes you have uploaded an image file and assigned it to the reference identification, character. Type this code in the App Lab program workspace. var x = getXPosition("character"); var y = getYPosition("character"); textLabel("xcor"); textLabel("ycor"); setText("xcor", "x-coordinate is " + x); setText("ycor", "y-coordinate is " + y); Here is how this code works: The var x variable gets the x position and the var y variable gets the y position of the object. The two textLabel commands create locations onscreen, called xcor and ycor, to display information. Each setText command displays a value in a text label. The value of x displays in the xcor label and the value of y displays in the ycor

Cheat Sheet / Updated 04-27-2022

Coding is fast becoming a skill that every child needs to be educated for in the 21st Century. But coding is taught at only a small fraction of schools, and often only at the high school level. Helping kids learn how to code also means you’re assisting them in developing a skill that is highly marketable and sets them apart from peers at school and later, in their careers. The topics in this cheat sheet can assist you on getting started when your kid expresses an interest in learning how to code.

Article / Updated 06-29-2018

After you and your young coder finish making your app, you can share it with anyone who has an Android device. Just go to your list of Projects (Projects  →   My Projects), check the box next to the app you want to publish, and click Publish to Gallery. Fill out the form by uploading an image and providing a description. This is where you can put any attributions of media that you might have used in your app. Click the Publish button when you’re ready. The screen you’re taken to, after you publish your app, has a share link, which you can share with your friends who might want to check out your code. They can then click Open The App and remix it to try it on their own! To share your app with friends who just want to play your game, you have two options. Generate a temp QR code. This code allows your friends to download your app. Open your app and choose Build →   App (provide QR code for .apk). In the pop-up window is the QR code, which you can share with your friends. Using any QR code scanner, they can scan the QR code, open the link that is associated with the QR code, and a download starts. After the download is complete, they can open the app and play your game! The game is available until they delete it, even though the QR code expires in two hours. Download your app files and distribute them to your friends. You can do this by choosing Build →   App (save .apk to my computer). Then you can upload the file to Google Drive (or any other accessible server), make sure it’s accessible for anyone to view the file, and then distribute the link to the file. When your friends open the link on their Android device, the app starts downloading.

Article / Updated 06-29-2018

If your young coder wants to try apps, give the MIT App Inventor a try. To get started with MIT App Inventor, you need a Google account. Then follow these steps to set up your programming environment: Go to MIT App Inventor and click Create Apps in the top-right corner of the webpage. Sign in with your Google account. Give permission for Google to share your email address with App Inventor. Accept the Terms and Services for App Inventor and click Continue when you’re ready. Dismiss the survey and other items that pop up so that you can get started! You now see a view where all your projects are listed. You’re now ready to start designing and writing your first mobile app! Community and support within MIT App Inventor App Inventor was first released in 2010, and the community of coders and educators has grown. Make sure you’re signed in and then click Gallery. The image below shows the gallery where you find projects and tutorials that other coders have made and published. You and your coder can contribute to these too! In addition to the community gallery, MIT has created a number of resources for individuals and classrooms. For example, you’ll find over 30 tutorials divided by difficulty level and an option to filter by topic (such as game). There are also a ton of resources about using App Inventor, setting everything up, troubleshooting, and documentation. All this can be found in the MIT App Inventor library. Although this page is a bit less user-friendly — basically a list of links — it can be a great place to start if you have a question or experience any trouble. The community isn’t just created by MIT; there are also a number of books that you can find on App Inventor and forums where you can ask questions and get very specific answers on the App Inventor website under Resources. There are also specific resources for educators. Be sure to explore all the resources when getting your young coder acquainted with the software. The layout of MIT App Inventor Before you get started on your first mobile game, take the time to get acquainted with the programming environment. There are two areas your coder will spend time in: Design View and Code View. To get to Design View, click Start New Project in the top left of the programming environment. Name your project “myFirstApp.” The Design View opens. Note these six areas: Menu Bar: The menu bar across the top has the title of your app, options for multiple screens, and a toggle button for Designer and Blocks. Palette: On the left is a list of options for things to add to your app. Viewer: The viewer is basically what you see on your mobile device after you test your app. This is where you organize all the components to add to your app. Components: The components list shows all the elements in your app. Sometimes components are invisible, so this is an important view to know everything in your screen. Media: Under the Components view is a Media view where any sounds or images that you have uploaded to your app appear. Properties: If you click a component in the Components view, then the properties for that component is listed in this view. You can also change properties in this view, too. Then, to see the Code View, click the Blocks button on the very right of the Menu Bar. Menu Bar: Just like in the Design View, the menu bar allows you to switch screens or go back to the Design View. Blocks: This view has all the coding blocks (also referred to as tiles). There are generic blocks, but if you have a component in your design, there also are blocks specifically for that component. Media: This view has all the sounds and images that you have uploaded to your app. Coding Area: The coding area is where you drag the coding blocks to actually make your app respond to your users.

Article / Updated 06-29-2018

When you and your young coder are trying to debug, sometimes no error messages give you insight into the problem. Here, you find a list of strategies for debugging programs where you don’t get an error message, or the error message doesn’t give you enough information. Turning sections on and off One of the best ways to debug is to disable sections of code so that you have small sections to test. Using Scratch In Scratch, you might have a lot of scripts that start when the green flag is pressed. This can cause problems if some of the scripts cancel out or affect the other scripts. For example, the image below shows three scripts associated with one sprite. The problem that the user notices is when the mouse pointer is touching the sprite, it does not meow. To try to figure out the problem, the coder might disconnect all the scripts and only have one script connected at a time. Then they see that the code for the mouse pointer touching the sprite works correctly, but that there is another problem (the code that stops all sounds forever). By connecting and disconnecting the blocks, the coder can identify the problem. Using App Inventor Other block-based languages like App Inventor make turning sections on and off even easier! The image below shows how if you right-click a code block, you can disable that block. In this example, you might want to make sure the initial property settings work before creating the lists and hiding the items. Then, after you confirm the properties are set properly, you can enable the call to setupLists to make sure that works. Then you can enable the call to hideItems to make sure that works. By turning off all sections and then turning each one on one at a time, it’s easier to find bugs. Using Python Text-based languages have a similar way of turning sections on and off — you only have to comment out the lines of code. In Python, you can comment out a single line of code like this: #print 'Hi' And you can comment out multiple lines of code like this: "' for x in range(0, 4): print ('Hi ' + pets[x]) "' Commenting out code is how you “turn off” or “disable” parts of your code when you’re in a text-based language. Testing sample data A common bug that coders run into is not testing data to make sure that the program works. This can especially be a problem if you’re writing programs that take user input. It’s important to make sure you and your young coder think about what kind of input you’re expecting, and test to make sure the input is handled correctly. You might have a program that gets input from the user and prints what the user types, like this Python code: name = raw_input('What is your name? ‘) print (‘Hi ' + name) It’s important to test to make sure that if you put the following types of input, they still do what you, as the coder, expect: Sarah Sarah Guthals 13 11/15 Sarah 55 Guthals By mixing letters, spaces, numbers, and other symbols like / you’re ensuring that your program performs as expected. This type of testing is unit testing and ensures that small portions of your program execute correctly with varying input. Adding output messages One of the most challenging aspects of coding is that the code is abstract and sometimes the data is hidden. This is especially tricky when you have complex data or are performing complex operations on data. By adding a number of output messages in your code, you can indicate when certain sections of code have been reached, or you can show the current values of certain variables at various points during execution. An example of adding output messages to a program to gain insight in Python follows. Here, your goal is to write a program to solve an algebraic expression. For example: x = input('Provide a number for x: ') y = input('Provide a number for y: ') first = 2*x second = 6*y sum = first - second print '2x + 6y = ' print (sum) There is an error in this program; instead of adding the first and second elements, the coder is accidentally subtracting. Though this error is fairly obvious because this example is small, it shows how a simple typo could completely change the output. If you run this code, you get results like: Provide a number for x: <strong>2</strong> Provide a number for y: <strong>3</strong> 2x + 6y = -14 This is clearly wrong. 2*2 + 6*3 = 4 + 18 = 22, not -14. One way of debugging this code is to add output messages at each point. For example, you could change your code to: x = input('Provide a number for x: ') print ('x: ') print (x) y = input('Provide a number for y: ') print ('y: ') print (y) first = 2*x print ('first: ') print (first) second = 6*y print ('second: ') print (second) sum = first - second print "2x + 6y = " print sum Then, when you run the code you get the following output: Provide a number for x: 2 x: 2 Provide a number for y: 3 y: 3 first: 4 second: 18 2x + 6y = -14 Then the coder can see that x, y, first, and second are all correct. This must mean that it’s just when the sum is calculated that there is an error.

Article / Updated 06-29-2018

It’s easy for kids to make semantic errors when they’re first learning to code. Unlike syntax errors, semantic errors are often more difficult to capture. This is because semantic errors are typically errors in the programming logic, rather than something that you typed incorrectly. Here, you find a couple of examples of semantic errors that you and your young coder might encounter in a few different programming languages. Infinite loops Infinite loops are loops that never end! They go on infinitely. This can be a problem because it might seem like the code just isn't working, but really the program is just running forever and ever. Using Java If you wrote a small Java program where you wanted to print the numbers 0 through 9, you might write something like this: for(int index = 0; index < 10; index--) { System.out.println(index); } But there is an error in this code! Instead of updating the index to be index + 1, the code updates the index to be index – 1! So the code does the following: index = 0 Is index < 10? Yes Print index 0 index = index – 1 index = -1 Is index < 10? Yes Print index -1 index = index – 1 index = -2 Is index < 10? Yes Print index -2 index = index – 1 index = -3 Is index < 10? Yes Print index -3 This continues forever, because it’s impossible for index to be greater than or equal to 10. So when you run the Java code, the program continues to print forever, until you kill the program! Using Scratch Although infinite loops can be a problem, some programming languages deliberately have implemented infinite loops to make some pretty neat effects! For example, in Scratch there is a forever block which can do some cool things. Off by one Another very common error to run into is called an off by one error. This is very common when dealing with lists and iterating through lists. Using Scratch Scratch, as usual, handles off by one errors for the user without really indicating there’s a problem. For example, the image below shows a program that loops through a list of pets and has the sprite say Hi petName, where petName is replaced with the item from the list (either Luke, Winston, or Princess). The loop repeats four times, but there are only three items in the list. Instead of completely breaking, on its last iteration, Scratch prints Hi with nothing after it. Using Python Other programming languages are not as forgiving. For example, in Python you might have the following program to say hello to the three pets: pets = ['Luke’, 'Winston', 'Princess'] for x in range(1, 3): print (‘Hi ‘ + pets[x]) If you run this program, the output would be: The reason ‘Hi Luke’ doesn’t print is because lists in Python start at 0, not at 1. The correct code would be: pets = ['Luke', 'Winston', 'Princess'] for x in range(0, 3): print ('Hi ' + pets[x]) The range function used in Python: range(0, 3) Represents the elements 0, 1, and 2 because the range function includes the first number but excludes the second. Another version of an off by one error in Python would be if you went beyond the length of the list. For example: pets = ['Luke', 'Winston', 'Princess'] for x in range(0, 4): print ('Hi ' + pets[x]) This causes even more of an issue, because instead of simply missing an element in the list, you’re trying to access an element that never existed in the first place. The output for running this code is: Hi Luke Hi Winston Hi Princess Traceback (most recent call last): File "filename.py", line 4, in print ('Hi ') + pets[x] IndexError: list index out of range There is an actual error, because the data for pets[4] doesn’t exist, so the computer cannot resolve it; therefore it doesn’t know what to do. Off by one errors can be really tricky for young coders, especially if they’re switching between languages where lists start at 1 versus lists that start at 0.

Article / Updated 06-29-2018

Your coder can provide flexibility to her programs by coding parameters to subprograms. For example, coding a square subprogram allows the program to draw a square of a defined size each time the subprogram is called. But what if you want the square subprogram to draw squares of differing sizes? By adding a parameter to the subprogram you can do just that. A parameter is a variable that you pass into a subprogram, which the subprogram uses as it executes. You can pass a parameter into the square subprogram that tells the code how big to draw the square. Scratch code block with parameters Scratch allows you to add one or more parameters to any subprogram block you create. Your coder can begin by making a simple block. Then, your coder can add parameters when she first creates the block, or she can edit the block after it has been created — the process is essentially the same. Here are the steps for editing the square code block previously created: In the More Blocks category, right-click (Windows) or control+click (Mac) the instance code block tile that you previously created. Select Edit from the pop-up menu which appears. The Edit Block dialog box appears. At the Edit Block dialog box, click the Options tab to expand the options for adding parameters. Click the icon for any of the parameter options shown to add that parameter to your block. You can choose Add Number Input, Add String Input, Add Boolean Input, or Add Label Text. When you click an icon to add that parameter, a blank field is added to your instance code block tile. You can add more than one parameter. Inside the blank field on the instance code block tile, type the variable name of the parameter(s) you’re adding. Select the Run without Screen Refresh check box. This allows for faster execution of your program. Click OK. The dialog box closes and the code block tile now shows the added parameter(s). In Scratch, parameters added to code blocks play the same role as variables. When the parameter is added, you can use it just like a variable in your program — although be aware that it doesn’t appear in your list of variables in the Data category. Using your edited block with parameters is easy! Just drag the parameter tile from the code block definition (the big “hat” tile) into your code when you want to use the parameter. The parameter replaces code which you previously defined outright. Instead of the code tile for move 100 steps, you now have a code tile for move size steps. This allows for more flexible usage of the code block because it can now accept a number for the size, sent by the main program, and execute the code block with that size as the side length. Your main program then calls the parameterized block, sending it a number to use for the size: square 30 draws a square with side lengths of 30 pixels; square 110 draws a square with side lengths of 110 pixels. JavaScript, with parameters You can add parameters to your JavaScript functions to add flexibility to your programs. To create a function with a parameter in Code.org's App Lab, using JavaScript, complete these steps: At the Functions category of tiles, drag a function myFunction(n) tile into the program workspace. The n is a parameter. If you already added a myFunction() command without a parameter, you can add the parameter by typing the parameter inside the parentheses. (Or, if you are working in tile mode, press the little horizontal arrows to add or remove parameters from your function.) In text mode, separate multiple parameters using a comma and a space following each parameter. Replace the myFunction(n) placehoder, by typing a name for the function, and a name for your parameter(s). Use camelCase naming conventions for JavaScript. Each parameter is a variable in your program. Attach commands to define your function. The parameters are referenced by their variable names inside the function. Use the function name and parameter values to call it from your main program. The parameters values are passed into the function. Parameter values are assigned to the parameter variables and used inside the function. See the image below for a JavaScript program with functions and parameters, written in the App Lab. This program draws a field of twenty flowers of different sizes and pink color, randomly distributed in the display. Note that there are two parameterized functions: one to draw oneFlower(size), and one to draw onePetal(size) of the flower. Here, the main program calls the oneFlower(size) function that has been defined to include a size parameter. The oneFlower (randomNumber(5, 20)) function call sends a random number, from 5 to 20, to the oneFlower(size) function; size takes on a new value between 5 and 20 each time the function is called. The oneFlower(size) function then calls the onePetal(size) function. The onePetal(size) function receives whatever value its parent subprogram received for size. The effect is that flowers of different sizes are drawn onscreen. The emulator shows the result of executing the program. Java, with parameters The image below shows a Java class named Product, written in the BlueJ IDE. The class contains one method, Product, which has two parameters, a and b. Here's how to code this program: Code the class name: public class Product {. Code the main program. This is the section labeled main. The main program calls the multiply method, which receives two parameters. Code the multiply method, which has two parameters, a and b. The multiply method defines three variables, a, b, and total. Variables a and b are parameters defined as integers. Their values, 5 and 7, are received from the call located in the main program. The multiply method computes total and prints out its value. Close the class with a curly bracket. The image below shows the execution of Product. Notice that the values of the variables a and b can be changed outside of the multiply method to result in a new product for total. This makes the multiply method modular and easy to reuse with different variable values on each use. Parameterizing methods build a more flexible program. Subprograms can also generate information that they pass onto other subprograms or back to the main program. In Java, your coder sometimes sees the code void. This means that, when the subprogram is called, it's not sending anything back to the program that called it. In other cases, your coder sees a variable type and name following the name of the main program or of a subprogram. That type and name tells you what type of information is going to be received by the program making the call. The subprogram contains a return command indicating what variable value is being returned (passed back to) the program that called it.

Article / Updated 06-29-2018

Kids need to learn how to code all of the basics. Searching through lists is a very important task that you and your coder might want to have your program accomplish. Linear versus binary searching algorithms When it comes to lists, linear search is pretty straightforward. Essentially you start at the beginning of the list, and check to see if the first item is the item you’re looking for. If it is, you’re done! If it isn’t, you move to the next item in the list. And you repeat this sequence until you’ve either found your item, or you’ve reached the end of the list and know that your item isn’t in the list. Binary searching is a little more complicated than linear searching. Luckily, you’ve probably already used the binary search algorithm in your everyday life though. For example, when you’re looking for the word “Search” in a dictionary, you probably don’t read each word in order until you get to the word “Search.” Instead, you flip to the middle of the dictionary and check to see whether the word “Search” comes before the page you opened, or after. You know this because the dictionary is in alphabetical order! If “Search” comes after the page you’re on, you flip to a page to the right and repeat the process until you end up on the right page. This is called binary search, also known as “divide and conquer.” When writing the code for this type of search, you literally go to the middle of the list, and then the middle of the side that you know the word is on; each time dividing your search space by half. In your everyday life you might not be exactly at half, but it’s close enough to still call it a binary search. The only caveat to binary search is that the list must be sorted for the sorting to work. A linear search implementation doesn’t require your list to be sorted before searching. Common application: Finding a phone number Here, you find the code for finding a phone number in a list of names that are ordered alphabetically. This code is written in Java and, because the names are sorted but the phone numbers are not, this implementation uses the linear search algorithm. import java.util.ArrayList; import java.util.Arrays; import java.util.List; import java.util.Scanner; public class sort2 { public static void main(String [] args) { Person sarah = new Person("Sarah", "555-7765"); Person camille = new Person("Camille", "555-9834"); Person steve = new Person("Steve", "555-2346"); Person rebecca = new Person("Rebecca", "555-1268"); List directory = Arrays.asList(sarah, camille, steve, rebecca); Scanner scanner = new Scanner(System.in); System.out.println("Please enter the phone number so I can tell you the name: "); String number = scanner.nextLine(); String nameFound = ""; for(int index = 0; index < directory.size(); index++) { Person personInDirectory = directory.get(index); String numberInDirectory = personInDirectory.getNumber(); if(numberInDirectory.equals(number)) { nameFound = personInDirectory.getName(); break; } } if(nameFound.equals("")) { System.out.println("Sorry, the number you are looking for does not belong to anyone in this directory"); } else { System.out.println("The number " + number + " belongs to " + nameFound); } } } This code relies on another class in a file called Person.java. The code for this file is: public class Person { String name; String number; public Person(String p_name, String p_number) { name = p_name; number = p_number; } public String getName() { return name; } public String getNumber() { return number; } }

Article / Updated 06-29-2018

Nested loops can seem complicated to young coders, but they are basically a loop within a loop. This can be useful for making drawings like fractals or fun shapes that repeat but slightly change each time, creating ASCII art, or even having complex repetitions. The examples found here show how nesting loops can help create some fun programs. You can nest any kind of loop inside any other kind of loop. For example, you can nest a for loop inside a while loop! A fractal is a geometric object that has self-similarity — it shows the same pattern whether you’re looking at it far away or close up. Fractals can provide mathematically accurate models of coastlines, mountains, and other real objects from nature. Loops (specifically, recursive loops) are used to code fractals. One of the earliest uses of computer graphics in big-screen movies was the creation of fractal-based scenery for the transformation of the Genesis planet in Star Trek II: The Wrath of Khan. Khhannnnnn! Using pseudocode Nesting loops can happen in any combination. Here are some examples of nesting loops, but this list is not exhaustive. For-each loop nested inside a for-each loop: for(item in list) action1 for(item in list) action2 action3 … END_FOR_EACH action4 END_FOR_EACH Example: jellyBeanCount = 0 for(jar in jars) for(jellybean in jar) jellyBeanCount = jellyBeanCount + 1 END_FOR_EACH END_FOR_EACH While loop nested inside a for-each loop: for(item in list) action1 while(condition) action2 action3 … END_WHILE action4 END_FOR_EACH Example: for(room in house) while(wallsWhite) paintWallsBlue END_WHILE END_FOR_EACH Using Scratch Nesting loops in Scratch can be a lot of fun when you introduce the pen and start drawing fun shapes. Here are some basic examples of nesting loops in Scratch. Repeat loop nested inside a repeat loop The image below shows an example of a Scratch program that draws 10 concentric squares. The outer repeat loop is responsible for repeating 10 times for each square. The inner repeat loop is responsible for repeating 4 times, for each line and turn in each square. Repeat loop nested inside a repeat-until loop Take a look at the image below to see an example of a Scratch program that draws squares in random places around the screen until the user presses the space key. Using Python One of the most fun programs to write in Python with nested loops is ASCII art. In coding, each character and symbol that you can type on a keyboard has a number representation called its ASCII number. Although in today’s programming languages, you can type the character or symbol in your program, in the past you would have to use the ASCII number representation. ASCII art is basically when you create a picture using characters or symbols. There are some pretty amazing ASCII art examples. As a kid, Camille used to have ASCII portraits of all the Star Trek: The Original Series cast members on her wall! You can create a simple ASCII art program in Python using nested loops! For example, to create this pattern: # ## ### #### ##### ###### ####### ######## ######### The algorithm might be: Print 1 # on Row 1 Print 2 # on Row 2 Print 3 # on Row 3 … You could represent this using nested loops too! for row in range(1, 11): rowText = '' for column in range(1, row): rowText = rowText + '#' print rowText</pre