Course Syllabus
Welcome to online CS290 Web Development!
I'm Luyao Zhang. You probably already know me from CS162. I will be your instructor for this course. We also have an experienced and professional TA team working with me to support your study. We will do our best to provide you an informative and encouraging course with a great learning experience. If you have any suggestions on this course, you're welcome to contact me anytime.
NOTE: Some links on this page may only be accessible to registered students.
Topics
In this course, we will mostly talk about the front-end web development skills and a few back-end techniques. We will be covering topics like HTML, CSS, JavaScript, Node.js and Mysql. We will spend most of the time talking about JavaScript.
Tools
There are no special tools required in this course. You can use your favorite code editor for the assignment in this course. Some of the favorite code editors voted by previous students are Sublime Text, Atom and Visual Studio. You can develop your code locally and make it work on the flip for us to grade.
Course Structure
Each week's module will be posted ahead of time (on Thursday or Friday) for you to get started early. All the contents including the learning goals and requirements, reading materials and lecture videos are put into one session and you will explore them by topics.
- Assignment/Activity:
Each week you will have one or two graded assignment /activity that related to the skills covered in that week's contents and will due on Sunday night. You will learn most from writing the code on your own. The more you practice, the better you learn.
- Project:
You will do an individual project which is building a simple website from week 6 to week 8 using the skills you learn in this course and you have a lot of freedom to determine the theme of the website.
- Exam:
There is a proctored final exam at the end of the term. The exam will be open from Monday to Thursday of week 11 for normal term and week 8 for the summer term. Please reserve your proctor as early as possible to make sure you can get the time you want.
Prior Knowledge
Before starting work in this class students should know the fundamentals of object-oriented programming. The following is a list of topic that you should be very comfortable with:
- Basic data types
- This list (Links to an external site.) of data types should be familiar or at least understandable after reading the type description.
- Common object types
- You should know what a string is. You should know if there is a difference between a string and an array. You should know the difference between a string in C and a string object in C++
- Complex data types
- You should know what an array is, what a struct is and what, if any, differences there are between them.
- Flow control primitives
- You must be very comfortable with for, while, if/else, switch and do/while. You should know how they work, you should know what
iis equal to at the completion of a loop if the condition says,for(i=0, i<5, i++)is it 5 or is it 6? - Scope
- No matter where I declare
int fooin your code, you should be able to figure out if any other arbitrary spot in your code can access that variable. You should know what public and private functions are and what happens (and what it means) when variables go out of scope. - Problem solving
- If a language does not provide you a tool to do something, but you need that tool to make progress, you should be comfortable making it yourself. You should be comfortable making helper functions, even when the requirements don't call for it.
- Organization and documentation
- You should know that all of your source code probably does not belong in a single file and that every public function should have comments.
- Things not on this list
- This is not a comprehensive list, but it is a good start. If you don't know any of these topics, consider reviewing them before the class begins.
Code Quality
Code quality will be discussed on a section by section basis. However, the general rule is that all code should by syntactically valid, consistently formatted in a readable way and produce zero errors, warnings or notices unless OKed before submission.
In this course, we follow the Google style guide for the HTML/CSS/JS code:
https://google.github.io/styleguide/htmlcssguide.html
https://google.github.io/styleguide/jsguide.html
My Expectations
10 weeks will be very short for the web development since we have so many things to cover. As the instructor of this course, I wish you could keep up with your coursework and finish the assignments on time. More importantly, be honest to yourself. No cheating anytime.
Please go over all the contents in the "Start Here" module. Read the course policy carefully. Finish the course policy quiz and get full points to unlock week one module. There are some useful links under the resources module. Please check them out as well.
Meet the instructor:
Download the syllabus here: syllabus CS290 2019 spring.pdf
Course Name: Web Development
Course Number: CS 290-400
Credits: 4
Terms Offered: Every Term
Course Description
In this course, we will mostly talk about the frontend web development skills and a few backend techniques. We will be covering topics like HTML, CSS, JavaScript, Node.js and Mysql. We will spend most of the time talking about JavaScript.
Prerequisites: CS 162 or CS 165
Luyao Zhang, Instructor
- Email: zhangluy@oregonstate.edu
Course Topics
This course is divided into three main sections which are largely addressed sequentially:
- Layout and Styling
- The first portion of the class focus on the static layout and styling of a web page (HTML/CSS). For some, this may be a review if you have done web publishing in the past. There is quite a bit of information to take in here but the problems to solve are not that intricate.
- Client Side Interaction
- The second portion of the class focuses on JavaScript and making interactive web pages in the browser. Things like forms that will display an error message if a password is too short or creating a drop down menus are things that will be covered in this portion of the class.
- Server Side Interaction
- In this portion of the class, we look at using a very simple database to store data between website visits. The technologies we will be using this term are Node.JS and MySQL. In addition, we look at how we can track a user and data from page to page which is a critical first step in designing more complex systems like shopping carts for an online shopping website.
Course Schedule
You can see the assignment due dates on Canvas directly. You can also download it here: assignment schedule.pdf
Topics by Weeks
Textbooks
Required: Eloquent JavaScript http://eloquentjavascript.net/
Optional: Jon Duckett's "HTML and CSS design and build websites", ISBN-13: 978-1118008188, ISBN-10: 1118008189
Assignments
This course has three types of assignments:
- HW Assignment:
- You will have six assignments this term, each is given one week to finish (except the last one, you will have 12 days). You will write a website or make some functions working using required techniques to meet the constraints. The assignments will be graded on how well they meet the requirements.
- Activity:
- The activities are graded as pass/fail (10/0) based on efforts. You need to show that you did the required practice and tried your best to make the code working.
- Project:
- This is a research-based project. You need to build a website based on the knowledge you learn in this course to meet some requirements.
Exam
This course has one proctored exam -- the final exam. You can find out more about proctoring at the central Ecampus page on tests and proctoring (Links to an external site.).
The final exam window will run from the Monday at the start of finals week through Thursday of finals week. If you are unable to take the exam in that window, you must make arrangements prior to the end of the 2nd week of classes. Beyond this deadline, only emergency situations will be considered for alternate testing times.
Where possible, I suggest using an in-person proctor. Should an issue arise, it is historically a lot easier to get it resolved at a testing center than with other online proctoring service. If you do use ProctorU and an issue does arise, please document the situation as thoroughly as possible and forward that to the instructor as soon as possible.
Grade Weighting
- Activities/Exercise - 25%
- Homework Assignments - 50%
- Project - 10%
- Final Exam - 15%
Grading Policy
| Grade letter | Percentage floor |
|---|---|
| A | 93 |
| A- | 90 |
| B+ | 87 |
| B | 83 |
| B- | 80 |
| C+ | 77 |
| C | 73 |
| C- | 70 |
| D+ | 67 |
| D | 63 |
| D- | 60 |
| F | 0 |
Communication Policy
- Always use your OSU email to contact me. The Canvas mailbox doesn't work very well.
- When you send me an email, you must include the tag "CS 290 Spring 2019" in your email subject.
Please use the email addresses above to contact the instructor and TAs. You should expect a response to emails within 48 hours. Emails sent over the weekend sometimes take longer to respond to.
Post all course-related questions on the Piazza board so the whole class may benefit from our conversation. Please sign up yourself on Piazza sign up. You can use the course Slack channel to ask questions as well.
For grading questions, please contact the TA who graded your assignment and copy the instructor. You should expect your grade to be posted after one week of the due time. If you submit the assignment late, it may take longer for your grade to be released.
Please don't use Piazza or Slack to ask questions on grades. You must use your OSU email to contact us for questions on grades.
Luyao Zhang, Instructor
- Email: zhangluy@oregonstate.edu
- Office hours by appointment
- Resources:
We will post some resources that might be used as supplementing materials in the resources page and we will update this page throughout the term.
- Code Sharing Session:
After each assignment is graded, we will select some good code examples and post them in the code sharing session for you to review.
- TA online office hours:
We will have several sessions available each week from week 1 to week 10. Office hour is the best time to get instant and detailed feedback on your code. Make good use of them and get most from it. If none of the time slots work for your schedule, let us know and we can make accommodations. For TAs' email address, office hour time and link, please check the "Instructor & TAs Communication Policy and Information" in the Start Here module.
- Piazza:
All of the course discussions will happen on Piazza. We are watching the forum every day. Sometimes, if the question is not about the assignment requirement, we will hold our answers for a while to involve more students in the discussion. You are always encouraged to post on Piazza and participate in the discussions. Students who make contributions to the discussions on Piazza will get extra credit at the end of the term. Please sign yourself on the Piazza forum.
- Slack:
From this term we will use Slack officially in this course as well. We will be watching the course Slack channel and answer your questions in a timely way. The workspace of this course on Slack is class-cs290-400-sp19. For more information about Slack, please check Slack-How to in the start here module.
In this course, JavaScript will be used for both the front end and the back end (with Node.JS), so this will end up being the primary focus of the class.
The book we will be using for JavaScript is Eloquent JavaScript and a free online edition is here (http://eloquentjavascript.net/ ).
Physical copies exist if you prefer and can be ordered from Amazon. There will be required reading from this book along with programming exercises.
Students in the previous terms also suggested this book for JavaScript: You don't know JS It would be a great book to read if you are new to JavaScript.
HTML/CSS is another component to this class. Currently the books on the subject are a bit of a mess. The transition to HTML5 is pretty much done but there is a delay between a technology being adopted and publishers actually getting books on the topic to market. In addition it is a less complex topic than many other programming languages. So I am not requiring any books on the subject, instead I will offer several online resources. If you really want a book, I would suggest Jon Duckett's "HTML and CSS design and build websites". It does not have great HTML5 coverage, but is very visual in its presentation of material which can be a big benefit.
Besides the textbooks listed here, we also have a resource page on Canvas: Useful links
There are many useful links organized in this page. I add links that students find to be useful and post on Piazza to this list every term. You should check this list for more resources.
Reading List
Here is the reading list of the whole term if you want to read ahead:
Week1: Eloquent JavaScript Chapter 13
Week2:Mozilla's HTML Intro
https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Introduction
Mozilla's CSS Intro https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_started
Week3: Eloquent JavaScript Chapters 1-4
Week4:Eloquent JavaScript Chapters 5 and 6
Week5:Eloquent JavaScript Chapters 13, 14, 15
Week6:Eloquent JavaScript Chapter 18
Week7: http://expressjs.com/
https://github.com/ericf/express-handlebars
Week8: https://github.com/expressjs/session
https://github.com/request/request
Week9: The official documentation for Node's MySQL module.
https://github.com/felixge/node-mysql
W3Schools SQL http://www.w3schools.com/sql/default.asp
Course Summary:
| Date | Details | Due |
|---|---|---|