Notes to prepare for the Thinkful tech evaluation

tech-eval-notes.md

HTML

Front-end first steps

• Creating HTML and CSS files, and linking to a CSS file inside of HTML
• Structuring a simple project folder
• Using VS Code to create and edit files
• Inserting the boilerplate code that all HTML pages need

HTML the right way

• Describing the difference between HTML elements, tags, and attributes
• Explaining what is meant when people say HTML is about structure (vs. presentation or behavior)
• Explaining and using semantic HTML
• Inspecting and manipulating HTML using DevTools
• Learning new HTML elements
• Taking content and structuring it into well formed, semantic HTML
• Explaining what a11y is and describing and following basic a11y best practices

CSS

CSS the right way

• Describing the different parts of a CSS ruleset (selector, declaration block, declarations, properties, values)
• Explaining what is meant when people say CSS is about presentation
• Explaining the box model
• Inspecting and manipulating CSS using DevTools
• Learning new CSS properties
• Solving basic CSS problems like setting background colors, font colors, width, height, etc.
• Using a wide variety of CSS selectors to target HTML elements

CSS layouts

• Explaining and implementing horizontal centering for inline and block-level elements
• Explaining and using the display: block vs. display: inline-block vs. display: inline
• Explaining the so-called "white space" problem and how to solve it
• Explaining and using position: static vs. position: relative vs. position: fixed vs. position: absolute
• Explaining and using the float property to get text to wrap around images or other content
• Coding up a wide range of layouts from designs

Forms and inputs

• Following accessibility best practices for forms
• Validating form inputs
• Creating and describing form and form elements
• Learning new input types

Responsive design basics

• Explaining the principles of responsive design (mobile-first, content-driven, responsive)
• Using media queries to override default styles
• Analyzing and explaining the float: left approach to implementing a responsive grid
• Coding up designs that call for more than one layout, depending on the width of the viewport

Command-line, Git, and GitHub

Command-line basics

• cd
• pwd
• ls
• mkdir
• touch
• rm
• rmdir
• mv
• copy

Version control with Git

• Explaining what Git is, and why it is important
• Explaining what we mean when we say that Git allows you to take snapshots of your code
• Explaining what we mean when we say that Git allows you to create, compare, and merge branches
• git init
• git add
• git commit
• git status
• git diff
• git checkout
• git reset
• git branch
• git merge

Working with GitHub

• Cloning remote repositories
• Pushing a local repository to a remote repository on GitHub
• Keeping remote and local repositories in sync
• Working with branches and making pull requests on GitHub
• Publishing static web pages using GitHub pages

Programming in Javascript

Introduction to Javascript

• Explaining what it means when we say that individual browsers implement the Javascript specification
• Linking to external Javascript files in your HTML
• Creating variables with let
• Creating constants with const
• Recognizing Javascript's 6 data types when you see them in code you're reading. Should be able to recognize all 7 names
• Using the Javscript console to execute, debug, and inspect code

Functions, Strings, and Numbers

• Explaining what a function is
• Declaring and invoking functions in Javascript
• Using built-in string methods like .length
• Manipulating strings
• Doing basic arithmetic in Javascript

Application logic

• Explaining the idea of "truthiness" in Javascript
• Using logical operators and expressions
• Explaining what control flow is
• Using conditionals (if, else, else if) to achieve control flow
• Using try/catch blocks to handle errors

Arrays and loops

• Memorize the syntax for for loops, as well as the syntax for interacting with arrays

Scope and the problem with globals

• Explaining what scope is, and the difference between global and local scope
• Explaining why global variables are to be avoided
• Using strict mode to limit unintended globals
• Explaining what side effects and pure functions are

Objects

• Working with objects
• Using factory functions to create instances of a model object
• Explaining the difference between an object method and object property
• Explaining why you need to be careful when passing objects as an argument to a function
• Using the this keyword in object literals to achieve self-referentiality in your code