Skip to content

Latest commit

Β 

History

History
67 lines (51 loc) Β· 2.74 KB

File metadata and controls

67 lines (51 loc) Β· 2.74 KB

Capstone Project: WebSockets

Table of Contents

  1. Learning Objectives
  2. Project Ideas
  3. Project Requirements
  4. Directory Structure
  5. Implementation Guidelines
  6. Presentation and Demonstration

Learning Objectives

  1. Gain experience with multiple patterns discussed in this course.
  2. Practice scoping a deliverable in a short timeframe.
  3. Add a real-time project to your portfolio.

Project Ideas

  1. Two Player Games: Tic Tac Toe, Connect Four, Battleship
  2. Multiplayer Games: IO Games (examples)
  3. Collaboration Tools: Whiteboard, Text Editor
  4. Control Physical Devices: Flash LED on Raspberry Pi
  5. Personal Dashboard: Keep track of real-time statistics about your day
  6. Financial Updates: Cryptocurrency Ticker, Stock Ticker

Project Requirements

  • Must use Socket.IO on both the client and server side.
  • Must contain at least three events that pass data back and forth between the client and the server using WebSockets.
  • Must follow the Project Structure outlined below in this document:
    • Client-side JavaScript must be written in static/client.js
    • Server-side JavaScript must be written in app.js
  • Project must implement at least one additional pattern we learned about in this course.
  • Repository must contain a README file that contains:
    • Team members
    • App description
    • Justification for using WebSockets
    • Labeled mockup of the app with event interaction details
    • How to install and run the app
  • Each participant must have five or more commits in the repository at the time of submission on Gradescope.

Directory Structure

Please adhere to the following structure when initializing your project. This is to ensure adherence to common front-end structural best practices as well as facilitate grading.

πŸ“‚ project_name
	β”œβ”€β”€ πŸ“‚ static
	    └── πŸ“„ client.js
	    └── πŸ“„ index.html
        └── πŸ“„ style.css
	β”œβ”€β”€ πŸ“„ app.js

OPTIONAL: A templating engine may be used, if preferred.

Implementation Guidelines

  • KEEP IT SIMPLE: The brevity of this starting structure should encourage your team to create a true MVP!
  • PREP FOR POLISH: Once the app is functioning, spend the remaining time polishing it for your portfolio.
  • ASK FOR ASSISTANCE: Schedule a meeting with Dani if you need help with the front or back end.

Presentation and Demonstration

TODO