It’s Thanksgiving week and we have Wednesday - Friday off to spend with families and friends! This week I started working on my project (which you’ll soon enough see!!) and our instructors gave us the option of learning electives. Let’s get started!


Day 1: Project && HTML5 Canvas

Work on Project 5.5 Hours

Need a reminder on what project 4 is all about? No worries.

We get to call the shots and invent our own idea, choosing a framework & tools that are appropriate for whatever we want to build. Pulling from everything we’ve learned so far, and try to tackle something that will push us a little outside of our comfort zone.

Technical Suggestions

The app must:

  • Be a complete product, which most likely means multiple relationships and CRUD functionality for at least a couple models
  • Implement thoughtful user stories that are significant enough to help you know which features to build and which to scrap
  • Be deployed online so it’s publicly accessible

HTML5 Canvas: Elective 2.5 Hours

html5 canvas

Learning Objectives

  • Explain what canvas is and why we use it
  • Draw graphics using a 2d context
  • Build a game using canvas

The HTML5 canvas element is used to draw graphics, using JavaScript. It was designed by Apple in 2004.

You can, and you should, check out the following canvas demos:

Pretty neat stuff, huh?

We finished the day by working on a mini-lab (which was not mini at all), creating the old school game, Snake.

Day 2: Outcomes && D3

Outcomes: 2.5 Hours

Today was portfolio standup day. Each student had the chance to show off our portfolio and get feedback from other students.

We weren’t expecting to have a perfect portfolio at this time, however, we needed to be able to discuss our work, our plans for completing any unfinished pieces, and our plans for after graduation.

D3: Elective 2.5 Hours

Unfortunately, I did not attend this elective because I was deep into working on my project. However, I’ll leave you with a quick intro into D3 and the learning objectives of today’s elective.

What Is D3?


D3 stands for Data-Driven Documents. The word “document” in D3 refers to the DOM. Javascript can manipulate the DOM, creating and deleting pieces of it. Building data visualizations, however, with tools that are suited for GUI programming is difficult and verbose. Enter D3.

Learning Objectives:

  • Manipulate the DOM using D3
  • Bind data to DOM elements
  • Scale data to fit the viewport
  • Use D3 helper methods like min and max

Day 3 - 5: Thanksgiving

General Assembly gave us the rest of the week off and did not expect us to work on our projects during this time. Which I was so grateful for! I was able to visit family and relax a bit for the first time since the program started.

Next week is officially our last week of WDI. In next week’s post, I’ll share with my Project 4’s Github and Demo links.

Until then!

Latoya M. Watson

Blogging about Tech and Food Stuff from Washington, D.C.