Download presentation
Presentation is loading. Please wait.
1
1 Accelerated Web Development Course JavaScript and Client side programming Day 2 Rich Roth On The Net http://east.on-the-net.com/neu 413-586-9668 - rich@on-the-net.com
2
2 Day 2 outline n Database Connectivity overview n Calendar Example n Lab work on your web sites –Mixed with discussion of JS Language –and individual review of assignment
3
3 Browser Text Rendering Engine Client/Server - What is it ? Web Server HTML file transfer
4
4 Browser Text Rendering Engine Programming Language(s) Client/Server - Programmable Web Server HTML file transfer CGI External Program
5
5 Browser Text Rendering Engine Programming Language(s) Client/Server - Programmable Forms: 1) GET - on URL 2) POST - stdin Socket: To data server process
6
6 CGI: Common Gateway Interface n Based on passing form contents to program outside the web server. n Fields on forms are only HTML controllable information n Hidden fields are used to pass NON-user entered information.
7
7 CGI Data Passing to program n GET: –Information on URL of next page –Easy to bookmark n POST: –Passed as into to program –Not visable –Can NOT be bookmarked
8
8 CGI returning data n CGI Program creates a new web page n Page created totally by the program. n Program ‘populates’ template with meaningful data n Template written in HTML like statements n XML
9
9 Server Template <HTML><table> Col one Col 2 Col one Col 2 [col1] [col2] [col1] [col2] </table></HTML>
![9 Server Template <HTML><table> Col one Col 2 Col one Col 2 [col1] [col2] [col1] [col2] </table></HTML>](http://images.slideplayer.com./24/7485255/slides/slide_9.jpg "9 Server Template <HTML><table> Col one Col 2 Col one Col 2 [col1] [col2] [col1] [col2] </table></HTML>")
10
10 Programmable Socket n Client side applet opens socket to server n Only server allowed is one applet was loaded from - (security sandbox) n Socket is two way connection. n Program on client asks/sends info to server n Server is usually a custom data server or standard interface to a database.
11
11 Data Server n Can Custom code or standard method n Standards: –ODBC - Open data base connector (MS) –JDBC - Java DB connector (SUN) –All requests done using SQL n Connector talks to Database server n JS can call Java applet or JavaBean to provide logic
12
12 SQL - Standard Query Language n Embedded Language –Built on top of a standard language n A Database consists of a group of Table n Each Table has Row and Columns n Each Column is a specific data element n Each Row is a record of data elements that group together n Each Row has a unique Identifier n Tables are in ‘Third Normal Form’ (kinda)
13
13 Sample SQL Database n Table: Students –Columns: Student ID, Name, DOB, Major –One Row per student n Table: Classes –Columns: Class No, Room, Time, Grade Level –One Row per Class n Table: Attendence –Columns: Class No, Student ID –One row per student per class
14
14 Using Existing Scripts: Objects n Window –Document »Anchor, Applet, Area »Form: Form elements »Image, Link –History –Location
15
15 Built-in Objects, Data and Events n Properties: –Data of an object n Methods: –Actions on an object n Naming: –Property: Object.property.subproperty –Method: Object.property.subproperty()
16
16 Programming techniques n Basic Logic Flow –Variables: literal, ‘var’ –Objects: ‘new’, no inheritance –if/then/else –Loop: »for, while, for … in »Break, Continue –Functions n Expressions
17
17 Finding Javascript programs n Archives: –Javascript.com –See Class notes –Check Search engines n Books: –Get with Cdrom or disk, so don’t have to retype n Pages you like n Ownership and Copyright
18
18 Homework n Find a script that fits into your site design n Create a test page using that script n Define what about the script needs changing n Change if you can, in any case, send: –A description of the purpose of the script –The URL of where you found it. – The web page using it, as far as you have done. n Email me (rich@on-the-net.com) the page Email only Text or HTML.
19
19 Cookie manipulation n Remember information from prior visits n Carry “State” information between sessions –Order in process –Credit approved n Get information set by server for local use
20
20 Day 2 - Digging into JS n n Javascript programming: n n Controlling Browser Objects: n n Programming tools: n n Lab: – –Special Calculators – –Reminder Calendar
21
21 Day 3 - Going beyond JS n n Integration: n n Operations: n n Database operations with JS n n Lab: – –Events Database with calendar display
Similar presentations
