This article provides a comprehensive walkthrough for completing the 9.1.7: Checkerboard V2 exercise in CodeHS. This challenge builds upon basic looping concepts by introducing nested loops and conditional logic to create a complex visual pattern. Understanding the Objective
The goal is to create a grid where the colors of the squares alternate like a traditional checkerboard. Unlike the first version of this exercise, "V2" usually requires a more dynamic approach—often utilizing variables for row and column counts or specific helper methods to determine which color should be placed at a specific coordinate. The Logic Behind the Grid
To build a checkerboard, you need to understand the relationship between the row index ( ) and the column index (
Even Rows: If the row index is even, the pattern might start with Color A.
Odd Rows: If the row index is odd, the pattern must start with Color B.
The Sum Rule: A more efficient way to calculate the color is to check if the sum of the row and column indices (
) is even or odd. If the sum is even, use Color A; if odd, use Color B. Step-by-Step Implementation 1. Define Constants
Start by defining the size of your board and the colors you want to use. This makes your code easier to read and modify later. javascript
var GRID_SIZE = 8; var SQUARE_SIZE = getWidth() / GRID_SIZE; var COLOR_ONE = Color.RED; var COLOR_TWO = Color.BLACK; Use code with caution. 2. The Nested Loop Structure
You will need one loop for the rows and another inside it for the columns. javascript
for (var row = 0; row < GRID_SIZE; row++) for (var col = 0; col < GRID_SIZE; col++) // Drawing logic goes here Use code with caution. 3. Applying Conditional Logic
Inside the inner loop, use an if/else statement to decide which color the current square should be. javascript
var x = col * SQUARE_SIZE; var y = row * SQUARE_SIZE; var square = new Rectangle(SQUARE_SIZE, SQUARE_SIZE); square.setPosition(x, y); // The "Checkerboard" Logic if ((row + col) % 2 == 0) square.setColor(COLOR_ONE); else square.setColor(COLOR_TWO); add(square); Use code with caution. Common Pitfalls to Avoid
Off-by-one errors: Ensure your loops start at 0 and end at GRID_SIZE - 1. 9.1.7 Checkerboard V2 Codehs
Coordinate Math: Remember that the x coordinate is determined by the column, while the y coordinate is determined by the row.
Scaling: If you hardcode the pixel values, the checkerboard won't resize correctly if the GRID_SIZE changes. Always use getWidth() / GRID_SIZE for dimensions.
The 9.1.7 Checkerboard V2 exercise is a rite of passage in CodeHS. It transitions you from writing linear code to thinking in two dimensions. By mastering the nested loop and the modulo operator (%), you gain the tools necessary to build more complex graphics and data structures in the future. Need help with a specific part of the code, or
Usually, "Checkerboard V2" asks you to print a grid of alternating characters (like ' ' and '*') to form a checkerboard pattern.
The Checkerboard V2 exercise is an excellent way to practice:
Once you understand the toggle-and-reset pattern, you can adapt this code to draw any tile-based pattern (chessboards, game boards, pixel art, etc.).
Happy coding! 🧩
Have questions or an alternate solution? Drop a comment below!
SQUARE_SIZE correctly.System.out.println((row+col)%2);Once you pass 9.1.7, you’re ready for even cooler graphics exercises — like drawing a chessboard with pieces, or an animated checker game.
Happy coding, and good luck on your CodeHS journey!
Did this help? Share your own Checkerboard V2 tips or questions in the comments below.
Building the 9.1.7 Checkerboard V2 program in CodeHS is all about mastering nested loops and using the modulo operator (%) to alternate colors efficiently.
In this version, we move beyond hard-coding rows to creating a dynamic grid that fills the entire canvas with a checkerboard pattern. The Logic Breakdown The Goal Usually, "Checkerboard V2" asks you to
To get this right, you need to think in terms of rows and columns:
Nested Loops: Use an outer loop to move down the rows and an inner loop to place squares across the columns.
Alternating Colors: Instead of checking just the column index, we look at the sum of the row and col indices. If (row + col) % 2 == 0, color the square red. Otherwise, color it black.
Positioning: Each square's x position is col * SQUARE_SIZE and its y position is row * SQUARE_SIZE. The Code Solution (JavaScript/karel) javascript
/* This program draws a full checkerboard on the screen. * It uses a constant for square size to make it dynamic. */ var SQUARE_SIZE = 40; function start() // Calculate how many rows and columns fit on the screen var rows = getHeight() / SQUARE_SIZE; var cols = getWidth() / SQUARE_SIZE; for(var r = 0; r < rows; r++) for(var c = 0; c < cols; c++) drawSquare(r, c); function drawSquare(row, col) var x = col * SQUARE_SIZE; var y = row * SQUARE_SIZE; var rect = new Rectangle(SQUARE_SIZE, SQUARE_SIZE); rect.setPosition(x, y); // The magic logic: if the sum of row and col is even, it's red if((row + col) % 2 == 0) rect.setColor(Color.red); else rect.setColor(Color.black); add(rect); Use code with caution. Copied to clipboard Pro-Tips for Success
Constant Usage: Always use SQUARE_SIZE instead of typing 40 everywhere. This makes it easy to change the board's density later.
Screen Bounds: Using getWidth() and getHeight() ensures your checkerboard fills the entire canvas regardless of the window size.
Modulo is King: The (r + c) % 2 trick is the industry standard for creating grid patterns—it’s much cleaner than using multiple if/else statements for odd/even rows.
Need help debugging a specific error in your grid? Let me know what your console is saying!
9.1.7: Checkerboard V2 is a fundamental test of your ability to manipulate 2D lists (nested lists) using nested loops and conditional logic. While V1 typically focuses on simple row replacement, V2 requires a precise alternating pattern of 0s and 1s across the entire grid. Core Logic: The Alternating Pattern The primary challenge is ensuring that if a cell at (row, col) is a 1, the adjacent cells (up, down, left, right) are 0s. The Modulus Trick
: A common expert strategy is to check if the sum of the current row index and column index is even or odd. (row + col) % 2 == 0 , set the value to 1. Otherwise, keep it as 0. Assignment Requirement autograder often strictly requires you to use an assignment statement board[i][j] = 1 ) rather than just printing the pattern directly. Step-by-Step Implementation Review Initialize the Board
: Create an 8x8 grid (a list of 8 lists, each containing 8 zeros). ): board.append([ Use code with caution. Copied to clipboard Nested Loop Iteration loops to visit every coordinate. Conditional Check : Use the modulus operator to determine which cells to flip. : board[r][c] = Use code with caution. Copied to clipboard Displaying the Result
: Use a helper function or a final loop to print the board row by row so it looks like a grid rather than a single long list. Common Pitfalls Static Row Building Nested loops Boolean state toggling Coordinate math for
: Users often try to build a "1,0,1,0" list and a "0,1,0,1" list and append them alternately. While this works for the visual output, it may bypass the lesson's goal of teaching index-based assignment. Indentation Errors
: In Python, improper indentation inside nested loops is the most frequent cause of "Syntax Error" or incorrect patterns. Hardcoding
: Avoid manually typing out all 64 values. The exercise is designed to test your mastery of loops. specific error message you're seeing, or should we walk through the print_board function
It looks like you're asking for the solution or an explanation for the Checkerboard V2 problem (Exercise 9.1.7) on CodeHS.
Since I don't have access to your specific instance of the problem (which usually involves a specific width, height, or starting color), I will provide the standard logic used to solve this problem in Python. This logic works for any version of the problem.
import acm.graphics.*; import acm.program.*; import java.awt.*;public class CheckerboardV2 extends GraphicsProgram
private static final int NUM_ROWS = 8; private static final int NUM_COLS = 8; public void run() double sqWidth = (double) getWidth() / NUM_COLS; double sqHeight = (double) getHeight() / NUM_ROWS; for (int row = 0; row < NUM_ROWS; row++) for (int col = 0; col < NUM_COLS; col++) double x = col * sqWidth; double y = row * sqHeight; GRect square = new GRect(x, y, sqWidth, sqHeight); square.setFilled(true); if ((row + col) % 2 == 0) square.setFillColor(Color.BLACK); else square.setFillColor(Color.RED); add(square);
public class CheckerboardV2 public static void main(String[] args) int size = 8;for (int row = 0; row < size; row++) for (int col = 0; col < size; col++) if ((row + col) % 2 == 0) System.out.print("# "); // Black square else System.out.print(" "); // Two spaces for red/white // Move to next line after each row System.out.println();
Output:
# # #
# # #
# # #
...
(Note: You can replace "# " and " " with colored console codes if supported.)
// Set the size of the checkerboard
var squareSize = 50;
var rows = 8;
var cols = 8;
// Create the canvas
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
// Function to draw a square
function drawSquare(x, y, color)
ctx.fillStyle = color;
ctx.fillRect(x, y, squareSize, squareSize);
// Draw the checkerboard
for (var row = 0; row < rows; row++)
for (var col = 0; col < cols; col++)
// Alternate between light and dark colors
var color = (row + col) % 2 === 0 ? 'lightgray' : 'gray';
drawSquare(col * squareSize, row * squareSize, color);