BTI220 Web dev resources

The following resources will help you succeed in this course

.

Tooling and infrastructure

Firefox – developer tools start page

Chrome – developer tools start page

Internet Explorer 10 – developer tools start page

Safari – developer tools start page

FYI – web servers – the LAMP stack, and the Microsoft Web Platform

Soon…

JSLint – the JavaScript code quality tool

JSFiddle – an online playground for web developers
(read an interview with its creator, Piotr Zalewa)

(more to come)

.

Internet architecture

The Internet, and the Web, described in Wikipedia

From W3C, the history of the Internet and the Web, and how they work

Weaving The Web, by Tim Berners-Lee, inventor of the Web, HTTP, and HTML

RFC 2616, the standard for HTTP; describes how the Web works
(the most important document for web programmers!)

This November 2014 Paul Ford article in The New Yorker describes a part of the governance structure for HTML5. Very interesting, and a recommended read.
On HTML5 and the Group that Rules the Web

.

Guidance

John Allsopp
A Dao of Web Design (April 2000)

Ethan Marcotte
Responsive Web Design debuts (April 2010)

ALA Staff
15 Years of Dao (April 2015)

.

Online documentation collections

DO NOT use a search engine to locate results – you’re not skilled enough yet to evaluate the quality and usefulness of the results. Instead, use trusted and/or authoritative sources for search results. Here are some suggestions:

W3C – World Wide Web Consortium, community education

W3C Community Education

WebPlatform.org

WebPlatform.org

Mozilla Developer Network (MDN)

Mozilla Developer Network

HTML5 Rocks (a Google project)

HTML5 Rocks

WaSP – Web Standards Project

Web Standards Project

WHATWG – Web Hypertext Application Working Group

WHATWG

Microsoft Developer Network (MSDN) – JavaScript start page

Microsoft MSDN

Wikipedia

Wikipedia

StackOverflow

Stack Overflow

.

DO NOT use content from W3Schools. The web site is not authoritative. Some of its coverage is out of date. Its existence and business model is not compatible with the needs of a web programming student. A full argument is here. Here’s another article by Louis Lazaris.

Contact me if you would like to suggest a resource.

.

JavaScript

Wikipedia – JavaScript

Online home and blog of Brendan Eich, creator of JavaScript (also described in Wikipedia)

Some JavaScript history, by Brendan Eich

MDN – JavaScript start page

MDN – JavaScript guide for programmers who are new to JavaScript

MDN – A re-introduction to JavaScript (for those who have old knowledge)

MDN – JavaScript tutorials page

MDN – JavaScript reference page

Crockford – A Survey of the JavaScript Programming Language

Crockford – JavaScript Code Conventions

…more JavaScript resources are here

.

HTML

Wikipedia – HTML

MDN – HTML start page of topics

MDN – Introduction to HTML

MDN – HTML Element Reference

(more to come)

.

The HTML DOM (Document Object Model)

Wikipedia – The HTML Document Object Model

MDN – DOM start page of topics

MDN – DOM Reference (for interfaces including Document, Element, Event, Node, NodeList, Text, Window)

(more to come)

.

CSS

Basics, foundations, essentials 

Wikipedia – CSS

MDN – CSS start page of topics

MDN – Getting Started With CSS (tutorial series)

MDN – CSS reference

(more to come)

Layout – basics, and modern approaches 

ALA – CSS Positioning 101

Dynamic Drive – CSS Layouts start page

(more to come)

Menus and navigation 

Building a Nav Menu

(more to come)

Responsive – print

Smashing Magazine – How To Set Up A Print Style Sheet

Create a Customized Print Stylesheet in Minutes

Responsive – mobile

Web Style Guide, chapter 7, Document Design

A List Apart, Responsive Web Design

MDN – CSS media queries

Techniques 

MDN – DOM – Dynamic styling

MDN – JavaScript and CSS

Essential Considerations for Crafting Quality Media Queries

.

JSON – JavaScript Object Notation

JSON.org

.

.

.

  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: