Powerpoint presenation and demo of working program

Fall 202 2 CIS 525 Date last modifie d: 202 2_12_06 FINAL PROJECT Implementation Your website should have at least the following functionality. Everything in HW8 + HW9 and: 1. Login/logout, Signup / Register, (CRUD) A. Create a new user (if username already exists, error message to user) a. User f orm validation. (email is correct f ormat), username , password, conf irm password b. If there are any errors, your program must highlight the error input and keep the correct inputs. You should not ask a user to “go back” to the previous page or input ev erything again. 2. Proper use of Web APIs (Front End, Back End, DB) – As stated in HW 9 3. Authentication and Authorization f or the API’s – if not logged in, but requires authentication, then do not display page, redirect instead. 4. (OPTIONAL) Use partial page reloading, Asynch (JS with f etch or f etch like properties ) A. When user selects a f ilter (a drop down box, etc.) another objects data should be f iltered but without a f ull page reload. 5. Use public API, look Google maps, etc (but must have at least Google Analytics *) Need to start collecting data asap. *Remember this will show data across time so you want to have at least a f ew weeks worth of data) - data may take up to 24 hours to pro cess. 6. Stale session (20 min, of inactivity), user logged out, (data is not saved) - but f or demo and testing purposes set to 10 secs. 7. (OPTIONAL) Password complexity implementation (check Upper -case, lowercase, at least one number, special symbol, at least 8 char in length) Highly recommended of two or more team members: 8. Inf inite scroll, web page pagination. Highly recommended of three or more team members : 9. Data Integrity (Proof when trying to create duplicate object that should be unique ) 10. Cookies conf irmation (this website uses cookies, proceed?) 11. Forgot password – (use security question and answer) -when creating a new user account. OPTIONAL 1. *two factor au th en tication 2. Use h ttps, or certificate 3. ADA 4. Support Mobile view 5. Dif f erent Permission level (certain webpages visible or certain CRUD) (optional) 6. Print - (Order or Comment -article if Blog) Fall 202 2 CIS 525 Date last modifie d: 202 2_12_06 PROJECT CHECKLIST: Page Layout – All pages - Good use of HTML/CSS/JS for the visual part – should be consistent look and feel. In total around 5 to 8 web pages, use Navigation with Links 1. Home (landing Page) - No Auth required ( Intro /summary of your website ) Should have at least login, about us, contact us, view (your theme) by all (like HW8), by filter (like HW9) Login page • Should have at least: • First and Last Name • Username (unique username) • Password * confirm password - Case Sensitive • (Teams of 2 or more) Password must have at least? 1 uppercase, 1 lowercase, and special characters, rest of letters (at least 8 char long) • (Teams of 3 or more) Security hint (for forgot password) About Us Should be visible without logging in (give basic information to users before they create an account) Contact Us (example of Create record with different data) Should be visible without logging in (adds user input data from contact us to your DB, optional send email instead of only saving in DB) Order page ( related to your Theme page) requires authentication to view Other pages related to your theme (might or might not require authentication) All pages should have title, proof of HTML check and CSS check (w3 validation) Simple SEO implementation (use in head section) ALT tags FavIcon (32 X 32 for web browsers) (256 X 256 for mobile) Consistent format for overall website and for webpages. For example, navigations links on left or top, font types, colors. Spell check Google Analytics * Required. Start collecting Data ASAP. All past imple mentations from HW3, 4 Fall 202 2 CIS 525 Date last modifie d: 202 2_12_06 Final Documentation (NOT LONGER REQUIR ED) SKIP T HIS PAGE Goto Final Presentation Page (NEXT PAGE) The f inal report will consist of two parts: a 20 -40 page paper, and a 20 -25 minute presentation. The f inal paper should take a f orm of a well -written technical paper (good f ormatting) . It should include the f ollowing components: Title page, TOC, clear images where needed and much more detailed than your presentation. 1. Title and Team members names and section, Date, Course, University 2. A web link to your project (publicly accessible) – your demo needs to be to a public URL (not f rom your local computer) . 3. Description of motivations and goals f or the project: what did you build and why is it Interesting to you. 4. System implementation : all Three -tiers, Architecture (technical ), Deployment (hosted) , why did you choose specif ic architecture. 5. Website Navigation (hierarchy) – Also include authentication rules (time out, redirect if not logged in) 6. Detailed description of the design and implementation of the system , A. Each web page sho uld have its own heading section with detailed inf ormation about the webpage: the summary or purpose, the GUI, the Web API, any validation . B. Data model: database schema (relationship diagram) or you can explain in words. C. System components and f unctions: a ctivity diagram, sequence diagram, etc. or explain in web page summary. D. User interf ace design (Header, Footer, Lef t or right, CSS high level overview) E. Document what team member was responsible f or what part of the project 7. Results of a system evaluation: p resent results that show that your system design and implementation meet the initial goals. (online HTML/CSS validator, Debug tools, webpage metrics/perf ormance) 8. Google Analytics, explain results, show dif f erent views by platf orm, by device, etc.) 9. Outstanding Issues or Future plans 10. What did you learn ? Both technically and high level (working with teams, data availability, etc. ) f rom this project? Fall 202 2 CIS 525 Date last modifie d: 202 2_12_06 Final Presentation (PowerPoint or google Slides) Required f or students in sec 001, online students will record the presentation and upload to canvas. Should be around 5 to 10 min f or slides and around 15 to 20 10 min f or live demo (total no more than 25 15 min) Short high -level (try to use short phrases and not paragraphs ) overview of your project bef ore you live demo Topics to include: *** similar to the list f rom the Final Documentation, except summarized version *** o Title and Team members Names, Co urse Name . • A web link to your project (publicly accessible) • Description of motivations and g oals f or the project: what did you build and why is it Interesting to you. • System implementation – high -level architecture • Website Navigation (hierarchy) – Also include authentication rules (time out, redirect if not logged in) • Results of a system evaluati on: present results that show that your system design and • implementation meet the initial goals. (online HTML/CSS validator, Debug tools, webpage metrics/perf ormance) – show 1 page result and if you made changes to imp rove. • Include Google Analytics page. • Outstanding Issues or Future plans • What did you learn ? Both technically and high level (working with teams, data availability, etc. ) f rom this project?