1 / 29

Building CMUBook Web Application: Phase-I Homework

Create a simple web application similar to Facebook with registration, photo upload, search, and more. Develop top-level information flow diagrams, entity relations, and schema design. Utilize JSP for user interactions and Java for processing logic. Learn about multi-tier web application architecture and database design methodology. Complete tasks like user registration, login/logout, photo tagging, and friendship management.

paloma
Télécharger la présentation

Building CMUBook Web Application: Phase-I Homework

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. School of Computer Science 15-415 Fall 2009 RecitationHomework 9 Building A Web Application Phase-I Leman Akoglu 11/4/2009

  2. HW9 Outline • Building a simple Web application (CMUBook) using JSP • 2 phases • Phase I : design and documentation • due 11/10  next Tue! • hard copy in class • Phase II : implementation • due 11/19 • both hard copy in class and via email.

  3. description req. anal. conc. mod. impl.+test. task emul. sys. anal. top level I.F.D. task + doc forms. schema. code. tests user’s man. pseudo-code Database Design Methodology [N. Roussopoulos and R.T. Yeh]

  4. description req. anal. conc. mod. impl.+test. task emul. sys. anal. top level I.F.D. task + doc forms. schema. code. tests user’s man. pseudo-code Phase-I Phase-II

  5. Recitations Phase-1 • 11/4 2:30pm-3:20pm DH 2122 • 11/4 3:30pm-4:20pm DH 2105 11/10 • 11/11 2:30pm-3:20pm DH 2122 • 11/11 3:30pm-4:20pm DH 2105 • 11/18 2:30pm-3:20pm DH 2122 • 11/18 3:30pm-4:20pm DH 2105 11/19 Phase-1 due Phase-2 Q&A Phase-2 due  Send additional questions to lakoglu@cs.cmu.edu

  6. Today’s Outline • Homework 9 description • Data requirements • Functionality requirements • Deliverables • Top-level Information Flow Diagrams (IFDs) • Document forms • Entities & Relations • Schema (in BCNF or 3NF)

  7. description req. anal. conc. mod. impl.+test. task emul. sys. anal. top level I.F.D. task + doc forms. schema. code. tests user’s man. pseudo-code Phase-I Phase-II

  8. Homework 9 CMUBook • A mini web application like Facebook • Users could upload/tag photos, add friends, etc. Tasks to implement • Registration • Login/Logout • Photo Upload • Photo Browsing • Photo Tagging • Profile Review • Search by User Name • Friendship Management • Reporting

  9. description req. anal. conc. mod. impl.+test. task emul. sys. anal. top level I.F.D. task + doc forms. schema. code. tests user’s man. pseudo-code Phase-I Phase-II

  10. Top level information flow diagram reg. form T1-reg. user rec. external doc.s (web forms) tasks internal doc.s (db tables) System boundary

  11. More on top level diagram T2 - login reg. form login form profile form T1-reg. ? ? ? user rec.

  12. description req. anal. conc. mod. impl.+test. task emul. sys. anal. top level I.F.D. task + doc forms. schema. code. tests user’s man. pseudo-code Phase-I Phase-II

  13. Document + Task forms • Task forms and task list • not required for this homework • Document forms and document list • D1: registration form • D2: login form • D3: profile form • … • Dx: user record • … external internal

  14. Document forms D1: registration form • login name • password • name • … • D3: profile form • name? • List-of: • photo-id (URL) ? • friend-id (login name) ? • … Dx: user record • login name • password • name • …

  15. description req. anal. conc. mod. impl.+test. task emul. sys. anal. top level I.F.D. task + doc forms. schema. code. tests user’s man. pseudo-code Phase-I Phase-II

  16. passw login URL email owns E-R diagram for CMUBook ... ?-2 ?-1 ?-1 ... user photo • How about friendships, photo tags, …? • ?-1: Specify cardinalities • ?-2: Think about weak/strong entities

  17. Relational schema user( login, passw, name, email-add.) photo( URL, … ) ? …. SQL DDL statements create table user (login char(20), passw char (20) NOT NULL (?), … ); create table photo (URL char(200), … ); ...

  18. description req. anal. conc. mod. impl.+test. task emul. sys. anal. top level I.F.D. task + doc forms. schema. code. tests user’s man. pseudo-code Phase-I Phase-II

  19. Task emulation/pseudo-code Task1: Registration read login, password, name and email if ( login does not exist in ‘user’){ insert into user values ( :login, :password, :name, :email); } else{ print “error: login exists, choose another” } should be valid SQL queries

  20. description req. anal. conc. mod. impl.+test. task emul. sys. anal. top level I.F.D. task + doc forms. schema. code. tests user’s man. pseudo-code Phase-I Phase-II

  21. Phase II You will develop • JSP pages that handle user interactions • Processing logic written in Java class • Manipulating data in database, connect from JSP to database using JDBC

  22. Outline of the next recitation • Schema outline • A Typical Web Application Architecture • CMUBook architecture • Brief introduction to JSP • JSP mini demo  register.jsp • Session and cookie management  login.jsp • Exceptions • MVC (Model-View-Controller) pattern (optional) • Better Software Design

  23. Web Application ArchitectureMulti-tier architecture Web Server Apache, Tomcat, Windows IIS Client Backend Server http e.g. RMI Java Virtual Machine Web app (JSP, ASP, PHP) Users Web app backend component JDBC ODBC Database Server

  24. Homework 9:CMUBook architecture Web Server newcastle.db.cs.cmu.edu Client Browser PostgreSQL Database Server newcastle.db.cs.cmu.edu Tomcat 5.5 http User hw9 database JDBC CMUBook JSP, Java

  25. CMUBook architectureRegistration example –register.jsp 1 http://newcastle.db.cs.cmu.edu:8080/lakoglu415/register.jsp Web Server newcastle.db.cs.cmu.edu Client Browser PostgreSQL Database Server newcastle.db.cs.cmu.edu Tomcat 5.5 4 2 JDBC exec. query java.sqlStatement.executeUpdate() html page with input FORM User hw9 database CMUBook JSP, Java 3 Submit FORM with login, name, password and email register.jsp 5 JDBC insert succeeds 6 Html page with successful info

  26. (Optional) Better Software Design? • Design Pattern • Design Patterns: Elements of Reusable Object-Oriented Software, Gamma, Erich; Richard Helm, Ralph Johnson, and John Vlissides • Thinking in Patterns (http://www.mindviewinc.com/downloads/TIPatterns-0.9.zip) • Design Pattern for Web App: • MVC pattern (Model – View – Controller) • Basic idea: break software functionalities and interfaces • Tool: struts

  27. (Optional) MVC

More Related