Code 201: Foundations of Software Development

Course Information

• Course Level: Code 201

Course Prerequisites

• Code 102

Students with previous relevant or equivalent experience can test out of this requirement in their application.

Course Description

This course guides students toward developing a well-rounded foundation of skills necessary for modern web development. These skills include HTML, CSS, and JavaScript coding; utilizing Git workflow processes, project organization, designing with wire-framing and employing introductory Agile development methods.

Program Learning Outcomes

Builds a strong software development foundation and learn how to use HTML, CSS, JavaScript, and various libraries to create fully-functional web apps.

This course guides students toward developing a well-rounded foundation of skills necessary for modern web development. These skills include HTML, CSS, and JavaScript coding; utilizing Git workflow processes, project organization, designing with wireframing and employing introductory Agile development methods.

Student Learning Outcomes

Upon satisfactory completion of this course, a student should be able to:

Describe and Define

Languages

HTML

• Structure
• Text
• Links
• Images
• Tables
• HTML5
• Forms
• Process
• Design

CSS

• Color
• Text
• Boxes
• Lists
• Tables
• Forms
• Grid Layouts
• Fluid Layouts
• Animations and Transitions

JavaScript

• Loops
• Conditions
• Functions
• Objects (Including Properties and Methods)
• Object-Oriented Programming
• Object Extension with Prototypes
• Events, Event Listeners, and Event Handlers in Callback Functions
• DOM Manipulation and Traversal Using "Vanilla" JavaScript without jQuery
• Utilization of an external library such as ChartJS
• Local Storage and JSON
• The Basics of MVC

Environments and Tools

• Unix and the Command Prompt
• Git and GitHub
• A Text Editor
• Chrome Dev Tools

Execute

• Define the structure of a web page utilizing the semantic hierarchical structural conventions of HTML5.
• Apply CSS to style content with color, typography, and images.
• Apply CSS and HTML to implement page layout styles including grid, fluid, and responsive techniques.
• Utilize Javascript to make web projects interactive, such that user input is stored and processed to create updated and personalized content when a user interacts with a page.
• Write JavaScript that leverages the fundamentals of Computer Science, the Object-Oriented Programming paradigm, basic data types, data structures, and basic algorithms, so that the code is efficient, error-free, and matches commonly accepted standards and practices of syntax and style, as measured by the code’s functionality and ability to pass a code linter.
• Utilize industry-standard version control tools and workflows, including Git and GitHub, to write functional, properly styled code and to work efficiently and harmoniously in professional environments.

Course Schedule

Module 1

Class #	Topic	Lab
01	Introduction to Development	Web Site with proper HTML, CSS, JavaScript Structure
02	Basics of HTML, CSS, JS	User input and output
03	Control Flow; Box Model	Conditional logic
04	Javascript Functions; Pair Programming	Encapsulate logic in functions
05	Images, Color, Style; Branching	Fidelity; Practice JS and Git branching

Module 2

Class #	Topic	Lab
06	Javascript Objects; The DOM	Generate and display data in the DOM
07	OOP; HTML Tables	Convert literals to constructors; Dynamic table output
08	CSS Layout: Flex	Wire-frame exercise; Styling
09	HTML Forms & JavaScript Events	Form input + dynamic elements
10	JS Debugging; CSS Layouts	Git Practice; JS Debugger; Generate markup from a mock-up

Module 3

Class #	Topic	Lab
11	A/V; Accessibility; Math.random()	Selecting random options and Capturing user input
12	3rd Party Libraries and Documentation	Integrating Chart.js
13	Application State with Local Storage API	Storing/Retrieving data from local storage
14	Psyhological Safety	Exploring an existing code base
15	Project Kickoff	Merge conflict practice

Module 4 - Final Project

Class #	Deliverables
16	Wireframes, User Stories, Architecture Plan, DevOps, Documentation, Agreements
17	Phase 1
18	MVP
19	Final Polish, Presentation Practice
20	Live Project Presentations