Integrated Data Browser: Web & Android App Development

1. Team Project: PITCH, PROPOSAL & BEYOND PITCH: DESCRIBE A WEB OR ANDROID APPLICATION, IN PAIRS PROPOSAL: FLESH OUT SELECTED PROJECT IN TEAMS PHASES I – III: ALL PLANNING, DEVELOPMENT, TESTING PROVIDED BASED ON SCHEDULE OF DELIVERABLES PHASE IV: REFACTORING, DESIGN PATTERNS, FINAL PRESENTATION AND REPORT

2. Create a working web application or a working Android application • Purpose: • Working on this project should be training on how to go about approaching a project • The project should yield real results • Identifying a need • Designing a solution • Building a working prototype of this solution • Identifying key issues around taking prototype to a useful product • Project will be carried out in 4 phases • Each phase will produce a vertical slice of the complete application • Requirements, design (except for refactoring), development and testing complete at the end of phase III • Choose a different project leader for each phase Project Summary

3. Create a web app that emulates IMDB to provide useful information about some topic. • Example: Guardians of Wilds: endangered species (species, locations, threats) • Example: Know Your Treatment • The data presented must be the integration of at least three disparate data sets to reveal some interesting result. • The project must meet several criteria: • must be unique – first come, first served • must have at least three data sources that can be programatically scraped • must have at least three models (e.g., movies, actors, ...) • each model must be connected to at least two other models • every instance of each model must have some kind of multimedia (i.e., image, video) • every instance of each model must be rich with different content (e.g., descriptions, feeds, maps, multimedia, etc.) • add searching and sorting to each model page Team Project IDB: One Option

4. Group project with 4 phases and one public repo used across all phases • Group must collaborate using: • GitHub issue boards • Slack (integrated with repo) • Phase I • Due approximately 4 weeks into semester • Provide at least 5 user stories and put them on issue boards • Collect data on three instances of each model from sources with a RESTful API • Create a static website with at least 14 pages hosted on AWS or GCP • Derive the stats on the About page, dynamically, from GitHub • Use bootstrap as a CSS framework • Obtain a URL from a hostname provider (e.g., Namecheap) • Write a report IDB Application

5. Phase II • Due approximately 2-3 weeks after phase I • At least 5 additional user stories on issue boards • Collect data on MANY instances of each model from sources with a RESTful API • Create a dynamic website with many pages hosted on AWS or GCP • Use mySQL, PostgreSQL, Datastore, mongoDB, etc. as a DB • Use JavaScript and React as a GUI framework for the frontend • Add pagination to the model pages • create unit tests of the RESTful API using Postman • create unit tests of the JavaScript code using Mocha • create unit tests of Python code using unittest • create acceptance tests of the GUI using Selenium • Refine the report • Report should include testing plan and UML diagrams describing the design of your application IDB Application

6. Due approximately 2 weeks after phase II deadline Provide at least 5 more user stories and put them on your issue boards Refine the data on many instances of each model Refine the RESTful API using Postman Refine the dynamic website with many pages hosted on AWS or GCP Add filtering, searching and sorting to the model pages Searching must be Google-like and handle many terms The search results must highlight the search terms and be categorized by model Refine the unit tests of the RESTful API using Postman Refine the unit tests of the JavaScript code using Mocha Refine the unit tests of Python code using unittest Refine the acceptance tests of the GUI using Selenium Refine the technical report – update with new requirements, design, and tests IDB Application: phase III

7. Due approximately 2 weeks after Phase III deadline, about 2 weeks before end of semester No new development/functionality/features in this phase Refactor, apply design patterns Make the code as pretty inside as it is on the outside Create a presentation and final report IDB Application: Phase IV

8. Pages: • Navbar – every page • Splash • Model 1 • Model #2 • Model #3 • About • Splash – one page • carousel • make it beautiful • with a way to navigate among pages • Models – at least three pages, one per model • grid of all the instances of that model • with at least nine instances per page • with at least three attributes of that model showing • with links to those instances • Model #1 – many pages, one per instance • data • external links • embedded images (e.g., Bing, Flickr, Google) • embedded videos (e.g., Bing, Google, Vimeo) • embedded maps (e.g., Google maps) • embedded social network feeds (e.g., Facebook, Twitter) • links to Model #2, links to Model #3 Team Project – IDB web application • Model #2 and #3 – similar to pages for Model #1 • links to other two models • About (Required for all applications) • description of the site, its purpose, its intended users • explanation of the interesting result of integrating disparate data • the group name • the group members • for each member: name, photo, bio, major responsibilities, number of commits, number of issues, number of unit tests • stats: total number of commits, total number of issues, total number of unit tests • data: links to the data sources, description of how each was scraped • tools: tools used, describe their use • link to the GitHub repo

9. Website that facilitates playing fantasy golf • This application has a faculty member as customer – if you choose this application, you will need to meet with the faculty member and meet his requirements • Create a game that focuses on the four major golf tournaments, but web site could work for any tournament • Participants in "challenge" draft golfers from players in tournament that week • Results of challenge based on how those golfers perform • Various standard bets, optional additional bets specific to tournament • Tournaments run Thursday to Sunday • draft held just prior to start, after golfers finalized • Requirements – partial list: • Two types of logins for site: admins, users. Password protected. • Database for player and team info for each event – players chosen, which draft round they were picked, their scores for each round of golf • Ability to enter draft results as they happen • Challenge website should automatically update from real-time player scores and update the database • Publish results in real-time Another Suggestion: Fantasy Golf

10. This is a group project with one Github repo that all members will use. • For the last phase of the assignment, you will refactor your project code and apply design patterns. You will be asked to document thorough testing of your application (unit tests, acceptance tests... manual testing is not sufficient). You will be asked to update and refine your design, including your UML diagrams. • Collaborate with your team using: • Github project boards • Slack (integrate with Github repo) • Use GitHub issue tracker– you will be graded on the quality of the issues and the number of (closed) issues. • User stories – on Github project boards • at least 15 user stories • user stories must be described in three sentences or less • discuss, include assumptions, refine • see https://www.mountaingoatsoftware.com/agile/user-stories • Different project lead for each phase • 5-6 students per team – must identify 2 two hour blocks when you can all meet weekly • Grad students may not work on teams with undergrads Team Project: General Requirements

11. Must use GitHub (one repo), issue boards, integrated slack, and have an About page with the required info (see other slides) Prepare a detailed description of the tasks completed and functionality that will be delivered in each phase Think about your testing plan early – manual testing is not sufficient. What tools will you use to test the frontend, backend, interface? Think about coverage. Use cases: your application must have at least six distinct use cases Rich with multimedia: images, video, information, twitter feeds, etc. Database use: what sources? How to scrape? What data will be stored in the database? Significant amount of data should be stored in database, not just user preferences or other user information, for example. Project features/functionality must be approved. Each phase must be a vertical slice of the entire project and produce a functional, deployed version. Team Project

12. Project pitch will be done in pairs – we will vote on the proposed projects that we prefer to implement • Proposal: Teams flesh out details of their project – build on pitch • Phase I should include: • at least 5 user stories on issue boards, some data collection (can be minimal), a static, deployed site with at least 5 pages hosted on AWS or GCP • Stats derived on the About page, dynamically, from GitHub • URL from a hostname provider (Namecheap) • Report • Phase II should include: • at least 5 additional user stories on issue boards • collection of a lot of data from your sources • refinement of your API • creating a dynamic website with many pages hosted on AWS or GCP • Database with MySQL, PostgreSQL, or ... • GUI framework for frontend (JavaScript and React, or ...) • Report refinement Project Phases

13. Phase III • at least 5 more user stories – put them on your issue boards • Finish data collection • Refine your dynamic site with many pages hosted on AWS/GCP • Refine and add to your unit tests of the API, your JavaScript code, your Python code (what tools will you use?), refine the GUI tests using Selenium • Add to and refine the technical report • Phase IV • Development is completed in phase III • Refactor, apply design patterns • Finish your final project report • Create a presentation and put it on GitHub as a pdf (not required until you present) Project Phases

14. The proposal Describe your problem and its solution and users What you will deliver in each phase Requirements and UI Description Competitive Analysis Feasibility

15. Proposal (max 6 pages, 11 pt font, including figures) Project title and Team Information Vision and Motivation Data sources Requirements Interface Feasibility Phase deliverable schedule Tools, APIs and Services Presentation: 3-4 slides, no more than 5 minutes Proposal Deliverables

16. What is the problem? What is your product and what need does it fill? For whom? What alternatives are available? Extensive competitive analysis. What is novel about your proposed application? What are the “silver bullets”? Vision

17. Application must have at least six distinct use cases What can user do with application? Describe all functionality at high level. Formalize 2 use cases with UML use case diagrams and user stories Mocks: use balsamiq (or Google docs, or Visio, or something of that sort) Requirements & UI By Kishorekumar 62, CC BY-SA 3.0, https://commons.wikimedia.org/w/index.php?curid=7880320 https://www.romanpichler.com/blog/10-tips-writing-good-user-stories/ https://commons.wikimedia.org/wiki/File:Profilewireframe.png

18. Don’t overlook the non-functional requirements • Performance • E.g., response times, accuracy of results, etc. • Storage requirements • Cost per user for deployment Non-Functional Requirements

19. Timeline: key dates, effort required in number of hours, roles • Schedule: • Break project into the 4 required phases • Each phase is a vertical slice of the application • Detailed description of what functionality will be delivered in each phase • Detailed time estimate of phase I • For each feature that is part of your phase I deliverables, include a time estimate • Plan It Poker Planning & Scheduling

20. What are your sources? How do you plan to scrape them? Will you be allowed to scrape them? RESTful APIs? Investigate your data sources. What data will be stored in your database? Data Sources, Scraping and Database

21. What tools will you use: • For the user interface, design, development, database backend, testing? • E.g., what tools will you use to test: frontend, database backend, integration of frontend and backend, user interface • Take advantage of your team's prior experience and expertise Tools, APIs, Services

22. Things that may lead you to fail • Lack of familiarity with APIs • Unable to deliver on performance • Cost excessive • Existing projects: can you improve upon existing solutions? • Too many features (prioritize) • Third party APIs/service may not be reliable • Should not be generic • Not a general list of issues that would apply to any application Feasibility

23. Don’t reinvent the wheel • Scheduled tasks  AppEnginecron, Quartz library • Build community reporting on Twitter/FB • Get something that’s simple and working first • “Customer”/staff feedback may lead to major changes • Use what you’re familiar with (AppEngine vs. AWS) • Think mashup: integrate Google search results with Twitter feed • Have a learning plan: tutorials, strawman exercises General Project Issues

24. HTML/CSS, HTML Forms, Java URL, Java Sockets, Android UI, Sqlite libraries Tomcat, Java Jetty, GSON, Java Entities, jquery, opencv, Django, GWT, Quartz, htmlparser, Junit, iText, Java Runtime Postman, Selenium, unittest, Mocha React, Angular, bootstrap mySQL, PostgreSQL Facebook/Google single sign on, cloud storage, SMTP provider, SMS service Useful APIs, Services, Tools

25. Think about what is important in your special case • You don’t have to have a specific format to your proposal or presentation • Think about the clearest and most direct way to present your ideas • Don’t bore us with things that are not relevant • It’s really important to understand the context • What apps are similar to yours? • What tools and frameworks will help you out? How will you use them? • What unknowns remain? It’s good to know this up front! Notes

26. Amazon Web Services (AWS) Bootstrap Flask GitHub Projects Namecheap Plan It Poker PostgreSQL Postman React RESTful APIs Slack SQLAlchemy Other Tools to Consider...

27. http://utravel461l.appspot.com http://paintchat.info http://puzzleme461.appspot.com/ APT Projects Samples

28. Questions?