Welcome web development and programming v22 0061 section 1
This presentation is the property of its rightful owner.
Sponsored Links
1 / 41

Welcome! Web Development and Programming V22.0061 - section 1 PowerPoint PPT Presentation


  • 166 Views
  • Uploaded on
  • Presentation posted in: General

Welcome! Web Development and Programming V22.0061 - section 1. Professor: Sana’ Odeh [email protected] Office hours: Mon. 3pm - 4 pm in room 418 in WWH. Course Description. Web Development and Programming Focuses on: Foundation of the web Client-Side programming

Download Presentation

Welcome! Web Development and Programming V22.0061 - section 1

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.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Welcome web development and programming v22 0061 section 1

Welcome!Web Development and Programming V22.0061 - section 1

Professor: Sana’ Odeh

[email protected]

Office hours: Mon. 3pm - 4 pm in room 418 in WWH

Course Introduction


Course description

Course Description

  • Web Development and Programming

    • Focuses on:

      • Foundation of the web

      • Client-Side programming

      • Server-Side programming

      • Server technologies

      • XML technologies

Course Introduction


Course description1

Course Description

  • The course focus is building dynamic and interactive web-based sites that can be used for E-commerce using the following applications:

    • Client- side applications: HTML, JavaScripts

    • Server side applications: PHP, Server Side Includes (SSI)

    • Server technologies: installations, configurations and security

    • XML technologies

Course Introduction


Administrative matters

Administrative Matters

Course Introduction


Prerequisites

Prerequisites

  • Computers in Principle & Practice I - V22.0004

  • and

    • One semester of programming in C, or equivalent programming experience such as Java or Pascal.

  • You must be familiar with programming and HTML

  • Course Introduction


    Text books http www cs nyu edu courses fall07 v22 0061 001

    Text Bookshttp://www.cs.nyu.edu/courses/fall07/V22.0061-001/

    • I couldn’t find one text book that covered all the material.

    • All are now available at the NYU Bookstore, Barnes & Noble, Amazon.com, etc.

    Course Introduction


    Required text books

    Required text books

    1. Javascript for the World Wide Web **

    Visual Quickstart Guide

    by Tom Negrino and Dori Smith

    Peachpit Press

    2. PHP for the World Wide Web: Visual QuickStart Guide (2nd edition)
Author: by Larry Ullman
Peachpit Press 
ISBN-10: 0321245652
ISBN-13: 978-0321245656

    3. XML for the World Wide Web: Visual QuickStart Guide

    By Elizabeth Castro

    Peachpit Press

    Course Introduction


    Lecture notes

    Lecture Notes

    • Most lecture notes will be available as Power Point Slides

    • You can easily download these from the course web site (more later…)

    Course Introduction


    Computer accounts

    Computer Accounts

    • Most development will be performed on the UNIX

      i5.nyu.edu

    • For Development, we will be using:

      • Any Text Editor you like, e.g. vi, pico, etc.

    Course Introduction


    I5 accounts

    I5 Accounts

    • If you are registered for this course, you already have an i5 account.

    • Your i5.nyu.edu system uses NYUHome NetID as their username, and their central NYU single sign-on password to log in.

    • You need an active NYUHome account to login to your i5 account.

    • To set, or change this password, go to: http://start.nyu.edu

    Course Introduction


    Exams and grading

    Exams and Grading

    • Grade Distribution:

      • 6- 7 Assignments (50%)

      • Midterm exam (20%)

      • Group Project (30%)

      • No Final exam

    Course Introduction


    A word about cheating

    A Word About Cheating

    • For the purposes of this class, cheating is defined as:

      • Copying all or part of another student's homework, project or exam.

      • Allowing another student to copy all or part of your homework, project, or exam.

      • Discussing homework concepts is fine, but you must submit your own work

    • If you are caught cheating, you will receive an immediate FAILURE for the course.

    Course Introduction


    Student civility

    Student Civility

    • In an effort to make this class enjoyable for everybody…

      • Please be on time to class!

      • Please do not talk to your friends and neighbors in class!

        • It disturbs everyone, and makes it hard to concentrate.

        • If you have a question, just ask me!

      • Please turn your pagers and cell-phones off!

    Course Introduction


    Welcome web development and programming v22 0061 section 1

    Getting Help Whenever you have a question about the course material, please feel free to drop by during my office hours or write me an email message. If at any time you feel that you are falling behind or are overwhelmed by the material, let me know: I will be very happy to help you.

    • Help is always available!

    • Option1:Come to my Office Hours

      • Mon. 3pm - 4 pm

      • Location: Room 418 Warren Weaver Hall

      • I get bored when nobody visits!

      • If you cannot make my office hours, I will be happy to make an appointment with you.

      • Please try to give me advance warning when you need an appointment.

    • Option 2: Go see class tutor or write to class e-tutor for help

    Course Introduction


    Course web site

    Course Web Site

    • The Course Web Site is available at:

      http://www.cs.nyu.edu/courses/fall07/V22.0061-001/index.html

    • Let’s check it out…

    Course Introduction


    Syllabus

    Syllabus

    • Available online at the course web site.

    • Let’s take a look at what we will be covering….

    Course Introduction


    Foundations of the web

    Foundations of the Web

    Course Introduction


    Foundations of the web1

    Foundations of the Web

    • To build Web applications, you first need to understand the foundations of the web:

      • History of the Internet and the Web

      • HyperText Markup Language (HTML)

      • Web protocols (HTTP)

    Course Introduction


    History of the web

    History of the Web

    • To understand the future, you have to understand the past.

    • By understanding history, you also gain a much better understanding of the technology.

    • We will focus on:

      • Origins of the Web

      • Revolutionary Ideas of the Web

      • Historical battle over web standards

    Course Introduction


    Welcome web development and programming v22 0061 section 1

    HTML

    • Most students are probably already familiar with HTML, but we will spend two weeks to cover the basics.

    • HTML is the “language of the web”.

    • Used to create simple to very complex web pages.

    • Focus on HTML Tables, Forms, Multimedia, HTML Standards, HTML in the “Real World”, Accessibility, and Performance.

    Course Introduction


    Html preview a sample form

    HTML Preview: A Sample Form

    <FORM ACTION="http://www.nyu.com/servlet/coreservlets.ShowParameters" METHOD="POST">

    First Name:

    <INPUT TYPE=TEXT NAME=first SIZE=20 MAXLENGTH=20>

    <BR>

    Last Name:

    <INPUT TYPE=TEXT NAME=last SIZE=20 MAXLENGTH=20>

    <BR>

    Password:

    <INPUT TYPE=PASSWORD NAME=password SIZE=20 MAXLENGTH=20>

    <BR>

    <INPUT TYPE=SUBMIT VALUE="Submit">

    </FORM>

    Course Introduction


    Welcome web development and programming v22 0061 section 1

    HTTP

    • HyperText Transfer Protocol: The defined standard of communication between web browsers and web servers.

    • We will learn how it works and how does it affect web applications

    Course Introduction


    Client side programming javascript

    Client Side programmingJavaScript

    Course Introduction


    Javascript

    JavaScript

    • A very effective for building interactive web applications.

    • Is a semi-object-oriented scripting language for creating dynamic and interactive content for the world wide web.

    • We will write javascript programs:

      • to validate forms

      • performs a browser check

      • We will use the Document Object model (DOM) to:

        • Manipulates frames, images, and text to create dynamic websites.

    Course Introduction


    Sample javascript

    Sample JavaScript

    <html>

    <head>

    </head>

    <body>

    <h1><center>Image swapping</center></h1>

    <img src="nyc1.gif" name=image1>

    <script language=JavaScript>

    // Create an image array containing two images to swap with an image already loaded nyc1.gif

    var manyimages = new Array("nyc2.gif","nyc3.gif");

    var imageindex= prompt("Please enter image number 0 or 1 to swap the image on page with a different one","");

    // Use the number entered above to change the image on the page

    document.images["image1"].src = manyimages[imageindex];

    </script>

    </body>

    </html>

    Course Introduction


    How client side and server side applications interact

    How Client-side and server-side applications interact

    CGI

    SSI

    Servlet

    PHP

    JSP

    ASP

    Web

    Browser

    (Client side processing)

    HTML

    JavaScript

    Java Applets

    Web

    Server

    HTTP

    Databases

    Course Introduction


    Server technologies

    Server Technologies

    Course Introduction


    Server technologies1

    Server Technologies

    • Server is a a specialized software that allows a computer connected to the Internet to store and serve documents such as text, images, sound video and so on.

    • When you develop web projects you must understand how the server will be effected by your applications such as security and load.

    • Server installation , configuration and security:

      • The course provides an overview of

        • popular server applications

        • Server installation, and configuration.

        • We will focus on the Apache server which is the most popular and secure server used today.

        • Students learn to access Apache server data and logs.

    Course Introduction


    Server side technologies ssi perl cgi

    Server side TechnologiesSSI & Perl-CGI

    Course Introduction


    Common gateway interface cgi

    Common Gateway InterfaceCGI

    • A generic framework for building dynamic web applications.

    • Usually written in Perl.

    • For example:

      • User submits a search keyword.

      • Perl program searches file system and returns matches.

      • Students will write code to process, search, list and sort data from and into the web and from and into a simple database file

    • Java Servlets is also an effective framework for building interactive frames. It is more complicated (need to be advance in JAVA )

    Course Introduction


    Example 3

    Example 3

    PHP example

    #!/usr/local/bin/php

    <HTML>

    <head>

    <title>PHP test 3 </title>

    </head>

    <body>

    <?php

    print("<b>Hello</b>, <i>World</i>!");

    print("<h5><font color='#FF0000'>This is a sample page using PhP.</font></h5>");

    /* You can write comments the way you would in C as well.

    Next we will look at examples using variables to store strings. */

    $first_name = "Harry";

    $last_name = "Potter";

    $first_book = "The Sorcerer's Stone";

    $second_book= "The Chamber of Secrets";

    // Print some values of the variables:

    echo "The book <i>$first_book</i> is about $first_name $last_name.";

    echo "<br>The second book in the series is <i>$second_book</i>.";

    ?>

     </body>

    </html>

    Course Introduction


    Server side includes ssi

    Server Side includes (SSI)

    • Server-Side Includes are commands which include external data in your HTML document.

    • Manipulate environmental server variables to use in your programs

    Course Introduction


    Sample ssi file

    Sample SSI file

    <html>

    <head>

    <title> SSI to print Date</title>

    </head>

    <body>

    SSI to print date when index.html was last modified:

    <!--#config timefmt="%B %Y" -->

    <!--#flastmod virtual="index.html" -->

    <P>

    When this script was last modified:

    <!--#config timefmt="%B %Y" -->

    <!--#flastmod virtual="modssi.shtml" -->

    </body>

    </html>

    Course Introduction


    Welcome web development and programming v22 0061 section 1

    Sample CGI script processing data from the web via a form

    ===========================================

    #!/usr/local/bin/perl

    use CGI "param";

    $fname = param('fullname');

    $addr = param('address');

    @choice = param('flavor');

    @topp = param('topping');

    $cc = param('creditCard');

    print "Content-type: text/html \n";

    print "\n";

    print "

    <HTML>

    <HEAD>

    <TITLE>Thank You</TITLE>

    <H3>We will process your order as soon as possible! <br>

    Please stop by again!</H2> </center>

    <hr>

    <h2> Here is your information: </h2>

    <ul>

    <li> <p>$fname

    <li><p>$addr

    <li> <p>$choice[0]

    <li> <p>$topp[0]

    <li> <p>$cc

    </BODY>

    </HTML> ";

    Course Introduction


    Xml technologies dtd and xls

    XML TechnologiesDTD and XLS

    Course Introduction


    Extensible markup language

    eXtensible Markup Language

    • A new standard for creating data formats on the web.

    • Unlike HTML which has a fixed set of tags, XML enables you to create new tags and new data formats.

    • XML is maturing, and is now considered essential for web development.

    Course Introduction


    Applications of xml

    Applications of XML

    • Widely used today in major applications:

      • Search Engines

      • News Distribution

      • E-Commerce

      • Real Estate

      • Genetics

      • Defense Department Applications

    Course Introduction


    Xml topics

    XML Topics

    • We will cover XML extensively:

      • Introduction to XML and its applications

      • Document Type Definitions (DTDs)

      • XSL: Extensible Stylesheet language

    Course Introduction


    Sample of xml document encoding cd catalog

    Sample of xml document encoding CD Catalog

    <?xml version="1.0"?>

    <CATALOG>

    <CD>

    <TITLE>Empire Burlesque</TITLE>

    <ARTIST>Bob Dylan</ARTIST>

    <COUNTRY>USA</COUNTRY>

    <COMPANY>Columbia</COMPANY>

    <PRICE>10.90</PRICE>

    <YEAR>1985</YEAR>

    </CD>

    <CD>

    <TITLE>Hide your heart</TITLE>

    <ARTIST>Bonnie Tylor</ARTIST>

    <COUNTRY>UK</COUNTRY>

    <COMPANY>CBS Records</COMPANY>

    <PRICE>9.90</PRICE>

    <YEAR>1988</YEAR>

    </CD>

    <CD>

    <TITLE>Unchain my heart</TITLE>

    <ARTIST>Joe Cocker</ARTIST>

    <COUNTRY>USA</COUNTRY>

    <COMPANY>EMI</COMPANY>

    <PRICE>8.20</PRICE>

    <YEAR>1987</YEAR>

    </CD>

    </CATALOG>

    Course Introduction


    Live xml demo

    Live XML Demo

    • Go to: http://w.moreover.com/dev/xml/

    • Click on one of the XML Links.

    • These represent live news feeds that have been encoded in XML.

    • Used last year as part of the final programming project.

    Course Introduction


    Welcome web development and programming v22 0061 section 1

    Good luck!

    Please speak to me if you have questions!

    Course Introduction


  • Login