CSET-115 Tech Requirements & Data Structures

Week 1: The Document Object Model

Main Objective: To learn how to interact with the DOM using JavaScript.

Lessons:

1. Readings:
   • MDN Guide: A first splash into JS
   • Eloquent JS: JavaScript and the Browser
   • Eloquent JS: The Document Object Model
2. Data Structures

Project:

This project is a little different. Being a professional developer isn't always about building new solutions, it's often about going back to improve on old ones. So this project is up to you. Pick a project from the recent week's that you want to improve. Take a few minutes to write a list of what could be improved and then post it to your group's channel in Slack.

If you get a thumb's up from me, it's a quality idea. I might also reply to it with some other things you want to think about. Then it's up to you to give it a shot! Don't start from scratch, try to "refactor" the existing code (look it up if you don't know what that word means).

By Monday morning, reply to your original list with your progress. Share a link to the code if you can. Did you complete your goals? If you did, how so? If you didn't, what prevented you? I'm grading this project as a simple letter grade based on the level of effort you put in to learn new things and improve on your own.

Assessment:

Follow these guidelines to answer the following questions. Due at the end of class on Friday, October 23^rd. Remember this is CSET-115, so your file should be at the following path: cset/115/assessment-1.md.

• Now that you've spent a few weeks working on longer projects, how do you think you'll adapt to working in the professional world?
• Imagine you are building your Choose-Your-Own-Adventure project in JavaScript for the browser. The user has clicked a button to select which room to enter, walk through how you would manipulate the page to show the next room's description. Explain the DOM methods you would use and why.
• Why are different data structures useful? Use the Document Object Model as an example. Would it work as any structure other than a tree?

Reference:

• MDN: Introduction to the DOM - Overview of DOM types and interfaces.
• MDN: DOM Node - The basic building block of the DOM.
• MDN: DOM Element - DOM Nodes that represent HTML Elements.

More Resources:

• FreeCodeCamp: Top data structures you should know for your next coding interview