GitHub Pages

Overview

Udacity guided me through all of my steps in programming and web development, and then some more beyond that.

First, I enrolled in their Nanodegree program for front-end web developers, and graduated in July of 2015.

Then I was hired by Udacity to help educate newly-enrolled students in the same program. I worked successfully as a Student Guide, and as a Forum Mentor — and I have a letter of recommendation proving that I did good work for them, for about 9 months, in these capacities.

Now I am freelancing and building my skills up independently.

The Nanodegree: A credential, and the source of my first work portfolio.

You can read Udacity's description of the Front-End Web Developer nanodegree here.

The syllabus at that link describes the courses and projects I completed to earn this credential.

But, following below, I will give my own descriptions of what I did, with links.

Project 1: Produce A Web Page From A Design Mock-up

Courses completed	Summary of what I learned
Intro to HTML and CSS	The syntax of HTML and CSS The "Box Model" building block of web page elements CSS Grid Layouts, with Twitter Bootstrap Flexbox layouts
Responsive Web Design Fundamentals	The reasons for "mobile-first" development Best practices for mobile-first web development Using CSS media queries and break-points to respond to larger and larger screens Common, effective, responsive layout patterns
Responsive Images	Every measurement unit images can come in, and be layed out on the page in The relative strengths of vector images, when compared with raster When to use compression and other optimization techniques for images When CSS can be made to render images in amazing and fluid ways When unicode symbols and icon fonts can be used in place of an image Using SVG and data-URIs to inline images inside HTML Modern HTML5 techniques for responsive images: srcset, sizes, and picture

Project 2: Build A Résumé Webpage, From Template and Data

Courses completed	Summary of what I learned
JavaScript Basics	This was entry-level JavaScript... ...but I'm so fluent in JS now... ...that everything in this course is way-too-easy-to-mention! See the "ReadMe" link above for my thoughts on how to improve this app with ES6
Intro to jQuery	I know jQuery very well now too, beyond the limited basics that this course teaches

Project 3: Build A Game Using Object-Oriented JavaScript

Courses completed	Summary of what I learned
Object Oriented JavaScript	How variable closure works in JS, common pitfalls to avoid with closures How the keyword "this" works in JS, and common pitfalls to avoid with it How prototypal inheritance lets JS do what it does efficiently How prototypal inheritance can be used to do what traditional Object-Oriented programming does
The HTML5 Canvas Element	The HTML5 "canvas" element is very powerful, and has an entire native API built for it... ...we learned to do the basics with it... ...then built a "meme maker" app to let users add their words onto any image file

Project 4: Optimizing Websites For Rendering and Network Peformance

Courses completed	Summary of what I learned
Website Performance Optimization	The order in which a browser receives certain plain-text assets over the network matters a great deal for the time it takes to render the page How the browser processes code into a visual web page is complicated, but understandable How such code-processing can result in optimal or non-optimal page load times This course taught me many, many technical details, which I do remember, and which do matter for the business of delivering good user experience
Browser Rendering Optimization	How to use browser developer tools to measure page-rendering operation times... ...and then spot the ones that are currently preventing fluid animations, and then correct them Minimum User Experience standards levels (what is the longest allowable time for page loading, rendering, and response for all users) How to debug mobile web browser performance over USB on our desktops In JavaScript: requestAnimationFrame, coding your thread-blocking JS for minimum time cost, and memory management Using the Web Worker API to put long-running JS off of the main computation thread And many, many details about CSS and efficient browser rendering

Courses completed

Summary of what I learned

Website Performance Optimization

The order in which a browser receives certain plain-text assets over the network matters a great deal for the time it takes to render the page
How the browser processes code into a visual web page is complicated, but understandable
How such code-processing can result in optimal or non-optimal page load times
This course taught me many, many technical details, which I do remember, and which do matter for the business of delivering good user experience

Browser Rendering Optimization

How to use browser developer tools to measure page-rendering operation times...
...and then spot the ones that are currently preventing fluid animations, and then correct them
Minimum User Experience standards levels (what is the longest allowable time for page loading, rendering, and response for all users)
How to debug mobile web browser performance over USB on our desktops
In JavaScript: requestAnimationFrame, coding your thread-blocking JS for minimum time cost, and memory management
Using the Web Worker API to put long-running JS off of the main computation thread
And many, many details about CSS and efficient browser rendering

Project 5: Build A Single-Page JS Application

Courses completed	Summary of what I learned
Intro To Ajax	Client and server dichotomy Synchronous versus asynchronous JS statements Why asynchronous data service calls enable the best modern webapps Using jQuery for AJAX requests Avoiding cross-origin "cors" errors Using any of the many third-party API services
JavaScript Design Patterns	Why long-term development and changing project requirements require effective design patterns Why "frameworks" will save you time and provide you effective design patterns for long-term development How to structure a client-side single-page JS app with Model-View-Controller "MVC" architecture When to re-factor a codebase for a growing app Why you'll always need to be learning new ways of doing things in web development