The Web Week 10 LBSC 671 Creating Information Infrastructures.
-
Upload
kerry-fowler -
Category
Documents
-
view
212 -
download
0
Transcript of The Web Week 10 LBSC 671 Creating Information Infrastructures.
![Page 1: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/1.jpg)
The Web
Week 10
LBSC 671
Creating Information Infrastructures
![Page 2: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/2.jpg)
Virtual Private Networks
Intranet
Intranet
a secure private network over the public Internet
Public Internet
virtual “leased line”
![Page 3: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/3.jpg)
Tonight
• Learn to create a Web page
• Think about what the Web “is”
• Talk conceptually about databases
![Page 4: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/4.jpg)
Internet Web
• Internet: collection of global networks
• Web: way of managing information exchange
• There are many other uses for the Internet– File transfer (FTP)– Email (SMTP, POP, IMAP)
![Page 5: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/5.jpg)
Remote Sever
The World-Wide Web
Send Request
Requested Page
Fetch Page
Proxy Server
Local copy ofPage requestedMy
Browser
Internet
![Page 6: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/6.jpg)
HTML(data/display)
Internetcommunication
protocols
RTSPFTPEmail
WebServer
HTTP(transfer)
File System
URL(e.g.,http://www.foo.org/snarf.html)
HTMLHTTPURL
“The Web”
![Page 7: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/7.jpg)
Web Standards
• HTML– How to write and interpret the information
• URL– Where to find it
• HTTP– How to get it
![Page 8: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/8.jpg)
Uniform Resource Locator (URL)• Uniquely identify Web pages
http://www.glue.umd.edu:80/~oard/teaching.html
Domain name
Path
File name
PortProtocol
![Page 9: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/9.jpg)
HyperText Markup Language (HTML)
• Simple document structure language for Web
• Advantages– Adapts easily to different display capabilities– Widely available display software (browsers)
• Disadvantages– Does not directly control layout
![Page 10: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/10.jpg)
“Hello World” HTML<html><head><title>Hello World!</title></head>
<body>
<p>Hello world! This is my first webpage!</p>
</body></html>
This is the header
This is the actual content of the HTML document
![Page 11: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/11.jpg)
Hands On:Learning HTML From Examples
• Use Internet Explorer to find a page you like– http://terpconnect.umd.edu/~oard
• On the “View” menu select “Source” (in IE)– Opens a notepad window with the source
• Compare HTML source with the Web page– Observe how each effect is achieved
![Page 12: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/12.jpg)
Hands On: “Adopt” a Web Page• Modify the HTML source using notepad
– For example, change the page to yours
• Save the HTML source somewhere– In the “File” menu, select “Save As”– Put the name in quotes (e.g., “test.html”)
• FTP it to your ../pub directory on terpconnect
• View it– http://terpconnect.umd.edu/~(yourlogin)/test.html
![Page 13: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/13.jpg)
Tips
• Edit files on your own machine– Upload when you’re happy
• Save early, save often!• Reload browser to see changes• File naming
– Don’t use spaces– Punctuation matters
![Page 14: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/14.jpg)
What’s a Document?
• Content• Structure
– Logical, Physical
• Appearance– Cascading Style Sheets
• Behavior– JavaScript
![Page 15: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/15.jpg)
HTML Document Structure
• “Tags” mark structure– <html>a document</html>– <ol>an ordered list</ol>– <i>something in italics</i>
• Tag name in angle brackets <>– Not case sensitive (unlike XML)
• Open/Close pairs– Close tag is sometimes optional (unlike XML)
![Page 16: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/16.jpg)
Logical Structure Tags
• Head – Title
• Body– Headers: <h1> <h2> <h3> <h4> <h5> – Lists: <ol>, <ul> (can be nested)– Paragraphs:<p>– Definitions: <dt><dd>– Tables: <table> <tr> <td> </td> </tr> </table>– Role: <cite>, <address>, <strong>, …
![Page 17: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/17.jpg)
Physical Structure Tags
• Bold: <b></b>• Italics: <i></i>• Typeface: <font face=“Arial”></font>• Size: <font size=“+1”></font>• Color: <font color=“990000”></font>
![Page 18: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/18.jpg)
(Hyper)Links<html><head><title>Hello World!</title></head><body><p>Hello world! This is my first webpage!</p><p>Click <a href="test.html">here</a> for another page.</p></body></html>
<html><head><title>Another page</title></head><body><p>This is another page.</p></body></html>
index.html
test.html
![Page 19: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/19.jpg)
Hypertext “Anchors”• Internal anchors: somewhere on the same page
– <a href=“#students”> Students</a>• Links to: <a name=“students”>Student Information</a>
• External anchors: to another page – <a href=“http://ischool.umd.edu”>iSchool</a>– <a href=“http://terpconnect.umd.edu/~oard/research.html#email”>email papers</a>
• URL may be complete, or relative to current page– <a href=“video/week2.rm”>2</a>
• File name (in URL) is case sensitive (on Unix servers)– Protocol and domain name are not case sensitive
![Page 20: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/20.jpg)
Images• <img src=“URL”> or <img src=“path/file”>
– <img src=“http://www.clis.umd.edu/IMAGES/head.gif”>– SRC: can be url or path/file– ALT: a text string– ALIGN: position of the image– WIDTH and HEIGHT: size of the image
• Can use as anchor:– <a href=URL><img src=URL2></a>
• Example: – http://www.umiacs.umd.edu/~daqingd/Image-Alignment.html
![Page 21: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/21.jpg)
Tables
eenie mennie miney
mo catch a tiger
by the toe
<table>
</table>
<tr>
<tr>
<tr>
</tr>
</tr>
</tr>
<td> </td><td> </td><td> </td>
<td> </td><td> </td><td> </td>
<td> </td><td> </td><td> </td>
![Page 22: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/22.jpg)
Table Example
<table align=“center”>
<caption align=“right”>The caption</caption>
< tr align=“LEFT”>
<th> Header1 </th>
<th> Header2</th>
</tr>
<tr><td>first row, first item </td>
<td>first row, second item</td></tr>
< tr><td>second row, first item</td>
<td>second row, second item</td></tr>
</table>
![Page 23: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/23.jpg)
XHTML: Cleaning up HTML<?xml version="1.0" encoding="iso-8859-1"?><html xmlns="http://www.w3.org/TR/xhtml1" ><head> <title> Title of text XHTML Document </title></head><body><div class="myDiv"> <h1> Heading of Page </h1> <p> here is a paragraph of text. I will include inside this paragraph a bunch of wonky text so that it looks fancy. </p> <p>Here is another paragraph with <em>inline emphasized</em> text, and <b> absolutely no</b> sense of humor. </p> <p>And another paragraph, this one with an <img src="image.gif" alt="waste of time" /> image, and a <br /> line break. </p></div> </body></html>
![Page 24: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/24.jpg)
Defining Blocks of Text
• <div> … </div>– Named region– Implies a paragraph break, – Can include multiple paragraphs
• <p> … </p>– Individual paragraph
• <span> … <span>– Any region– Does not create a paragraph break
![Page 25: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/25.jpg)
Cascading Style Sheets (CSS)
• Separate content and structure from appearance
• Rules “cascade” from broad to narrow:– Browser default– External style sheet– Internal style sheet– Inline style
![Page 26: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/26.jpg)
Basics of CSS• Basic syntax:
• Example:
Causes– Font to be center-aligned– Font to be Arial and black
selector {property: value}
HTML tag you want to modify…The property you want to change…
The value you want the property to take
p { text-align: center; color: black; font-family: arial }
![Page 27: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/27.jpg)
Different Ways of Using CSS• Inline style:
– Causes only this tag to have the desired properties
• Internal stylesheet:– Causes all tags to have the desired properties
<p style="font-family:arial; color:blue“>…</p>
…<head>…<style type="text/css" > p { font-family:arial; color:blue} </style> </head> <body> <p>…</p>…
![Page 28: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/28.jpg)
Customizing Classes
• Ability to define customized styles for standard HTML tags:
…<head>…<style type="text/css"> p.style1 { font-family:arial; color:blue} p.style2 { font-family:serif; color:red} </style> </head> <body> <p class=“style1“>…</p><p class=“style2“>…</p>…
![Page 29: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/29.jpg)
External Style Sheets• Store formatting metadata in a separate file
…<head>…<link rel="stylesheet" href="mystyle.css" type="text/css" /></head> <body> <p class=“style1">…</p><p class=“style2">…</p>…
p.style1 { font-family:arial; color:blue} p.style2 { font-family:serif; color:red}
mystyle.css
![Page 30: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/30.jpg)
Programming for the Web
• JavaScript [Client-side]– Server embeds a program in HTML– Browser runs the program when it gets to it
• PHP “Common Gateway Interface” [Server-side]– HTML form sends field values to the server– Server passes field values to a program– Program generates a Web page as a response
• Ajax– Server sends browser a generic program to run– Browser and server programs exchange XML-encoded data
![Page 31: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/31.jpg)
JavaScript
<HTML>
<HEAD>
<TITLE>My first script</TITLE>
</HEAD>
<BODY BGCOLOR=WHITE>
<H1>
<SCRIPT LANGUAGE=JAVASCRIPT TYPE="TEXT/JAVASCRIPT">
document.write("Hello, world!")
</SCRIPT>
</H1>
</BODY></HTML>
![Page 32: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/32.jpg)
HTML Editors• Several are available
– Dreamweaver– Microsoft Word (File->”Edit with MS Word” in IE)
• You may still need to edit the HTML file– Some editors use browser-specific features– Some HTML features may be unavailable– File names may be butchered when you upload
• Verbose HTML can make hand-editing difficult
![Page 33: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/33.jpg)
What is the Web?
• Protocols– HTTP, HTML, or URL?
• Perspective– Content or behavior?
• Content– Static, dynamic or streaming?
• Access– Public, protected, or internal?
![Page 34: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/34.jpg)
Why is there a Web?
• Affordable storage– 300,000 words/$ in 1995
• Adequate backbone capacity– 25,000 simultaneous transfers in 1995
• Adequate “last mile” bandwidth– 1 second/screen in 1995
• Display capability– 10% of US population in 1995
• Effective search capabilities– Lycos and Yahoo were started in 1995
![Page 35: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/35.jpg)
64%5%
4%
5%
2%
8%
2%4%
5% 0%
33%
28%
9%
6%
5%
5%
4%
4%
4%2%
EnglishChineseSpanishJapanesePortuguese GermanArabicFrenchRussianKorean
Global Internet Users
![Page 36: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/36.jpg)
Most Widely-Spoken Languages
0
100
200
300
400
500
600
700
800
900
1000
Chinese
Englis
h
Spanis
h
Russian
Frenc
h
Portu
gues
e
Arabic
Benga
li
Hindi/
Urdu
Japa
nese
Germ
an
Nu
mb
er o
f S
pea
kers
(m
illi
on
s)
Secondary
Primary
Source: Ethnologue (SIL), 1999
![Page 37: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/37.jpg)
Global Trade
Source: World Trade Organization 2010 Annual Report
![Page 38: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/38.jpg)
Databases
• Database– Collection of data, organized to support access– Models some aspects of reality
• DataBase Management System (DBMS)– Software to create and access databases
• Relational Algebra– Special-purpose programming language
![Page 39: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/39.jpg)
Structured Information
• Field An “atomic” unit of data– number, string, true/false, …
• Record A collection of related fields
• Table A collection of related records– Each record is one row in the table– Each field is one column in the table
• Primary Key The field that identifies a record– Values of a primary key must be unique
• Database A collection of tables
![Page 40: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/40.jpg)
A Simple Example
primary key
![Page 41: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/41.jpg)
Registrar Example
• Which students are in which courses?
• What do we need to know about the students?– first name, last name, email, department
• What do we need to know about the courses?– course ID, description, enrolled students, grades
![Page 42: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/42.jpg)
A “Flat File” Solution
Discussion TopicWhy is this a bad approach?
Student ID Last Name First Name Department IDDepartmentCourse ID Course description Grades email1 Arrows John EE EE lbsc690 Information Technology 90 jarrows@wam1 Arrows John EE Elec Engin ee750 Communication 95 ja_2002@yahoo2 Peters Kathy HIST HIST lbsc690 Informatino Technology 95 kpeters2@wam2 Peters Kathy HIST history hist405 American History 80 kpeters2@wma3 Smith Chris HIST history hist405 American History 90 smith2002@glue4 Smith John CLIS Info Sci lbsc690 Information Technology 98 js03@wam
![Page 43: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/43.jpg)
Goals of “Normalization”• Save space
– Save each fact only once
• More rapid updates– Every fact only needs to be updated once
• More rapid search– Finding something once is good enough
• Avoid inconsistency– Changing data once changes it everywhere
![Page 44: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/44.jpg)
Relational Algebra
• Tables represent “relations”– Course, course description– Name, email address, department
• Named fields represent “attributes”
• Each row in the table is called a “tuple”– The order of the rows is not important
• Queries specify desired conditions– The DBMS then finds data that satisfies them
![Page 45: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/45.jpg)
A Normalized Relational Database
Department ID DepartmentEE Electronic EngineeringHIST HistoryCLIS Information Stuides
Course ID Course Descriptionlbsc690 Information Technologyee750 Communicationhist405 American History
Student ID Course ID Grades1 lbsc690 901 ee750 952 lbsc690 952 hist405 803 hist405 904 lbsc690 98
Student ID Last Name First Name Department ID email1 Arrows John EE jarrows@wam2 Peters Kathy HIST kpeters2@wam3 Smith Chris HIST smith2002@glue4 Smith John CLIS js03@wam
Student Table
Department Table Course Table
Enrollment Table
![Page 46: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/46.jpg)
Approaches to Normalization
• For simple problems (like the homework)– Start with “binary relationships”
• Pairs of fields that are related
– Group together wherever possible– Add keys where necessary
• For more complicated problems– Entity relationship modeling (LBSC 670)
![Page 47: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/47.jpg)
Example of Join
Student ID Last Name First Name Department ID email1 Arrows John EE jarrows@wam2 Peters Kathy HIST kpeters2@wam3 Smith Chris HIST smith2002@glue4 Smith John CLIS js03@wam
Student Table
Department ID DepartmentEE Electronic EngineeringHIST HistoryCLIS Information Stuides
Department Table
Student ID Last Name First Name Department IDDepartment email1 Arrows John EE Electronic Engineering jarrows@wam2 Peters Kathy HIST History kpeters2@wam3 Smith Chris HIST History smith2002@glue4 Smith John CLIS Information Stuides js03@wam
“Joined” Table
![Page 48: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/48.jpg)
Problems with Join
• Data modeling for join is complex– Useful to start with E-R modeling
• Join are expensive to compute– Both in time and storage space
• But it is joins that make databases relational– Projection and restriction also used in flat files
![Page 49: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/49.jpg)
Some Lingo
• “Primary Key” uniquely identifies a record– e.g. student ID in the student table
• “Compound” primary key– Synthesize a primary key with a combination of fields– e.g., Student ID + Course ID in the enrollment table
• “Foreign Key” is primary key in the other table– Note: it need not be unique in this table
![Page 50: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/50.jpg)
Project
Student ID Last Name First Name Department IDDepartment email1 Arrows John EE Electronic Engineering jarrows@wam2 Peters Kathy HIST History kpeters2@wam3 Smith Chris HIST History smith2002@glue4 Smith John CLIS Information Stuides js03@wam
New Table
Student ID Department1 Electronic Engineering2 History3 History4 Information Stuides
SELECT Student ID, Department
![Page 51: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/51.jpg)
Restrict
Student ID Last Name First Name Department IDDepartment email2 Peters Kathy HIST History kpeters2@wam3 Smith Chris HIST History smith2002@glue
Student ID Last Name First Name Department IDDepartment email1 Arrows John EE Electronic Engineering jarrows@wam2 Peters Kathy HIST History kpeters2@wam3 Smith Chris HIST History smith2002@glue4 Smith John CLIS Information Stuides js03@wam
New Table
WHERE Department ID = “HIST”
![Page 52: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/52.jpg)
Entity-Relationship Diagrams
• Graphical visualization of the data model
• Entities are captured in boxes
• Relationships are captured using arrows
![Page 53: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/53.jpg)
Registrar ER Diagram
EnrollmentStudentCourseGrade…
StudentStudent IDFirst nameLast nameDepartmentE-mail…
CourseCourse IDCourse Name…
DepartmentDepartment IDDepartment Name…
has
has associated with
![Page 54: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/54.jpg)
Getting Started with E-R Modeling• What questions must you answer?
• What data is needed to generate the answers?– Entities
• Attributes of those entities
– Relationships• Nature of those relationships
• How will the user interact with the system?– Relating the question to the available data– Expressing the answer in a useful form
![Page 55: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/55.jpg)
“Project Team” E-R Example
student team
implement-role
member-of
project
creates
manage-role
php-project ajax-project
d
1
1
M
M
1
1
human
client needs1 M
![Page 56: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/56.jpg)
Components of E-R Diagrams• Entities
– Types • Subtypes (disjoint / overlapping)
– Attributes• Mandatory / optional
– Identifier
• Relationships– Cardinality– Existence– Degree
![Page 57: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/57.jpg)
Types of Relationships
1-to-11-to-ManyMany-to-Many
![Page 58: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/58.jpg)
Making Tables from E-R Diagrams
• Pick a primary key for each entity• Build the tables
– One per entity– Plus one per M:M relationship– Choose terse but memorable table and field names
• Check for parsimonious representation– Relational “normalization”– Redundant storage of computable values
• Implement using a DBMS
![Page 59: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/59.jpg)
Normalization• 1NF: Single-valued indivisible (atomic) attributes
– Split “Doug Oard” to two attributes as (“Doug”, “Oard”)– Model M:M implement-role relationship with a table
• 2NF: Attributes depend on complete primary key– (id, impl-role, name)->(id, name)+(id, impl-role)
• 3NF: Attributes depend directly on primary key– (id, addr, city, state, zip)->(id, addr, zip)+(zip, city, state)
• 4NF: Divide independent M:M tables– (id, role, courses) -> (id, role) + (id, courses)
• 5NF: Don’t enumerate derivable combinations
![Page 60: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/60.jpg)
Normalized Table Structure
• Persons: id, fname, lname, userid, password• Contacts: id, ctype, cstring• Ctlabels: ctype, string• Students: id, team, mrole• Iroles: id, irole• Rlabels: role, string• Projects: team, client, pstring
![Page 61: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/61.jpg)
A More Complex ER Diagram
cadastral: a public record, survey, or map of the value, extent, and ownership of land as a basis of taxation. Source: US Dept. Interior Bureau of Land Management,Federal Geographic Data Committee Cadastral Subcommittee http://www.fairview-industries.com/standardmodule/cad-erd.htm
![Page 62: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/62.jpg)
Key Ideas
• Databases are a good choice when you have– Lots of data– A problem that contains inherent relationships
• Design before you implement– This is just another type of programming– The mythical person-month applies!
• Join is the most important concept– Project and restrict just remove undesired stuff
![Page 63: The Web Week 10 LBSC 671 Creating Information Infrastructures.](https://reader037.fdocument.pub/reader037/viewer/2022110400/56649dbe5503460f94ab13ba/html5/thumbnails/63.jpg)
Before You Go
On a sheet of paper, answer the following (ungraded) question (no names, please):
What was the muddiest point in today’s class?