CSE312: Web Applications

Spring 2021


Participate in live lecture streams MWF 10:20-11:10am EST
Watch previous lectures
Submit assignments here
Ask questions when you need help
Chat with other students
Syllabus

Course Description

Covers the fundamentals of full-stack web development and deployment with a strong emphasis on server-side code and functionality. Students will develop a full-stack web application without the use of a pre-existing web server or web framework. Topics include HTTP, APIs, AJAX, databases, encryption, authentication, sockets, privacy, and security.

Expectations

To do well in this course you are expected to:

  • Have a desire to learn about Web Applications
  • Be able to develop software with little guidance
  • Be able to find, read, and understand technical documentation
  • Spend a minimum of 12 hours/week on CSE312

Grading

Your final grade will be determined by the following percentages:

Homework 70%
Team Project 30%

Your final letter grade will be determined by the following cutoffs:


93%+ A
90% - 93% A-
87% - 90% B+
84% - 87% B
80% - 84% B-
77% - 80% C+
74% - 77% C
70% - 74% C-
< 70% F

Readings

There is no textbook for this course. Links to relevant readings and tutorials will be provided in the course schedule.

Academic Integrity

CSE Department Academic Integrity Policy:
http://engineering.buffalo.edu/computer-science-engineering/information-for-students/policies/academic-integrity.html

UB Academic Integrity Policy:
https://catalog.buffalo.edu/policies/integrity.html

In addition to the department and university policies, the following details apply to this course.

All submitted work must be of your own creation and you must not share your submission with anyone else. If any submission is very similar to what has been submitted by another student, or can be found online, it is in violation of this courses academic integrity policy and all students will be penalized whether they were copying or sharing their submission with other students so they can copy. If two submissions are similar beyond what is likely if the students worked independently, then both students are in violation of the academic integrity policy.

All violations will result in: 

An F in CSE312.

It is your responsibility to understand what constitutes an academic integrity violation. If you have any question whether something you are doing is a violation or not, ask for clarification before receiving an F in the course. I will not entertain excuses after you have been caught.

Examples of acceptable behavior:

  • Discussing an assignment with your classmates and brainstorming abstract solutions, then writing code and documentation independently
  • Searching the Internet for supplementary material on the course topics
  • Asking the teaching staff for clarification on a homework question
  • Collaborating with your team mates on the team project

Examples of unacceptable behavior:

  • Falsifying a homework submission form. Ex. Claiming to have completed an objective that you did not complete.
  • Submitting code or other work that is not your own for course credit.
  • Allowing another student to see your code or submission for an assignment. (Ex. Sitting side-by-side while working on a homework such that you can see each other screens)
  • Collaborating with another student to write code or documentation for a homework assignment.
  • Allowing another student to access your work that will be submitted for course credit. (Ex. Do not post you code publicly, host your code in a public repository, or allow anyone to access your laptop)
  • Copying a large amount of material found on the Internet into your submission.
  • Writing project code for a teammate and allowing them to represent it as their own.

Homework

Overview

For the homework in this course you will develop a web server from scratch that is divided into 5 assignments. Each assignment will add more features to your server. Each assignment will be equally weighted.

Each assignment will be a programming/development assignment with a submission of your software and documentation on AutoLab, though there will be no automated grading in this course. You will submit all of the code and files that comprise your software on AutoLab in a single zip file.

The following apply to all homework assignments except where exceptions are explicitly stated:

  • You may choose any programming language you prefer
  • No external libraries or frameworks are allowed (TCP and concurrency exception below for certain languages)
  • Any libraries/packages/classes/functions/etc included with your language of choice that complete part of an assignment - related to the course content - for you are not allowed. This includes any and all HTTP libraries and frameworks
  • Code included with your language of choice that handles TCP socket servers and concurrency are allowed. Most assignments will start with a TCP socket server upon which you'll develop a web server. Industry standard external libraries for TCP and concurrency are allowed if they are common in the community for your language (Ex. Akka for Scala).
  • If you have any question whether or not something is allowed, please ask before the assignment is due. In general, if I explained something in detail during lecture then you must write all the code that handles those details.

Documentation

Your homework must be accompanied by report in the root directory of your zip file names "report.txt". This report will serve as documentation for the course staff to understand your code during grading and you will expand this file for each of the 5 submissions. Your reports must include:

  • The architecture of your software
    • Describe how you completed the objectives of the assignment, how your software is structured, and why you made the design decisions you made. A reader should have a good understanding of your software by reading this section without looking at a single line of your code

Makeup Opportunities

Since each homework submission builds on the previous submissions you will find yourself working on past assignments if you were not able to complete them on time. To compensate for this, your can earn back half of points you missed on each assignment if you complete the assignment before the next HW's due date. For HW5, the makeup deadline is 2 weeks after the original deadline.

Example: You earn a 60% on HW2 at the time of it's deadline. Before the HW3 deadline you are able to complete enough of HW2 to earn a 90% on it. You then recover half of the missed points that you completed and your final HW2 grade becomes a 75%.


Project

Overview

You'll work in teams of 4 to create a web app of your own design which must include:

  • User Accounts with Secure Authentication
  • Users to see all users who are currently logged in
  • Users can send direct messages (DM) to other users with notifications when a DM is received
  • Users can share some form of multimedia content which is stored and hosted on your server
  • Live interactions between users via WebSockets (Cannot be text)

You will also create a video presentation showing off your project at the end of the semester.

Weekly Meetings

All scheduled recitation sections are cancelled and replaced with team meetings which will start on week 3 of the semester. Your team will schedule a time and location for these meetings and all team members will submit the team meeting form after each meeting.

Team Meeting Form

Meeting submissions and peer evaluations will be used to adjust individual grades at the discretion of the course staff. The average individual score for a team will equal the team score for each phase (ie. An entire team will not be penalized based on meetings and evaluations). Individual grade adjustments will never result in a score > 100%.

Submissions

The entire project is due after the last day of classes. However, your team is allowed to use 2 project checkpoints during the semester. When a checkpoint is used, the course staff will review your project and provide feedback on your progress. Checkpoints will follow these guidelines

  • A checkpoint cannot be used within 3 2.5 weeks of another checkpoint or the project due date. To use both checkpoints, you must plan ahead and use the first one at least 6 weeks before the project deadline and the second at least 3 weeks before the project deadline
  • If a project is near completion when a checkpoint is used, a grade may be provided. If your team is happy with this grade, you can be done with the project early.

Specific requirements for the project and presentation, will be linked here.


Open-Source Reports

As opposed to the homework assignments, you are allowed to use external libraries, frameworks, and services for your project. For example, instead of building your site starting with a TCP socket server you can use technology such as Express, Flask, Django, React, Angular, Handlebars, Apache, Nginx, Socket.io, etc. However, any time you use technology that was not developed by your team you must provide a report for that technology.

Report: For each technology used in your project that would not be allowed for a homework assignment, your team must submit a technical report explaining what it accomplishes, how it works, and the licenses involved. In addition to the report, every team member who helped develop the part of the project using a specific technology must be prepared to answer questions about it at all times.

Each report must answer:

  • What does this technology (library/framework/service) accomplish for you?
    • Explain what this technology does in your project. What problems does it solve for you?
  • How does this technology accomplish what it does?
    • For each problem this technology solves for you, explain in detail how it solves it starting with a TCP socket connection. You must include links to any relevant documentation or code. If the technology is open-source, you must include links to the exact code that solves your problem for you.
    • Ex. If you use express for your web framework you must explain how express handles an HTTP request starting with a TCP connection to include how it routes requests, how headers are parsed, etc. and link to the exact code on GitHub that parses HTTP headers and routes paths. Any other express features used must also be explained and the code linked. You do not have to explain features of the library that are not used in your project.
  • What license(s) or terms of service apply to this technology?
    • When using technology you did not write you will be subject to certain agreements. List any licences attached to the project (Ex. MIT, Apache) and what that license means for your project. If using a service, review the terms of service and explain all the implications of these terms for your project.

Why?: Developing a website using existing frameworks/libraries/services does not require years of CSE education and is not appropriate for a project in a 300-level technical course. The use of frameworks/libraries/services are allowed for this project, and strongly encouraged outside of this course, but you must prove that you understand what is being done for you by other developers and how they do it. In this course, you cannot use technology that you do not understand.

A report must be included in your repository for each library/framework used in your project. If any reports are missing, inadequate, or a team member who developed with a technology fails to answer questions about it the team is in violation and the project may become invalid. Consequences will be decided by the course staff on a case-by-case basis which can range up to a 0 for the entire project.

Grading

Project grading is divided as follows:

  • [75%] Features - 15% for each of the 5 features listed at the beginning of this section (user accounts, etc.)
  • [15%] Presentation video
  • [10%] Checkpoints - 5% each time a project checkpoint is used. To earn the 5 points, a reasonable amount of progress must have been made on the project

Security: If there are any security issues with your project that have been covered in lecture, your project grade may be changed to 0 at the discretion of the course staff and depending on the severity of the security vulnerability.


1 - Introduction
Homework 1
Week 1
Monday, February 1
Course Introduction
Wednesday, February 3
TCP/IP and TCP Socket Servers
Slides
Friday, February 5
Week 2
Monday, February 8
HTTP Response/Request
Wednesday, February 10
Friday, February 12
Docker and HTTP Examples
Friday, February 12 Team Formation Due
2 - Static Site
Homework 2
Week 3
Monday, February 15
Front End Development - HTML/CSS
Slides
Wednesday, February 17
Front End Development - JavaScript
Friday, February 19
HTTP - Static Files, MIME Types, and Encodings
Friday, February 19 @ 11:59pm HW1 Due
Week 4
Monday, February 22
HTTP - Encodings and serving files
Wednesday, February 24
Query Strings and HTML Templates
Friday, February 26
HTTP - Examples
3 - Dynamic Site
Homework 3
Week 5
Monday, March 1
HTTP POST and Forms
Wednesday, March 3
HTML Injection Attacks
Friday, March 5
HTTP POST - File Uploads
Friday, March 5 @ 11:59pm HW2 Due
Week 6
Monday, March 8
Buffers
Wednesday, March 10
AJAX and Polling
Friday, March 12
XSRF
Definitely Not Spring Break
Week 7
Monday, March 15
Review [Optional]
  • Maintain your mental health
Wednesday, March 17
Review [Optional]
  • Maintain your mental health
Friday, March 19
Review [Optional]
  • Maintain your mental health
4 - WebSockets
Homework 4
Week 8
Monday, March 22
Wednesday, March 24
WebSocket Frames
Friday, March 26
WebSocket Examples and Help
Friday, March 26 @ 11:59pm HW3 Due
Friday, March 26 Last day to submit first project checkpoint if you want to use both checkpoints
Week 9
Monday, March 29
WebSocket Examples and Help
Wednesday, March 31
Friday, April 2
Database Examples
5 - Authentication
Homework 5
Week 10
Monday, April 5
Wellness Day
Wednesday, April 7
Friday, April 9
Authentication and Secure Password Storage
Friday, April 9 @ 11:59pm HW4 Due
Week 11
Monday, April 12
Authentication Tokens and Sessions
Wednesday, April 14
Authentication Continued
Friday, April 16
Authentication Examples
Web Apps
Week 12
Monday, April 19
Web Frameworks
Wednesday, April 21
Wednesday, April 21 Last day to submit a project checkpoint
Friday, April 23
Friday, April 23 @ 11:59pm HW5 Due
Week 13
Monday, April 26
HTTPS
Wednesday, April 28
Web App Architecture and Examples
Friday, April 30
Web App Architecture and Examples
Week 14
Monday, May 3
Review/Examples
Wednesday, May 5
Review/Examples
Friday, May 7
Review/Examples
Friday, May 7 @ 11:59pm HW5 Half Credit Deadline
Friday, May 7 @ 11:59pm Last Project Checkpoint
Friday, May 14 @ 11:00AM Project Video Due