Transcript DOM
Slide 1
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 2
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 3
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 4
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 5
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 6
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 7
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 8
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 9
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 10
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 11
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 12
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 13
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 14
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 15
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 16
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 17
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 18
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 19
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 20
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 21
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 22
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 23
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 24
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
• E-mail
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 2
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 3
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 4
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 5
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 6
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 7
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 8
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 9
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 10
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 11
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 12
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 13
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 14
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 15
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 16
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 17
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 18
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 19
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 20
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 21
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 22
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 23
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example
Slide 24
Web 2.0 with AJAX
Project leaders :
Jean Luc LARBOT
Ahmed RHIAT
Students :
LASC Ioana
KELEMEN Csilla
POP Dan Adrian
CIOBANU Dumitru Daniel
Overview
• Web 2.0 seems to be like Pink Floyd lyrics: it
can mean different things to different people,
depending on your state of mind.
• What is AJAX?
– Ajax stands for Asynchronous JavaScript And XML
– it mixes well known programming techniques in an
uncommon way
– enables web developers to build Internet applications
with much more appealing user interfaces
We will take a look at :
• Web servers – Apache and Tomcat
» Daniel
• HTML and CSS
• Document Object Module
» Dan
• JavaScript and XMLHTTPRequest
• JSP – MySQL
» Csilla
• Hibernate
» Ioana
Apache and Tomcat
• Web servers
– application that translates an URL either into a
filename, and then sends that file back over the
Internet, or into a program name, and then runs that
program and sends its output back.
– Criteria for Choosing a Web Server:
• Fast
• Multitasking
• Authentication
• Error handling
• Negotiation of style and language
• Multi-format support
• Run as a proxy server
• Secure
Apache and Tomcat
• Apache
– Has more than twice the market share than
its next competitor, Microsoft
– Freeware
– Open source
– Highly configurable
– Suits sites of all sizes and types
– Implements many features in addition to the
core functionality
– Extensible with third-party modules
Apache and Tomcat
Tomcat
• Java-based servlet container with JSP environment
• its web server is not as fully featured as many other
servers
• is cross platform running on any operating system
that has a Java Runtime Environment
• its default HTTP port is 8080
• Tomcat’s Architecture:
–
–
–
–
Top-level components
Connectors
Container components
Nested components
HTML and CSS
HTML - HyperText Markup Language
• predominant markup language for the creation
of web pages
• It provides a means to describe the structure of
text-based information in a document
• is written in the form of labels, known as tags
• can include embedded scripting language code
HTML and CSS
• Elements are the basic structure for
HTML markup, they have two basic
properties:
– attributes - name-value pairs, separated by "="
– content
Delivery of HTML
• HTTP (HyperText Transfer Protocol )
HTML and CSS
What Is CSS?
• Cascading Style Sheets (CSS) is a language
that works with HTML documents to define the
way content is presented.
• Style sheets contain a number of CSS rules
• There are three types of style:
– Browser style
– User style sheets
– Author style sheets
HTML and CSS
Why Use CSS ?
– Easy to maintain
– Smaller file sizes
– Increased accessibility
– Different media
– More control over typography
DOM
• Document Object Model (DOM) is a
platform - and language-independent
standard object model for representing
HTML or XML and related formats
• Is an abstract data structure that
represents XML documents as trees of
nodes.
DOM
• The DOM is separated into different parts
(Core, XML, and HTML) and different
levels (DOM Level 1/2/3):
– Core DOM - defines a standard set of objects
for any structured document
– XML DOM - defines a standard set of objects
for XML documents
– HTML DOM- defines a standard set of objects
for HTML documents
DOM
• common types of nodes in XML:
–
–
–
–
Elements
Attributes
Text
Document
• less common node types:
–
–
–
–
–
–
–
CDATA
Comment
Processing Instructions
Document fragments
Entities
Entity reference nodes
Notations
DOM
Dom tree
From Java to JSP
• Applets are java programs executed in the user’s
browser.
• A servlet is a Java programming language class that is
used to extend the capabilities of servers that host
applications
access
via
a
request-response
programming model.
• A servlet container is a runtime shell that invokes
servlets on behalf of clients; software that runs servlets
and manages them through their lifecycle.
• A JSP page is a text document that contains two types
of text: static data, (HTML, SVG, WML, and XML), and
JSP elements, which construct dynamic content.
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
JavaScript
• Client-side scripts are embedded in web pages and
executed by JavaScript interpreter built into browser
• They add extra functionality to an otherwise static HTML
page:
- Change the way page elements are displayed
- Add animations and other image effects
- Open pop-up windows and dialogs
- Check the validity of user-entered data
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• The XHR (XMLHttpRequest) object is the core of the Ajax engine.
• Enables a page to get data from (with GET method) or post
data to (with the POST method) the server as a background
request. It does not refresh the browser during this process
• It is made asynchronously in background
• XMLHttpRequest is supported by all modern browsers.
• Any type of document may be returned from the server:
ASCII text, HTML, and XML are all popular choices
JavaScript and in particular the XMLHTTPRequest
object to manipulate the requests and the answers
• Database enabled XHR
- The server-side language queries the database, based on
what was requested
- Custom methods are handling specific database
interactions
- After the data has been received by the server-side
language it can be returned to the XHR that originally
requested it, and handles by the client-side language
JSP with access in the MySQL database
• JSP is becoming the new standard for easily developed, easily
maintained Web applications
• Reasons for JSP's soaring popularity:
- Making Web pages come alive
- Getting data from the user
- Easier to program
- More power through Java
- Connecting to databases
- Performance
- Separating code and data
- Handling cookies
JSP with access in the MySQL database
Servlets
• Are the Java counterpart to non-Java dynamic Web content
technologies such as CGI and ASP.NET.
• Can maintain state across many server transactions by
using HTTP cookies, session variables or URL rewriting.
• The Servlet life cycle:
- The Servlet class is loaded by the container during start-up
- The container calls the init() method
- After initialization, the servlet can service client-requests
- The container calls the destroy() method
JSP with access in the MySQL database
Connecting to MySQL with JSP
• The first thing is to make available the java.sql.* class
• Need to expect and handle java.sql.SQLExceptions
• An instance of the mm.mysql.Driver class is required to
register the DriverManager
• An instance of JDBC driver needs to be registered with the
DriverManager before the call of getConnection() could
make the proper connection
• After creating the connection, statements can be created
HIBERNATE
• The evolution of programming languages
• The relational concept for data management
• The Object/Relational Mapping (ORM)
HIBERNATE
HIBERNATE
• The object-oriented view of a relational
database
• The Hibernate mapping system
• Example