0
By: Ramon Christopher Morales
Fundamentals of
Web Building
Today’s discussion includes the
following:
 The web programming languages usually
used
HTML
CSS
JavaScript
Server-sid...
 HTML is the primary language for
building/creating web pages.
 CSS defines HOW HTML elements are to
be displayed.
 Jav...
HTML - Hyper Text Markup Language
 HTML is an easy-to-learn markup
language.
 HTML uses markup tags inside angle
bracket...
HTML Example
 HTML uses start tags and end tags to markup
web page elements: In the example above, the
<p> tag marks the ...
HTML Example
 Web browsers (IE, Firefox, Chrome, etc) read
HTML documents, interpret the HTML tags, and
display the prope...
HTML
 By using simple HTML tags, web designers
can add headers, paragraphs, text, tables,
images, lists, programming code...
CSS - Cascading Style Sheets
 CSS describes the visual style
(appearance, layout, color, fonts) of HTML
elements.
CSS EXAMPLE
 CSS was designed to separate document layout
from document content (which greatly improved
HTML flexibility ...
CSS EXAMPLE
 CSS saves a lot of work!
 The CSS definitions are normally stored in
external files. This enables a web
dev...
CSS EXAMPLE
 If you have ever tried to change the style of
all elements in all your HTML pages, you
understand how you ca...
JavaScript - Client-side Scripting
 JavaScript is used in billions of Web pages
to add functionality, validate forms,
com...
What is JavaScript?
 JavaScript is a scripting language
 A scripting language is a lightweight
programming language
 A ...
What is JavaScript?
 JavaScript was designed to add interactivity
to HTML pages
 JavaScript is free. Everyone can use
Ja...
Are Java and JavaScript the same?
 Java and JavaScript are two completely
different languages in both concept and
design!...
Client-side Scripting
 JavaScript is about "programming" the
behavior of a browser. This is called client-
side scripting...
What can a JavaScript Do?
 JavaScript gives
HTML designers a
programming tool -
JavaScript is a
scripting language
with a...
What can a JavaScript Do?
 JavaScript can react to events - A
JavaScript can be set to execute when
something happens, li...
What can a JavaScript Do?
 JavaScript can be
used to validate
data - A JavaScript
can be used to
validate form data
befor...
What can a JavaScript Do?
 JavaScript can be used to create
cookies - A JavaScript can be used to store
and retrieve info...
What can a JavaScript Do?
 JavaScript can be used to detect the
visitor's browser - A JavaScript can be used
to detect th...
What can a JavaScript Do?
 JavaScript can read/write/modify HTML
elements - A JavaScript can read and
change the content ...
HTML, CSS, JavaScript
 HTML is the primary language for
building/creating web pages.
 CSS defines HOW HTML elements are ...
ASP and PHP - Server-side
Scripting
 Active Server Pages (ASP) and Hypertext
Preprocessor (PHP)
 An HTML file can contai...
ASP and PHP - Server-side
Scripting
 Normally, when a browser requests an HTML
file, the server returns the file. However...
What can Server Scripts Do?
 Dynamically edit, change or add any content
to a Web page
 Respond to user queries or data ...
What can Server Scripts Do?
 Provide security since your server code
cannot be viewed from a browser
 Because the script...
SQL - Structured Query Language
 SQL is the standard language for accessing
and manipulating databases.
 Common database...
What is SQL?
 SQL stands for Structured Query Language
 SQL allows you to access a database
 SQL is an ANSI standard co...
SQL Database Tables
 A database usually contains one or more
tables. Each table is identified by a name
(e.g. "Customers"...
SQL Database Tables
 The table above (called “Persons”) contains
three records (one for each person) and four
columns (La...
SQL Queries
 With SQL, we can query a database and
have a result set returned. A query like this:
SELECT LastName FROM Pe...
Summary
 HTML is the primary language for
building/creating web pages.
 CSS defines HOW HTML elements are to be
displaye...
Upcoming SlideShare
Loading in...5
×

Fundamentals of Web building

1,263

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,263
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
32
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "Fundamentals of Web building"

  1. 1. By: Ramon Christopher Morales Fundamentals of Web Building
  2. 2. Today’s discussion includes the following:  The web programming languages usually used HTML CSS JavaScript Server-side Scripting SQL
  3. 3.  HTML is the primary language for building/creating web pages.  CSS defines HOW HTML elements are to be displayed.  JavaScript is THE scripting language of the Web.  Server-side scripting is about "programming" the behavior of the server.  SQL is the standard language for accessing and manipulating databases.
  4. 4. HTML - Hyper Text Markup Language  HTML is an easy-to-learn markup language.  HTML uses markup tags inside angle brackets, like <p>, to define the elements of a web page:
  5. 5. HTML Example  HTML uses start tags and end tags to markup web page elements: In the example above, the <p> tag marks the start of a paragraph, and </p> marks the end of the paragraph.
  6. 6. HTML Example  Web browsers (IE, Firefox, Chrome, etc) read HTML documents, interpret the HTML tags, and display the proper output (without displaying the HTML tags):
  7. 7. HTML  By using simple HTML tags, web designers can add headers, paragraphs, text, tables, images, lists, programming code, etc, to a web page (HTML document).  According to the HTML standard, HTML should be used to define the content of web pages.
  8. 8. CSS - Cascading Style Sheets  CSS describes the visual style (appearance, layout, color, fonts) of HTML elements.
  9. 9. CSS EXAMPLE  CSS was designed to separate document layout from document content (which greatly improved HTML flexibility and reduced HTML complexity).
  10. 10. CSS EXAMPLE  CSS saves a lot of work!  The CSS definitions are normally stored in external files. This enables a web developer to change the appearance and layout of every page in a web site, just by editing one single file!
  11. 11. CSS EXAMPLE  If you have ever tried to change the style of all elements in all your HTML pages, you understand how you can save a lot of work by storing the style definitions in an external file.
  12. 12. JavaScript - Client-side Scripting  JavaScript is used in billions of Web pages to add functionality, validate forms, communicate with the server, and much more.  JavaScript is easy to learn.
  13. 13. What is JavaScript?  JavaScript is a scripting language  A scripting language is a lightweight programming language  A JavaScript consists of lines of executable computer code  A JavaScript is usually embedded directly into HTML pages
  14. 14. What is JavaScript?  JavaScript was designed to add interactivity to HTML pages  JavaScript is free. Everyone can use JavaScript without a license
  15. 15. Are Java and JavaScript the same?  Java and JavaScript are two completely different languages in both concept and design!  Java (developed by Sun Microsystems) is a powerful and much more complex programming language - in the same category as C and C++  JavaScript was invented by Brendan Eich at Netscape (with Navigator 2.0), and has appeared in all browsers since 1996.
  16. 16. Client-side Scripting  JavaScript is about "programming" the behavior of a browser. This is called client- side scripting (or browser scripting).  Server-side scripting is about "programming" the behavior of the server
  17. 17. What can a JavaScript Do?  JavaScript gives HTML designers a programming tool - JavaScript is a scripting language with a very simple syntax! Almost anyone can put small "snippets" of code into their HTML pages
  18. 18. What can a JavaScript Do?  JavaScript can react to events - A JavaScript can be set to execute when something happens, like when a page has finished loading or when a user clicks on an HTML element
  19. 19. What can a JavaScript Do?  JavaScript can be used to validate data - A JavaScript can be used to validate form data before it is submitted to a server. This saves the server from extra processing
  20. 20. What can a JavaScript Do?  JavaScript can be used to create cookies - A JavaScript can be used to store and retrieve information on the visitor's
  21. 21. What can a JavaScript Do?  JavaScript can be used to detect the visitor's browser - A JavaScript can be used to detect the visitor's browser, and load another page specifically designed for that
  22. 22. What can a JavaScript Do?  JavaScript can read/write/modify HTML elements - A JavaScript can read and change the content of an HTML element
  23. 23. HTML, CSS, JavaScript  HTML is the primary language for building/creating web pages.  CSS defines HOW HTML elements are to be displayed.  JavaScript is THE scripting language of the Web.
  24. 24. ASP and PHP - Server-side Scripting  Active Server Pages (ASP) and Hypertext Preprocessor (PHP)  An HTML file can contain HTML tags, text and scripts.  Server-side scripting is about "programming" the behavior of the server. This is called server-side scripting or server scripting.  Client-side scripting is about "programming" the behavior of the browser.
  25. 25. ASP and PHP - Server-side Scripting  Normally, when a browser requests an HTML file, the server returns the file. However, if the file contains a server-side script, the script is executed on the server before the file is returned to the browser as plain HTML.
  26. 26. What can Server Scripts Do?  Dynamically edit, change or add any content to a Web page  Respond to user queries or data submitted from HTML forms  Access any data or databases and return the result to a browser  Customize a Web page to make it more useful for individual users
  27. 27. What can Server Scripts Do?  Provide security since your server code cannot be viewed from a browser  Because the scripts are executed on the server, the browser that displays the file does not need to support scripting at all!
  28. 28. SQL - Structured Query Language  SQL is the standard language for accessing and manipulating databases.  Common database management systems are: MySQL, SQL Server, Access, Oracle, Sybase, and DB2  Knowledge of SQL is invaluable for anyone who wants to store or retrieve data from a database.
  29. 29. What is SQL?  SQL stands for Structured Query Language  SQL allows you to access a database  SQL is an ANSI standard computer language  SQL can execute queries against a database  SQL can retrieve data from a database  SQL can insert new records in a database  SQL can delete records from a database  SQL can update records in a database  SQL is easy to learn
  30. 30. SQL Database Tables  A database usually contains one or more tables. Each table is identified by a name (e.g. "Customers" or "Orders"). Tables contain records (rows) with data.
  31. 31. SQL Database Tables  The table above (called “Persons”) contains three records (one for each person) and four columns (LastName, FirstName, Address, and City).
  32. 32. SQL Queries  With SQL, we can query a database and have a result set returned. A query like this: SELECT LastName FROM Persons Gives a result set like this:
  33. 33. Summary  HTML is the primary language for building/creating web pages.  CSS defines HOW HTML elements are to be displayed.  JavaScript is THE scripting language of the Web.  Server-side scripting is about "programming" the behavior of the server.  SQL is the standard language for accessing and manipulating databases.
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×