Overview

The final project must be a web application that you design and build. You have a lot of flexibility in what you do, as long as it's interesting, is of a substantial size, and meets the constraints laid out below. You will be designing and implementing your project according to a series of graded milestones, also laid out below.

Here are a few example projects (you do not need to pick one of these):

A live polling app. An application for presenters to post polls that audience members respond to. Presenters can edit polls they've made, anyone can take them (no need to log in). Several options of poll types are available and results are processed accordingly (word cloud for short answers, bar charts for multiple choice questions, etc.)
A blogging app. An application for blogs. Users can log in and blog or post comments to other users' blogs.
A social networking app. Allows people to sign up and share messages. Users can follow, star, and reply to updates from other users.
A search engine. Allows users to login and register interests and conduct searches. Search results are first pulled from a free web search API and then filtered/grouped based on user interests.
A simple email client. Lets users send, receive, and manage emails.
A running/walking/hiking/biking GPS visualizer. Users can upload a GPS file or interact with a map to plot routes over roads and trails. The app keeps track of the users and all of their saved routes. Routes can be cloned and edited. Each route displays information about the distance and calories burned based on exercise type.

Requirements

Your final project must meet the following criteria:

you may use backend or frontend frameworks, but they must be new to you and approved by me

do not follow a tutorial specifically targeted to your application (e.g., if you choose to do a social network, you may use a tutorial for your framework directed at making a blogging site, but not one directed at making a Twitter clone)
using PHP as we learned in class will likely be simpler than learning a new framework

incorporates an interesting GUI
uses a database for some kind of server-side storage
uses AJAX
implements a RESTful or ad-hoc (simple) API to service AJAX requests
includes graceful error handling
has a reasonable design
is well documented (header, inline comments)
is interesting and creative
uses only external libraries approved by me

While you may rely on code from class or external sources, you will only be graded on what you have written. In addition, any code that is not your own must be properly cited, which means a comment for each chunk of code taken in entirety or in part from a source that includes the author's name and the URL where it can be found. If you take code from somewhere and modify it, even heavily, you must still cite it. Not citing constitutes plagiarism and will be penalized accordingly, including a 0 on the final project.

Submission basics

Create a private git repository on GitHub named csc302fa22-<your last name>-project (for example, mine would be called csc302fa22-feild-project). Make me a collaborator on that project. Clone the empty repository and add the files specified in the milestones below. Be sure to commit and push frequently for milestones 2–4 so you don't lose much work if your computer dies. The version graded will be the last one submitted before the deadline and is appropriately tagged. If you choose to use late days or redos for any submission, you must notify me (see the syllabus for more information about late days and redos).

Milestones

Milestone 1: Project ideas

Provide a list of at least two potential ideas for your final project. Write one paragraph (a few sentences) per idea describing what it would consist of. These are rough ideas, so do not get too bogged down in details.

Keep the following questions in mind as you consider project ideas:

What will your application do?
What will the GUI look like? (use a program to draw the design, or draw it by hand and take a picture)
What will the RESTful/simple API be used for?
What data will be stored and how (e.g., using a database)?
Thinking about the design of your application, list three potential components you may implement and describe what they do.

Submit your ideas as a Google/Word document to the Milestone 1: Ideas Canvas assignment.

Milestone 2: Diagrams & prototype

Based on feedback from me and others, settle on one of your ideas from Milestone 1.

As we've seen through the semester, diagramming is a very useful tool in designing complex applications. Your application should have several components between the client and server sides. Create a basic wireframe of your front end and a component diagram depicting what information and processes occur on the front and back ends. Your diagram should be in PDF format and created with an electronic diagram editor (e.g., draw.io). This should appear in a file named diagram.pdf in your repository.

In addition, provide an early version of your application. It doesn't need to have all the features implemented, but the main idea should be there. This should be roughly 25% of the way to your completed project. Add your code to a directory named src in your repository.

Your repository should also include a README.md file that contains:

a description of your project and the various files it contains
a list of features the completed project will contain with the ones implemented thus far checked off
- if partially completed, include the percentage completed, e.g., "account management: 50%"
- this list, cross checked with your code, is how you and I will determine that your prototype is roughly 25% of the project
the URL where a live version can be found (use your account on digdug.cs.endicott.edu)
a listing of your API actions (including HTTP method, request parameters, and response data)
data model description—be sure to include data stored on both the client side and server side

Note that you should use Markdown for your formatting in this file. Since you're putting this up on GitHub, follow GitHub's Markdown syntax reference.

After committing, make an annotated tag for your commit with the name "Milestone 2". See this page for more info about annotated tags in git. Make sure you push your tag to GitHub; it should show up under the list of tags for the repository (click "Main" at the top of your repository, then the "Tags" tab, and you should see the tag you created listed there).

Submit a link to your project repository to the Milestone 2: Diagrams & prototype Canvas assignment.

Milestone 3: 75% check in

For this milestone, you should have implemented roughly 75% of your total project. Your updated code should appear in the same git repository directory as your prototype (src). Update your README to reflect any new files and descriptions, features implemented or added, APIs modified, and data models modified. Be sure that a live version of your project is working and that the link to the live version is up to date in the README. You are expected to make changes based on my comments on your previous milestone submissions.

Tag your commit as "Milestone 3". Submit a link to your repository to the Milestone 3: 75% checkin Canvas assignment.

Milestone 4: Completed project

For this milestone, your application should be completely implemented and ready to be used. You will submit three things, as described below.

Code

The first thing is the project code itself. Your updated code should appear in the same git repository directory as your previous code (src). Update your README to reflect any new files and descriptions, features implemented or added, APIs modified, and data models modified. Be sure that a live version of your project is working and that the link to the live version is up to date in the README. You are expected to make changes based on my comments on your previous milestone submissions. Include an up-to-date component diagram (diagram.pdf) that matches your final system.

Tag your final commit as "Milestone 4". Submit a link to your repository to the Milestone 4: Completed project Canvas assignment.

Report

The second thing you need is a report describing your project. This should be written in a word processor and should include your diagram as a figure. In your report, you should answer the following questions:

What is your application and how is it different from related applications? What is special or unique about your application?
In choosing this application or specific features, what risks, if any, did you take? (Did you go beyond the assignment specs? Did you use a technology we hadn't covered in class? Something else risky?)
In designing and implementing your application, what choices did you make? What were the alternatives and why did you settle on the one you did? Identify and discuss three such choices.
What are the components that make up your application and its implementation? Reference your updated component diagram when answering this question.
Thinking ahead, what things would you change about or add to your implementation to make it better?

Do not simply answer each question. Your report should flow smoothly and include easy to read transitions. Your audience is students in this class. Be sure to include a header. Submit the report to the Project report Canvas assignment as a PDF. There is a rubric on the submission page.

Presentation

Finally, you will give a presentation during the final week of class. Do not include your presentation in your repository. Rather, upload a PowerPoint or PDF to the Project presentation Canvas assignment.

The final presentation serves as a way for you to showcase your project to me and your classmates. You should approach it as follows. Pretend you are pitching your application to a potential customer. Your presentation should be polished and easy to digest. You should use some sort of presentation software and a demo should be included. Be sure to satisfy the following criteria (in addition to the rubric!):

introduce yourself
describe what your application is and why it is useful
demonstrate your app
describe your data model and the information flow
describe your API
pick one component you are particularly proud of and clearly present the code for it (this is how we—the customer—will judge how strong of a web programmer you are, so pick something interesting)
your presentation is between 7 and 10 minutes, not to exceed 10 minutes

You will find a rubric on the submission page.

Changelog

2022-10-29
- added a rubric to the Milestone 1 Canvas assignment
- updated instructions for Milestone 2, added a corresponding rubric to the Milestone 2 Canvas assignment
- updated instructions for Milestone 3, added a corresponding rubric to the Milestone 3 Canvas assignment
- updated instructions for Milestone 4 code, added a corresponding rubric to the Milestone 4 Canvas assignment
- added a rubric to the Project report Canvas assignment
- updated instructions for the Project presentation, added a rubric to the Project presentation Canvas assignment