CS373: Software Engineering



Project #4: IDB3

Specification

  • Create a cross-platform, responsive, Web app that emulates IMDB to provide helpful information about some topic.
  • The project must meet several criteria.
    • must be unique, first come, first served
    • must have at least three data sources that can be programmatically scraped (at least one must be a RESTful API)
    • must promote civic engagement about an underserved community
    • must have at least three models
    • each model must be connected to at least two other models
    • every instance of each model must be rich with different media (e.g., feeds, images, maps, text, videos, etc.) (be very sure about this)
  • This is a group project with four phases and only one public repo will be used across all phases.
  • The group must collaborate using:
  • For the purposes of grading, do not change the production website between the time that you submit it and the time that it is graded.

Phase III

  • provide an assessment and at least five more user stories for your developer and put them on their GitLab issues with the Customer label
  • refine the data on three instances of each model (at least one must be a RESTful API)
  • refine the RESTful API using Postman
  • refine the dynamic website with many pages hosted on Amazon Web Services (AWS) or Google Cloud Platform (GCP)
  • It is your responsibility to not outspend the free credits on either of those systems.
  • add filtering, searching, and sorting to all of the model pages
  • searching must be Google-like and handle many terms
  • the search results must highlight the search terms and result in cards (exactly like in the model pages)
  • refine the unit tests of the RESTful API using Postman
  • refine the unit tests of the JavaScript code using Mocha or Jest
  • refine the unit tests of the Python code using unittest or PyTest
  • refine the acceptance tests of the GUI using Selenium
  • create a DB diagram using DB Diagram and put it on GitLab as a IDB.db.pdf
  • refine the UML diagram using PlantUML and put it on GitLab as a IDB.uml and IDB.uml.svg
  • write an AI report using Grammarly and put it in README.md
  • refine the technical report using Grammarly and put it in README.md
  • refine the documentation of the RESTful API to the technical report

Groups

  • The groups will be set up on Canvas.
  • The channels will be set up on Discord.
  • Pick a different project leader for each phase.

Pages

Page Features
Navbar

every page

  • Splash
  • Model #1
  • Model #2
  • Model #3
  • About
Splash

one page

  • make it beautiful (e.g., a slideshow)
  • with a way to navigate among the pages
  • with useful introduction to the site
Models

three pages
one for each model

  • grid of cards
  • each card must have unique image
  • at least five attributes on each card
  • attributes must be filterable and sortable
  • page must show total number of instances and pages
  • cards link to those instances
Model #1

three pages
one for each instance

  • data
  • external links
  • embedded images (e.g., Google)
  • embedded videos (e.g., YouTube)
  • embedded maps (e.g., Google Maps)
  • embedded social network feeds (e.g., Twitter)
  • must have at least two of the above media
  • cards to Model #2
  • cards to Model #3
  • reuse instance formatting between models, if you can
Model #2

three pages
one for each instance

  • data
  • external links
  • embedded images (e.g., Google)
  • embedded videos (e.g., YouTube)
  • embedded maps (e.g., Google Maps)
  • embedded social network feeds (e.g., Twitter)
  • must have at least two of the above media
  • cards to Model #1
  • cards to Model #3
  • reuse instance formatting between models, if you can
Model #3

three pages
one for each instance

  • data
  • external links
  • embedded images (e.g., Google)
  • embedded videos (e.g., YouTube)
  • embedded maps (e.g., Google Maps)
  • embedded social network feeds (e.g., Twitter)
  • must have at least two of the above media
  • cards to Model #1
  • cards to Model #2
  • reuse instance formatting between models, if you can
About

one page

  • description of the site, its purpose, its intended users
  • the group members
  • for each member
    • name
    • photo
    • bio
    • major responsibilities
    • no. of commits
    • no. of issues
    • no. of unit tests
  • stats
    • total no. of commits
    • total no. of issues
    • total no. of unit tests
  • data
    • links to the data sources
  • tools
    • tools used
    • describe their use
    • special focus on optional tools that were not required
  • a link to the GitLab repo
  • a link to the Postman API

Peer Reviews

README.md

  • Profile
    • Full Name
    • EID
    • GitLab ID
    • GitLab URL
    • GitLab Pipeline
    • Git SHA
    • HackerRank ID
    • Estimated completion time
    • Actual completion time
    • Comments
  • AI Report
    • Summary of AI Interactions
      • List the tools used (e.g., ChatGPT, Copilot, etc.).
      • Debugging help (error explanation, bug location, runtime issue)
      • Conceptual clarification (CS concept, syntax, algorithm idea)
      • Code improvement (style, efficiency, readability, testing)
      • Alternative approaches (asking “is there a simpler way?”)
      • Other (describe)
    • Reflection on Use
      • What specific improvements to your code or understanding came from this AI interaction?
      • How did you decide what to keep or ignore from the AI’s suggestions?
      • Did the AI ever produce an incorrect or misleading suggestion? How did you detect that?
    • Evidence of Independent Work
      • Paste a before-and-after snippet (3–5 lines max) showing where you changed your own code in response to AI guidance.
      • In 2–3 sentences, explain what you learned by making this change.
    • Integrity Statement
      • "I confirm that the AI was used only as a helper (explainer, debugger, reviewer) and not as a code generator. All code submitted is my own work."
  • Technial Report
    • motivation
    • user stories
    • RESTful API
    • models
    • tools
    • hosting
    • the audience comprises other software developers, as opposed to users
    • format the report clearly, attractively, and consistently, using good sections, multiple pages, good headers, figures, and grammar
    • Grammarly

Submission

  • create a public code repo, https://gitlab.com/GitLab-ID/cs373-group-N/
  • enable issues here: Settings -> General -> Visibility, project features, permissions -> Issues
  • create issue labels here: Manage -> Labels (labels are case sensitive)
  • create issues
  • add and close new issues as you debug and develop your solution
  • Canvas doesn’t support submitting Markdown files.
  • So, make a copy of README.md into README.md.txt.
  • Your README must contain your AI Report.
  • Submit README.md.txt to the Canvas assignment.

Resources

  • if you discover other useful resources, please post them on Ed Discussion

Rubrics

Assets Location Points
1. Build Files
  • .gitignore
  • .gitlab-ci.yml
  • makefile
  • README.md
 5
2. Issues
  • at least 30 issues
  • you must use issue labels (e.g., Backend, Customer, Frontend, Grader, etc.)
  • GitLab Issues
 5
3. User Stories
  • GitLab Issues
 5
4. RESTful API 10
5. Backend Server
  • backend/main.py
 10
6. Frontend Server
  • frontend/index.js
 10
7. Tests 10
8. Website
  • custom domain namne
  • navbar
  • splash page
  • about page
  • model pages
  • instance pages
  • searching
  • search results must result in cards (exactly like in the model pages)
 10
9. About Page
  • description
  • members
  • stats (automated)
  • data sources
  • tools
  • GitLab URL
  • Postman URL
 5
10. Model Pages
  • three pages
  • grid of cards
  • at least nine cards per page
  • each card must have a unique image
  • five attributes for each card
  • number of cards
  • number of pages
  • pagination: next, previous. first, last
 5
11. Instance Pages
  • many pages
  • lots of text
  • embedded multimedia
  • links to other instances as cards (exactly like in the model pages)
 5
12. DB diagram
  • IDB.db.pdf
 5
13. UML diagram
  • IDB.uml
  • IDB.uml.svg
 5
14. Technical Report
  • could another team takeover
  • README.md
 10
15. AI Report
  • summary, reflection, evidence, integrity
  • README.md
 10

Copyright © cs373, 2008-2026
Updated 20 Mar 2026