Instructor: Brett Ritter <[email protected]>
This course covers the essentials of front-end web development in terms of User Interaction/User Experience (UI/UX). This will NOT teach you to be a designer, but will give you the building blocks to work with designers (or decide you want to learn more about Human/Computer Interaction (HCI). It will also not teach you all the steps to perform full web development (see INFO6250 for that) but will give you the basis to be effective at UI/UX design and implementation for web development.
Some of what we cover
- Basic git use as a version control system for shared applications and development
- How a web page is rendered in the browser
- Fundamental HTML and CSS
- Semantic HTML (HTML5)
- Different approaches to styling with CSS, their pros and cons
- mobile-first design
- responsive and adaptive design
- basic accessibility(a11y) concerns
- Common UI patterns and their impact on UX
- in-depth JavaScript (JS)
- in-depth backend coding
- SQL/NoSQL usage or database architectures/maintenance
15% Assignments (lowest score ignored)
10% Quizzes (lowest score ignored)
25% Project: HTML and CSS
25% Project: With Javascript
25% Final Project: React
- Basic exposure to programming concepts (variables, functions, looping) is assumed
- You will have to use git and github.com following the instructions given
- There is no textbook for the class, but a number of online articles will be shared.
- Many topics will be introduced in class but require you to perform additional research/experimentation
- Additional software (without cost) is required. Installation and configuration is your responsibility (Mac, Windows, or *nix)
- Students should ask questions where anything is unclear
- A great deal of work will be done online, in and out of class
Thu Sep 8, Thu Sep 15, Thu Sep 22, Thu Sep 29, Thu Oct 6,
- The roles of HTML/CSS/JS
- Navigation between pages and sites
- Semantic HTML, MDN, The Browser Wars, evergreen browsers, the unreliability of not-that-old information
- CSS Fundamentals: inline vs block, responsive rendering
- CSS approaches: semantic, BEM, utility-first
- Layout with CSS: flexbox vs grid
- Accessibility (a11y)
- Multi-column Grids
- Common UI Patterns
Wed Oct 12, 11:59pm ET
Thu Oct 13, Thu Oct 20, Thu Oct 27, Thu Nov 3,
- Browser JS Intro
- Validation
- Interactive UI Components
Wed Nov 9, 11:59pm
Thu Nov 10, Thu Nov 17, NOT Thu Nov 24 (Holiday) Thu Dec 1, Thu Dec 8
- Intro to React
- Deeplinking
- Wireframes and Mockups
Sun Dec 11, 11:59pm ET
No class Thu Dec 15 (just Project due on Sun Dec 11)