Course Information

Fall 2023
Meets: MW 2:30–4:00
Room: Bewkes 107
Course Requirements:

• Students must have completed CS-256 or have the permission of the instructor.
• This course assumes a solid background in programming skills, but does not assume any experience with web programming.
• Students will benefit from having access to a personal computer during class time. If you do not have a computer that you can bring to class, please let me know ASAP.
• Students are expected to attend class regularly.

Required Materials

• Eloquent JavaScript (3rd Ed) by Marijn Haverbeke, No Starch Press, 2018. (A print copy is available for $21 [https://www.amazon.com/dp/1593279507], but the online book is sufficient)
• Additional readings will be provided on the course website, where appropriate.
• Note that access to a computer with a network connection (and SLU VPN for off-campus students) is necessary for this course.

Important Dates

Event/Action	Date
First Class Meeting	2023-08-23
Last Day to Add/Drop	2023-08-31
Exam 1	2023-10-09
Pass/Fail Deadline	2023-10-27
Last Day to Withdraw	2023-11-03
No Class — Thanksgiving Break	2023-11-20/22
Exam 2	2023-11-29
Last Day of Class	2023-12-06
Final Exam Period (all assignments due)	2023-12-13

Course Overview and Goals

From the course catalog: This course introduces the terminology of the Web and the Hypertext Markup Language (HTML) as well as concepts of distributed computing, including client-side and server-side programming.

Have you ever wondered how YouTube is able to store and suggest videos that might interest you, or how sites such as Twitter and Facebook can display new posts without needing a page refresh? Are you so fed up with APR2 that you're tempted to write your own interface? Or perhaps you've always wanted to build a customizable tournament bracket app to determine the best Dana dessert, building on campus, etc. One day, you may also find the need to (or be instructed to) build a website for a particular project to which you contribute. Web Programming will provide you with the tools and knowledge necessary both to understand how modern websites function and also to build your own interactive sites. By the end of the course, you'll be able to build the tournament bracket website (or social media empire) of your dreams.

At the end of this course, you will be able to:

1. Develop web applications using HTML, CSS, JavaScript, NodeJS, and MongoDB
2. Describe the technologies and approaches used by web browsers and content providers to improve the efficiency of web applications
3. Integrate cloud resources into your own web application
4. Quickly find and adapt previously-made resources for web applications
5. Discuss security and privacy concerns associated with web development and evaluate tools and approaches to test and protect websites
6. Collaborate with a team to produce software meeting a client's specification

Course Topics

Topics from this course are drawn from four main themes: Web Architecture, Content Display and Styling, Front End Programming, and Back End Programming. A rough list of topics is presented below, but content and ordering is subject to change. The lectures page maintains a detailed description of topics covered so far in class.

1. Web Architecture
   • Configuring a web development and testing environment
   • Server-Client Models
   • Securing web communication
2. Content Display and Styling
   • HTML5
   • CSS
   • Bootstrap
   • Accessibility
3. Front End Programming
   • Interacting with web content through JavaScript
   • Asynchronous Programming (AJAX and Promises)
   • Data interchange (XML and JSON)
   • React Apps (time permitting)
4. Back End Programming
   • NodeJS: server-side JavaScript
   • NoSQL data stores
   • Integrating NodeJS and MongoDB

Course Format

This course consists of both in-class components as well as activities that must be completed outside of class time. The subsequent subsections provide an overview of this course’s structure.

Weekly Lectures

Each week, there will be synchronous lectures during our scheduled course time. During these lectures, we will explore the topics covered by this course and develop the skills described in the learning goals section. Please review the attendance policy below for expectations about attending these lectures.

Lectures will be recorded and available on Canvas for students wishing to review material covered in this course.

Homework Assignments

Throughout the semester, you will have several different kinds of homework assignments to complete. Homework will be listed on the Lectures page of this site. Each assignment will also indicate which platform you should use for submitting your work.

Reading Quizzes

Readings will be assigned on a class-by-class basis. There will be a short quiz associated with each reading assigned for class. The purpose of these quizzes is to help students retain information for quick recall while completing homework assignments and to help maintain a steady pace of material during class meetings.

Quizzes will be available online via Gradescope and must be completed prior to the start of each class meeting (except for exams or as otherwise announced). There is no limit on the number of times a student may take a reading quiz before the deadline. Excluding special circumstances, reading quizzes may not be taken after the deadline has passed.

Exercises and Projects

Throughout the semester, you will be completing various exercises and projects that help you practice the topics we cover. Exercises will typically be brief activities to give you a little more practice while projects may require several days' time commitment.

Projects in this course are themed around developing a subset of the popular social media platform X/Twitter. While we don't have enough time for a full implementation, we will get as far as we can. This is not a trivial undertaking, and as such, you will be working in teams to develop this platform.

Exercises and projects will be submitted using Gradescope (linked through Canvas).

Exams

There will be two, 90 minute exams to check your mastery of tools and concepts in this class. Some of these exams may require the use of a computer. If a student is unable to provide their own computer, please notify me 48 hours prior to the exam, and I will arrange for a loner machine. Make-up exams will not be given for absences unless approved by the instructor in extreme circumstances.

Note that there is no final exam for this course.

Attendance

Students are expected to attend each class meeting. Absences will leave holes in your understanding of course concepts. If you must miss a class, you are expected to make up the material on your own time before the next class. You are welcome to attend student hours if you have specific questions about the material you missed, but you will not receive any help if you ask, "what did I miss?" during student hours.

I do my best to post resources from class online (slides, audio recordings, etc.), but I write a significant amount on the board. This means you will need to review notes from a peer or rewatch the video recordings.

Grading

Final grades are based off of a cumulative point system. That means, for example, that 1 point from a reading quiz or project is equivalent to 1 point from an exam.

Your final grade will be calculated as follows. First, the percent of total possible points your eceived is calculated. Then, this percentage is mapped to a numeric grade on the 4.00 scale (see below). Note that I do not guarantee any particular rounding scheme for this calculation.

Toggle 4-Point Grade Mapping

Regrading Policy

Requests for an assignment regrade must be made in person to the instructor within one week of the assignment being returned to the student and by the final day of classes. Any requests submitted after this may be done at my discretion. I reserve the right to regrade the entire assignment, which may result in either an increase or a decrease in your grade. This is not intended to scare off students, but to avoid frivolous requests.

Examples of appropriate reasons for requesting a regrade include:

• You believe your answer to a question matches the answer on the key.
• Your answer is different from the key, but is also correct.
• There is in error in the summation of points.

Examples of inappropriate reasons for requesting a regrade include:

• Your programming assignment works on your computer but not the grading server.
• Most of what you wrote on an assignment was correct, but you want more partial credit.
• You are one point away from an 3.75 and are trying to get extra points.

Electronics Policy

Students will need a computer with an internet connection to participate in this course. If you do not have access to a reliable computer, please contact me as soon as possible. There may be resources available to help.

Students are expected to remain on task during synchronous activities (no web browsing, social media usage, etc.), as per the professionalism policy. If you have any concerns about this request, please contact me outside of class, and we will work together to find an appropriate solution.

Generally speaking, I encourage taking notes by hand. At least one recent study found that students who took notes longhand remembered more and had a deeper understanding of the material. Rather than using slides, I typically take notes on the board, which will help you keep up if you are taking notes by hand.

Academic Integrity and Professionalism

As noted in the Academic Honor Code in the Student Handbook, "all students at St. Lawrence University are bound by honor to maintain the highest level of academic integrity." Please review the handbook for general guidelines. In particular, you should only be turning in your own work. You are expected to abide by the additional policies listed below. It is my responsibility to report violations of these policies to the Dean.

Students are also expected to act in a professional manner for the duration of the course. This includes (but is not limited to): staying on task during lectures, being respectful of others, avoiding extra use of electronics in class, and promptness for class and deadlines. Unprofessional behavior will result in a reduction of the student's final grade.

Assignment Policies

In addition to the general policies described in the Student Handbook, you are expected to follow the following policies, which are specific to this course.

Late Work

Unless otherwise noted (e.g., project submissions) or discussed, you must turn in your work within one week of the due date to receive credit. If you find yourself in a situation where this might not be possible, please contact me as soon as possible.

Collaboration

For projects in this class, you will be working in groups. Teamwork imposes burdens of communication and coordination, but has the benefits of more thoughtful designs, cleaner programs, and (sometimes) higher bandwidth. Team programming is also the norm in the professional world.

Students on a team are expected to participate equally in the effort and to be thoroughly familiar with all aspects of the joint work. All members bear full responsibility for the completion of projects. Teams turn in one solution for each project. If a partnership is not going well, the instructor will help to negotiate new partnerships. Teams may not be dissolved in the middle of an assignment without instructor permission. If the instructor believes that there is unequal contribution to a project, students may be asked to schedule a meeting to discuss their work.

Unless otherwise noted, you must complete all other assignments in this course on your own.

You may discuss the assignments with your classmates, but you may not share code or written text. You may only submit work that you have personally written and understood. Always make a note in your code of your peers with whom you discussed an assignment.

Resources

You may consult your class notes and the assigned reading materials to help with your assignments. You may also reference web resources (please read below about citations). Note, however, that you may not submit a third party tool that performs the tasks specified in a given assignment or text that you have not written (unless you are given explicit permission). Use of AI is also permissible in this class following the same basic principles. You may not use AI to generate the entirety of an assignment (your goal is to learn how to do this yourself!), and any use must be appropriately cited.

You should know that fairly sophisticated plagiarism detection software will be used on the assignments. For more details, see the Academic Integrity and Professionalism section.

I will be available to answer questions during student hours. If you would like help, prepare specific questions. I will not help you write your code or answers from scratch (part of the learning process is experimentation), but I am more than happy to provide guidance if you run into trouble.

Citations

For all assignments, you must submit a file citing all of the resources (excluding class notes and assigned readings) you used to complete the assignment. This includes (but is not limited to) conversations with peers, web resources, large language models (AI), and additional books. Generative AI citations should include platform details, access date, prompts used, and a permalink (if possible). Failure to appropriately cite resources will be considered a breach of the honor policy and will be dealt with as described in this document. If, at any point, you are unsure about the citation policy, ask. Your grade is not affected by the number of resources you cite; I will not be impressed by low or high citation counts. Use the resources you need to complete the assignments!

In addition to following the practice of academic honesty, the purpose of these citations is to help you find resources when you look back at your work. If you were confused by something before, it's likely you might be confused by it again later.

Best Practices

When it comes to academic integrity and professionalism, it's best to ask questions if you are unsure. It has been my experience that most violations are acts of desperation or misunderstanding rather than ill will. I would rather you ask for help or clarification than commit an act of academic dishonesty.

As a general rule of thumb, when you are talking to someone (other than the instructor or teammate) about work in this class, close all code that you are working on. If you cannot look at your code (or others' code!) while you are discussing content, it becomes significantly more difficult to violate these policies.

Tips for Success

Computer Science courses can often look and feel different from your other classes at St. Lawrence. Nevertheless, mature study habits can help you be successful and achieve your personal goals this semester. Many of these tips apply to courses across the curriculum, but a few are also specific to this particular class.

1. Start homework exercises and projects early, not the day before it is due. Humans are notoriously bad at estimating time; it's better to have too much time rather than too little.
2. Struggle through the frustration and don't give in to temptation to take shortcuts or use disallowed resources
   • This is part of the learning process (and why you should start early)
   • Take a break. Sometimes stepping away from a problem can give you new insights
   • If you've tried to solve a problem three times and it's still not making sense, then it is a good time to ask for help
3. Challenge yourself to ask questions and offer answers in class
   • Nothing bad happens if you make a mistake
   • If you have a question, you can be sure that at least two other people in class have the same question—ask it and help all three of you
4. Set aside time outside of class and keep a regular schedule of when you are going to study for this class
   • Do not use this time for other work or commitments unless you have already finished everything (including studying) for this class
   • As a rule of thumb, set aside two (2) hours of time for every one (1) hour of class
   • If you have academic accommodations, adjust the time you set aside to match
   • Find a place you can concentrate. There may be too many distractions in your room, so consider the library, PQRC, classroom, or majors' room
5. After each class, review the code and notes you took
   • Fix any typos or mistakes that you find
   • Add additional comments to your code to explain ideas
   • Make extra notes to clarify what you wrote down and complete any examples that were left for you to do
   • Create a list of questions you have about the material
6. Do the assigned reading
7. Show up for student hours
   • This is a great time to ask your questions!
   • You don't need questions to attend, however. You might use this time for some of your set-aside review
8. Come to class; watching the recordings is not a substitute for attending
9. Make sure that your development environment is in “a good state”
   • No errors in your IDE settings
   • Code from previous classes works without crashing
   • GitHub/Git/OneDrive are up to date and do not have any conflicts

Mental Health and Wellbeing

St. Lawrence University is committed to advancing the mental health and wellbeing of its students. If you or someone you know is feeling overwhelmed, depressed, and/or in need of support, services are available.

For help, contact the Diana B. Torrey '82 Health and Counseling Center at (315) 229-5392 Monday through Friday from 8:30 AM–4:30 PM. After hours, call Campus Safety at (315) 229-5555 to speak with the after-hours crisis counselor. The nation-wide 24/7 crisis counselor service can be reached by calling (315) 229-1914.

For more details, visit https://www.stlawu.edu/offices/health-and-counseling-services.

Accommodations

Student Accessibility Services

Your experience in this class is important to me. It is the policy and practice of St. Lawrence University to create inclusive and accessible learning environments consistent with federal and state law. If you have already established accommodations with the Student Accessibility Services Office, please meet with them to activate your accommodations so we can discuss how they will be implemented in this course.

If you have not yet established services through the Student Accessibility Services Office but have a temporary health condition or permanent disability that requires accommodations (conditions include but not limited to; mental health, attention-related, learning, vision, hearing, physical or health impacts), please contact the Student Accessibility Services Office directly to set up a meeting to discuss establishing with their office. The Student Accessibility Services Office will work with you on the interactive process that establishes reasonable accommodations.

Color Vision Deficiency:

If you are color vision deficient, the Student Accessibility Services office has on loan glasses for students who are color vision deficient. Please contact the office to make an appointment.

For more specific information about setting up an appointment with Student Accessibility Services please see the options listed below:

Telephone:

315.229.5537

Email:

studentaccessibility@stlawu.edu

For further information about Student Accessibility Services, you can check the website at: https://www.stlawu.edu/offices/student-accessibility-services

Diversity and Equity Statement

As indicated by the University's Statement on Diversity and the student handbook, we are committed to treating students fairly and with dignity regardless of age, color, creed, disability, marital status, national origin or ancestry, race, religion, sex (including gender identity and gender expression), sexual orientation, and/or veteran status.

It is my intent that students from all backgrounds and perspectives be well served by this course, that students' learning needs be addressed both in and out of class, and that the diversity that students bring to this class be viewed as a resource, strength and benefit. Should you have any concerns, problems, or suggestions, please do not hesitate to contact me. I strive to make my classrooms safe spaces for learning.

Please also feel free to talk to me about events that happen outside my classroom. If you do not feel comfortable talking to me, there are many other resources available to you on campus, including those on this list of on-campus resources: https://www.stlawu.edu/offices/diversity-and-inclusion/campus-resources.

You can report a bias incident here: https://www.stlawu.edu/offices/diversity-and-inclusion/bias-reporting.

PQRC

The Peterson Quantitative Resource Center (PQRC) offers free, no appointment necessary peer tutoring across a range of courses with quantitative content. The PQRC student staff of mentors is trained to assist students to develop and to improve their quantitative skills and understanding. More information about the PQRC's current hours and modes of operation can be found at the PQRC webpage: www.stlawu.edu/offices/pqrc.

Research

Your class work might be used for research purposes. For example, we may use anonymized student assignments to design algorithms or build tools to help programmers. Any student who wishes to opt out can contact the instructor to do so up to seven days after final grades have been issued. This has no impact on your grade in any manner.

Right to Revise

This is a "living syllabus". Therefore, its contents may be changed throughout the course of the semester to address changing needs. I will do my best to notify students of changes; however, it is up to the student to monitor this page for any changes. Final authority on any decision in this course rests with the instructor (i.e., Kevin Angstadt), not with this document.

Many ideas for this class were borrowed from similar classes taught at UVA, The University of Michigan (Drew DeOrio), George Mason University, and St. Lawrence University.