Scribd Logo
Upload

Welcome to Scribd!

  • Intro Web Technologies

    Uploaded by

    rakeshovr18961
    21 views44 pages
    Introduction Server Side Technologies Roadmap for Web Developer Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer. Introduction to Web Technologies Waheed Iqbal introduction to the World Wide Web or the Web. The Web is a system of interlinked hypertext documents accesssed via the internet.

    Original Description:

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    Introduction Server Side Technologies Roadmap for Web Developer Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer. Introduction to Web Technologies Waheed Iqbal introduction to the World Wide Web or the Web. The Web is a system of interlinked hypertext documents accesssed via the internet.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    21 views44 pages

    Intro Web Technologies

    Uploaded by

    rakeshovr18961
    Introduction Server Side Technologies Roadmap for Web Developer Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer. Introduction to Web Technologies Waheed Iqbal introduction to the World Wide Web or the Web. The Web is a system of interlinked hypertext documents accesssed via the internet.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 44

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Introduction to Web Technologies


    Waheed Iqbal

    26th April, 2011

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Outline
    1 2 3 4 5 6 7 8

    Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Outline
    1 2 3 4 5 6 7 8

    Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    WWW

    WWW (World Wide Web) or W3 commenly known as the Web The Web is a system of interlinked hypertext documents accesssed via the Internet.

    http://www.w3.org/WWW/

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Internet

    Internet is a global network of computer networks. Publicly available since 1990. Internet follows client-server model.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Client-Server Model
    Distributed application architecture in which a component makes request is known as client and a component serves the request is known as server.

    Figure: Client-Server model1 .


    1 http://www.softinfralab.com/sample-news-post/

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Important Protocols
    Protocol is a set of rules establish for communication between machines on a network 2 . Some of the important protocols used over Internet are: HTTP (Hypertext Transfer Protocol): foundation for Internet communication, it follows the client-server model. SMTP (Simple Mail Transfer Protocol): uses for outgoing mail transportation and uses port 25 by default. DNS (Domain Name System) hierarchal naming system for computers/resources connected on Internet. It also translate the domain name (human readable name) into IP address. There are many other e.g., FTP, POP, DHCP, IMAP, etc
    2

    http://fcit.usf.edu/network/chap2/chap2.htm

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Web Server and Web Browser

    Web server is a computer program that serves content using HTTP protocol. We need Web server to host our Web application/site. Apache, IIS, and Nginx are popular Web servers. Web browser is a computer program that help us to retrieve and render the WWW resources.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Outline
    1 2 3 4 5 6 7 8

    Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    HTML

    HTML (Hyper Text Markup Language) is basic building block of Web pages. HTML is a markup language containing markup tags. Markup tags are keywords surrounded by angle brackets e.g., <html>. Tags come in pairs e.g., <h2> and </h2>. <h2> is start tage and </h2> is end tage. HTML is not case sensitive.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    HTML Hello World

    Figure: HTML code and output in browser.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    HTML Practice
    Lets practice some HTML exercises from w3schools.com

    Figure: http://www.w3schools.com/html/default.asp.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    HTML Learning Resources

    http://www.w3schools.com/html http://htmldog.com/guides/htmlbeginner/

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Outline
    1 2 3 4 5 6 7 8

    Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    CSS

    CSS (Cascading Style Sheets) allows us to control the look and feel of our Web pages written in markup language e.g., HTML. Simple syntax, uses English keywords to specify style properties.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Where to write CSS?

    Internal: only for the document it written. Inline: for only specic portion of the document. External: for multiple documents, we need to import external CSS le.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Why do we need CSS?

    Separation of content and style. Consistent look and feel in a Web site. Dynamic and easy theme management for Web site.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    CSS

    CSS contains styles. Style is a rule that maps a selector to set of property-value pairs.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    CSS Selector
    Name of style is known as selector and it contains the denition 3 .

    http://www.echoecho.com/cssselectors.htm

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    HTML Selector

    http://www.echoecho.com/cssselectors.htm

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Class Selector

    http://www.echoecho.com/cssselectors.htm

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    CSS Example
    Lets check a CSS example from w3schools.com.

    http://www.w3schools.com/css/tryit.asp?filename=trycss_default

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    CSS Learning Resources

    http://www.w3schools.com/Css/default.asp http://www.echoecho.com/css.htm http://www.htmldog.com/guides/cssbeginner/

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Outline
    1 2 3 4 5 6 7 8

    Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    JavaScript Introduction

    JavaScript is a scripting language that runs in a Web browser. No post-back and executes on client-side. More interactive than HTML and CSS. JavaScript could be use for:
    displaying alter messages data validation displaying timer/clocks opening pop-up windows

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    JavaScript Example 1

    (a) Java script code.

    (b) Output in browser.

    Example is taken from www.webteacher.com/javascript/

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    JavaScript Example 2

    Example is taken from w3schools.com

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Java Script Learning Resources

    http://www.w3schools.com/js/ http://www.webteacher.com/javascript/ It is also worth to check jQuery, a JavaScript library http://www.w3schools.com/jquery/default.asp

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Outline
    1 2 3 4 5 6 7 8

    Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    AJAX (Asynchronous JavaScript and XML) is a way to obtain data from server without reloading the whole page. AJAX is not a single technology. JavaScript and the XMLHttpRequest object provide the magic to exchange data between browser and server.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    AJAX Example

    Lets check an AJAX example available at: http://www.w3schools.com/ajax/tryit.asp? filename=tryajax_first

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Outline
    1 2 3 4 5 6 7 8

    Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Introduction

    Simple HTML Web site contains static les stored on Web server. How can a client get dynamic contents by providing some input? Server side technologies allows us to generate dynamic content and with sophisticated user interaction.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Server Side Languages


    Perl: good for Unix system administration task. ASP.NET: commercial and platform dependent from Microsoft. Python: Object oriented. Java Servlets and JSP: server side Java based. PHP: most popular nowadays. Ruby on Rails: object oriented becoming popular rapidly.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Ruby on Rails and PHP Online Learning Resources


    Learn Rails by Example book available at http://ruby.railstutorial.org/ ruby-on-rails-tutorial-book Getting Started with Rails http://guides. rubyonrails.org/getting_started.html XAMPP one installer for Web server (Apache), MySQl, and PHP http://www.apachefriends.org/en/xampp.html PHP/MySQL tutorial http://www. freewebmasterhelp.com/tutorials/phpmysql PHP tutorial from w3schools.com http://www.w3schools.com/php/default.asp

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Outline
    1 2 3 4 5 6 7 8

    Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    RDBMS

    RDBMS (Relational Database Management System) is a software package that helps to maintain, create, manage, and access the database stored in tables. Relationships among the data also store in tables. SQL (Structured Query Language) is use to manipulate the data in RDBM. MySQL is very popular open-source RDMS.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    SQL Statements

    Example is taken from www.w3schools.com

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Why do we need RDBMS in Web application?

    Database plays a vital role in Web application due to: persistent storage easy data access many more advantages such as data integrity and security.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    More on RDBMS and SQL

    http://www.joomlacmstutorials.com/database/ 26-rdbms-concepts/52-basic-rdbms-concepts http://www.w3schools.com/sql/ http://www.mysqltutorial.org/ http://www.freewebmasterhelp.com/tutorials/ phpmysql

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Three Tier Web Application Framework

    http://siliconwhisperer.com/2007/12/three-tier-web-application-framework/

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Outline
    1 2 3 4 5 6 7 8

    Introduction HTML CSS JavaScript AJAX Server Side Technologies RDBMS Roadmap for Web Developer

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Roadmap for Web Developer

    Get comfortable yourself with HTML, CSS, and JavaScript. Select your favorite server-side language and RDBMS. My recommendation is PHP or Ruby on Rails with MySQL. Build small Web sites e.g., Shopping Cart, Simple Blog, Picture Sharing Site etc. Try to incorporate AJAX.

    Introduction

    HTML

    CSS

    JavaScript

    AJAX

    Server Side Technologies

    RDBMS

    Roadmap for Web Developer

    Questions!

    You might also like