Tuesdays 6:00 - 9:00 PM
Room V107
Course Alignment
General Education Outcomes are the knowledge, skills, abilities, attitudes, and behaviors that students are expected to develop as a result of their overall experiences with any aspect of the college, including courses, programs, and student services, both inside and outside of the classroom. The General Education Outcomes specifically learned in this course are:
- Communication
Goals
Build a working website and prototype.
Objectives
Upon completion of this course, you will:
1. Develop basic web pages using basic coding.
2. Develop a website.
3. Choose and manage images effectively in regard to web pages and
site development.
4. Have a working knowledge of HTML and CSS coding.
5. Be able to update, maintain, and publish a live website.
6. Use and understand basic principles of effective web design.
7. Design and create a basic web prototype.
8. Test and share an active prototype compatible with all devices
Faculty Contact Information
I will be in class one half hour before class begins.
Amber Gocken
agocken@kcc.edu
Course Information
At the end of this course, students will be able to:
- Develop basic web pages using Adobe Dreamweaver Creative Cloud.
- Develop a website.
- Choose and manage images effectively in regard to web pages and site development.
- Have a working knowledge of HTML and CSS coding using Adobe Dreamweaver Creative Cloud
- Be able to update, maintain, and publish a live website
- Use and understand basic principles of effective web design.
- Welcome to XD and Intro to Web Design
- Setting Up a Project/Creating and Importing Graphics
- Adding Images and Text/Organizing Content
- Working with Assets and CC Libraries/Using Effects, Repeat Grids and Responsive Resize
- Creating a Prototype/Previewing a Prototype
- Sharing Documents, Prototypes and Design Specs/Exporting and Integration
- Customizing Your Workspace/HTML Basics
- CSS Basics
- Web Design Basics/Creating a Page Layout
- Working with Templates
- Working with Text, Lists and Tables
- Working with Images
- Working with Navigation
- Adding Interactivity
- Publishing to the Web
- Working with Code
- Final Presentation of Your Working Website
We are learning through zyBooks. You
must purchase a subscription through the
bookstore.
1. Click any zyBooks assignment link in
your learning management system
(Do not go to the zyBooks website and
create a new account)
2. Subscribe
Software Requirements
This course will require a high-speed Internet connection for Canvas and
zyBooks. There is no software to purchase, you may work in the KCC Mac lab,
V107. You may work in the Mac lab when there is no class in session.
Program Grading Scale
Grade Points
A 900-1000
B 800-899
C 700-799
D 600-699
F 599 or less
Point Distribution
Assignments..... ................................................................690 points
zy Book
Quizzes .............................................................................100 points
Discussion................................................................... 100 points
Final Presentation............................................................110 points
Business, Technology & Human Services
Dean, Paul Carlson; 815-802-8858; V105; pcarlson@kcc.edu; Division Office – W102; 815-802-8650
Time Commitment Expectation
At a minimum, the average person can expect to spend two to four
additional hours outside of class. This time will be dedicated to reading
the textbook chapter(s), studying for quizzes and tests, and practicing
zyBook techniques.
Student Expectations
•Canvas: Students are expected to login to Canvas each week for
additional learning content. Instructional material will be made through
Canvas. Students must have access to a high-speed Internet connection
for successful completion of this course. KCC email and/or Canvas will be
used to deliver Web site addresses, test dates, assignment directions/due
dates, etc.
•Keep all work from each assignment/project. Assignments and
projects from this course will also be likely additions to your portfolio in
the future.
•Syllabus: Students should read/review the Syllabus and Course
Calendar to become familiar with instructorʼs policies and course content.
•Gmail: correspondence should be via KCC student Gmail accounts.
•Announcements: Log-in and check Canvas often.
•Assignments: Check Canvas weekly for assignments. Weeks begin on
Tuesdays (Day 1) and end on Mondays (Day 7)
Week 1 January 13 Welcome and Intro to Web Design
LEARNING OBJECTIVES:
• What is a zyBook?
• Register your subscription
ACTIVITIES:
Review syllabus
Review Canvas and Introduce zyBooks
Week 2 January 20 – Introduction to Web
Programming
LEARNING OBJECTIVES:
• 1.1 Web history
• 1.2 IP addresses, domain names, and URLs
• 1.3 HTTP
• 1.4 Web trends
• 1.5 Introduction to HTML
• 1.6 Introduction to CSS
• 1.7 Introduction to JavaScript
ACTIVITIES:
Complete Participation Activities and
Challenge Activities in Chapter 1
Week 3 January 27 – HTML Fundamentals
LEARNING OBJECTIVES:
I2.1 HTML document structure
2.2 HTML sandbox
2.3 Basic HTML elements
2.4 Comments
2.5 Images
2.6 Links
2.7 Lists
2.8 Tables
2.9 Special characters
2.10 Example: Band webpage
ACTIVITIES:
Quiz 1
Complete Participation Activities and Challenge Activities in Chapter 2
Assignment #1 – LAB | Due Week 4 by 6 PM
Week 4 February 3 – More HTML
LEARNING OBJECTIVES:
3.1 HTML containers
3.2 Forms
3.3 Common form widgets
3.4 Additional form widgets
3.5 Audio and video
3.6 <script> and <style>
3.7 HTML developer guidelines
3.8 Example: Restaurant Reviews
ACTIVITIES:
Complete Participation Activities and Challenge Activities in Chapter 3
Assignment #2 – LAB | Due Week 5 by 6 PMWeek 5 February 10 – CSS Fundamentals
LEARNING OBJECTIVES:
4.1 Using CSS in HTML
4.2 CSS sandbox
4.3 Basic selectors
4.4 Advanced selectors
4.5 Common properties
4.6 Font and text properties
4.7 Box model
4.8 Example: Styled band webpage
ACTIVITIES:
QUIZ 2
Complete Participation Activities and Challenge Activities in Chapter 4
Assignment #3 – LAB | Due Week 6 by 6 PM
Week 6 February 17 – More CSS
LEARNING OBJECTIVES:
5.1 Flexbox
5.2 Grid layout
5.3 Positioning elements
5.4 Special effects
5.5 Animation
5.6 Styling forms
5.7 Sass
5.8 Example: Styled Restaurant Reviews
ACTIVITIES:
Complete Participation Activities and Challenge Activities in Chapter 5
Assignment #4 – LAB | Due Week 7 by 6 PMWeek 7 February 24 – JavaScript Fundamentals
LEARNING OBJECTIVES:
6.1 Syntax and variables
6.2 JavaScript sandbox
6.3 Arithmetic
6.4 Conditionals
6.5 More conditionals
6.6 Loops
6.7 Functions
6.8 Scope and the global object
6.9 Arrays
6.10 Objects
6.11 Maps
6.12 String object
6.13 Date object
6.14 Math object
6.15 Exception handling
ACTIVITIES:
QUIZ 3
Complete Participation Activities and Challenge Activities in Chapter 6
Assignment #5 – LAB | Due Week 8 by 6 PM
Week 8 March 3 - JavaScript in the Browser
LEARNING OBJECTIVES:
7.1 Using JavaScript with HTML
7.2 JavaScript in the browser sandbox
7.3 Document Object Model (DOM)
7.4 More DOM modification
7.5 Event-driven programming
7.6 Timers
7.7 Modifying CSS with JavaScript
7.8 Form validation
7.9 JavaScript Object Notation (JSON)
7.10 XMLHttpRequest (Ajax)
7.11 Using third-party web APIs (JavaScript)
7.12 Browser differences: JavaScript
7.13 Example: Lights Out game
7.14 Example: Weather Comparison (XMLHttpRequest)ACTIVITIES:
Complete Participation Activities and Challenge Activities in Chapter 7
Assignment #6 – LAB | Due Week 9 by 6 PM
March 10 Spring Break – No Classes!
Week 9 March 17 - More JavaScript
LEARNING OBJECTIVES:
8.1 Regular expressions
8.2 Classes
8.3 Classes (ES6)
8.4 Classes (ES13)
8.5 Inner functions, outer functions, and function scope
8.6 Closures
8.7 Modules
8.8 Strict mode
8.9 Web storage
8.10 Canvas drawing
8.11 Canvas transformations and animation
8.12 WebSockets
8.13 Promises
8.14 async and await
8.15 Fetch API
8.16 Example: Lights Out game with canvas
8.17 Example: Weather Comparison (fetch)
ACTIVITIES:
Complete Participation Activities and Challenge Activities in Chapter 8
Assignment #7 – LAB | Due Week 10 by 6 PM
Week 10 March 24 - Mobile Web Development
LEARNING OBJECTIVES:
• 9.1 Mobile websites and browsers
• 9.2 Mobile development tools
• 9.3 Viewport
• 9.4 Media queries
• 9.5 Responsive images
• 9.6 Bootstrap
• 9.7 Example: Responsive band webpagetACTIVITIES:
Complete Participation Activities and Challenge Activities in Chapter 9
Assignment #8 – LAB | Due Week 11 by 6 PM
Week 11 March 31 - Node.js
LEARNING OBJECTIVES:
• 0. Node.js
• 10.1 Full-stack development (Node)
• 10.2 Getting started with Node.js
• 10.3 Node.js sandbox
• 10.4 Express
• 10.5 Express request data
• 10.6 Pug
• 10.7 Relational databases and SQL (Node)
• 10.8 MySQL (Node)
• 10.9 MySQL module
• 10.10 MySQL2 module
• 10.11 MongoDB
• 10.12 Mongoose
• 10.13 VS Code
• 10.14 RESTful web APIs: Part 1 (Node)
• 10.15 RESTful web APIs: Part 2 (Node)
• 10.16 Using RESTful web APIs with Fetch
• 10.17 Third-party web APIs (Node)
• 10.18 Token-based user authentication (Node)
• 10.19 Password hashing (Node)
ACTIVITIES:
Complete Participation Activities and Challenge Activities in Chapter 10
Assignment #9 – LAB | Due Week 12 by 6 PM
Week 12 April 7 - React
LEARNING OBJECTIVES:
11.1 Getting started with React
11.2 React sandbox
11.3 JSX
11.4 Components
11.5 Event handling
11.6 State
11.7 Conditional rendering
11.8 Lists (React)
11.9 Forms (React)
11.10 Example: Todo List
11.11 Router
11.12 Styling
11.13 React Bootstrap
11.14 Fetching data
11.15 Example: Message Board back-end
11.16 Example: Message Board front-end (Part 1)ACTIVITIES:
Complete Participation Activities and Challenge Activities in Chapter 11
Assignment #10 – LAB | Due Week 13 by 6 PM
Week 13 April 14 - jQuery
LEARNING OBECTIVES:
12.1 Getting started with jQuery
12.2 Selectors
12.3 Events
12.4 Styles and animation
12.5 DOM manipulation
12.6 Ajax
12.7 Using third-party web APIs (jQuery)
12.8 Using RESTful web APIs with jQuery
12.9 Plugins
12.10 Example: Weather Comparison (jQuery)
ACTIVITIES:
Complete Participation Activities and Challenge Activities in Chapter 12
Assignment #11 – LAB | Due Week 14 by 6 PM
Week 14 April 21 - PHP Fundamentals
LEARNING OBJECTIVES:
• 13.1 Full-stack development (PHP)
• 13.2 Getting started with PHP
• 13.3 PHP sandbox
• 13.4 Arithmetic and comparisons (PHP)
• 13.5 Conditionals (PHP)
• 13.6 Loops (PHP)
• 13.7 Arrays (PHP)
• 13.8 Functions (PHP)
• 13.9 Includes (PHP)
• 13.10 Classes and objects (PHP)
• 13.11 String, date/time, and math functions (PHP)
• 13.12 Submitting forms (PHP)
• 13.13 Form validation and sanitation (PHP)
ACTIVITIES:
Complete Participation Activities and Challenge Activities in Chapter 13
Assignment #12 – LAB | Due Week 15 by 6 PMWeek 15 April 28 - Relational Databases
and SQL
LEARNING OBJECTIVES:
15.1 Relational databases
15.2 Structured Query Language
(SQL)
15.3 SQL sandbox
15.4 Creating, altering, and deleting
tables
15.5 Inserting rows
15.6 Selecting rows
15.7 SQL functions
15.8 Joining tables
15.9 Updating and deleting rows
ACTIVITIES:
Complete Participation Activities and Challenge Activities in
Chapter 15
Assignment #13 – LAB | Due Week 13 by 6 PM
Week 16 May 5 - Work on Presentation
ACTIVITIES:
Work on Final Presentation
Finals Week May 12 Final Presentation
ACTIVITIES:
Final Presentation: Showcase your Working Website
College Policies, Resources and Supports
For information related to the Student Code of Conduct Policy, Withdrawal Policy, Email Policy, and Non- Attendance/Non-Participation Policy, please review the college’s Code of Campus Affairs and Regulations webpage, which can be found at catalog.kcc.edu under the Academic Regulations & Conduct Guide.
KCC offers various academic and personal resources for all students. Many services are offered virtually, as well as in person. Please visit Student Resources - Kankakee Community College to access student resources services such as:
- Clubs and organizations
- Counseling and referral services
- Office of disability services
- Student complaint policy
- Transfer services
- Tutoring services, etc.
The materials on this course are only for the use of students enrolled in this course for purposes associated with this course. Further information regarding KCC's copyright policy is available at https://kcc.libguides.com/copyright.
|Course syllabus/calendar is subject to change.