For my phase 2 project, I have created a web journal where users can store and read back on journal entries.

When the user first opens the app, they are presented with a random journal entry. The journal displayed is stored in state; when the “Random Button” button is clicked…


The API that I picked is the Bored API, which is a REST API, the stated purpose of which can not be stated any more accurately than on their about page:

Due to the nature of the API, all data is presented in JSON format and all input has to…


Breaking the bricks: Detecting collision with our projectile between the bricks, paddle and edges

At this point, we should take a moment to pat ourselves on the back. We’ve got a game being generated entirely from code, the projectile moves and we can control the paddle; we’ve accomplished a lot…


Putting it all together: Creating the game class and as a result, a game.

Let’s start by thinking about or game class like the game itself. When the game starts, what should it be doing. This question is almost exactly the same as asking what should be in the constructor…


Work site organization: Restructuring the code in preparation for a fully functioning game.

In the last article, I said that we would be getting the projectile moving in this one. I might have lied, forgive me. …


Installing Light Switches - Creating a Response to User Interaction

Ok, so we have all of the elements showing on screen in their proper places and some of them are even being generated by JavaScript that we wrote. While seeing your code work is one of the best feelings, it’s…


Laying the Brickwork

Ok, today is the day! we’re putting bricks into our Brickbreaker game. As mentioned in previous articles in this series, We’ll be creating the bricks in JavaScript; Here’s the code that does it.

function generateBricks(){
const numberOfBricks = 60;
let brickContainer…

Building walls and laying paint with CSS

When we left off at the end of part one, we had our basic elements of the game laid out in HTML, but the computer has no idea what they’re supposed to look like so it shows nothing; let’s change that using CSS.


Laying the Foundation with HTML

On June 7th, 2021 I started the part time software engineering program with Flatiron School(woohoo!). This is a full stack web developer program, which focuses on Javascript for the client side scripting, so I’m going to use what I learn to create a Brickbreaker-like game…

Nate McGraw

Software Engineering student at Flatiron School by night, Help Desk Analyst by day

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store