6. Web Technologies Basics Part 1 - PHP & MySQL Web Development
-
Upload
telerik-software-academy -
Category
Education
-
view
5.680 -
download
2
description
Transcript of 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development
![Page 1: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/1.jpg)
Web Technologies Basics
Part 1 - Concepts
Nikolay Kostov
Telerik Software Academyacademy.telerik.com
Technical Trainerhttp://nikolay.it
http://academy.telerik.com/.../php-school-academy-meeting
![Page 2: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/2.jpg)
Table of Contents Web Sites and Web Applications Web 1.0, 2.0, 3.0 Web Browsers Hardware Servers Web Servers Client-Server Architecture 3-Tier / Multi-Tier Architectures MVC (Model-View-Controller) Service-Oriented Architecture (SOA)
2
![Page 3: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/3.jpg)
Web Sites and Web Applications
![Page 4: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/4.jpg)
Web Site Collection of related web pages containing web resources (web pages, images, videos, CSS files, JS files or other digital assets)
Common navigation between web pages
A website is hosted on at least one web server
Accessible via a network (such as the Internet)
All publicly accessible websites collectively constitute the World Wide Web
4
![Page 5: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/5.jpg)
Web Page Document or information resource that is suitable for the World Wide Web
Can be accessed through a web browser and displayed on a monitor or mobile device
This information is usually in HTML or XHTML format, and may provide navigation to other web pages via hypertext links
Web pages frequently refer to other resources such as style sheets (CSS), scripts (JavaScript) and images into their final presentation
5
![Page 6: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/6.jpg)
Web Application Next level web sites High interactivity High accessibility (Cloud) AJAX, Silverlight, Flash, Flex, etc. Applications are usually broken into logical chunks called "tiers", where every tier is assigned a role
Desktop-like application in the web browser
Web applications on desktop (Windows 8)
6
![Page 7: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/7.jpg)
Web 1.0, 2.0, 3.0
![Page 8: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/8.jpg)
Web 1.0 Old media model It all started with a simple idea
Just put content in the web
Low content variety Limited content
Limited creativity
Limited business
10 000 editors serve 500 000 000 internet users
8
![Page 9: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/9.jpg)
Web 1.0
9
![Page 10: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/10.jpg)
Web 2.0
10
![Page 11: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/11.jpg)
Web 2.0 User generated content New platforms allow users to generate content themselves (YouTube, Wiki, Facebook, Blogs)
Everyone can publish! Web 2.0 can be described in 3 parts: Rich Internet application (RIA)
Web-oriented architecture (WOA) Feeds, RSS, Web Services, etc.
Social Web
11
![Page 12: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/12.jpg)
Web 2.0
12
![Page 13: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/13.jpg)
Web 3.0
![Page 14: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/14.jpg)
Web 3.0 Web 3.0 is where the computer is generating new information, rather than humans.
All the new web 3.0 concepts can be divided into 4 parts: Semantic web
Artificial intelligence
Personalization
Mobility
14
![Page 15: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/15.jpg)
Web 3.0 Semantic web
Changing the web into a language that can be read and categorized by the computers rather than humans
Makes search engines smarter
Enables digital collection of allyour images, blog post,videos, etc.
Disadvantage:it is hard to be implemented
15
![Page 16: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/16.jpg)
Web 3.0 Artificial intelligence
Extracting meaning from the way people interact with the web
Examples: google suggest, google translate
Personalization Contextualizing the web based on
the people using it
Different content for different users
16
![Page 17: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/17.jpg)
Web 3.0 Mobility
Everything Web sites
Information
Services
Everywhere You only need your
phone or tablet
All the time
17
![Page 18: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/18.jpg)
Web Browsers andLayout Engines
18
![Page 19: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/19.jpg)
Web Browsers
Program designed to enable users to access, retrieve and view documents and other resources on the Internet
Main responsibilities: Bring information resources to the
user (issuing requests to the web server and handling any results generated by the request)
Presenting web content (render HTML, CSS, JS)
Capable of executing applications within the same context as the document on view (Flash)
19
![Page 20: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/20.jpg)
Layout Engines Software component that displays the formatted content on the screen combining: Marked up content (such as HTML,
XML, image files, etc.) Formatting information (such as
CSS, XSL, etc.) It "paints" on the content area of a window, which is displayed on a monitor or a printer
Typically embedded in web browsers, e-mail clients, on-line help systems or other applications that require the displaying (and editing) of web content
20
![Page 21: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/21.jpg)
Layout Enginesand Web Browsers
Trident-based Internet Explorer, Netscape,
Maxthon, etc.
Gecko-based Firefox, Netscape, SeaMonkey, etc.
WebKit-based Chrome, Safari, Maxthon, etc.
Presto-based Opera 21
![Page 22: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/22.jpg)
User Agent Strings Identify web browsers and their
version Can have some additional
information like layout engine, user's operating system, etc.
Example:
Web browser: Firefox 7.0.1 Rendering (layout) engine:
Gecko/20100101 Operating system: 64-bit Windows 7
WOW64 = Windows-On-Windows 64-bit
Windows NT 6.1 = Windows 7
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:7.0.1) Gecko/20100101 Firefox/7.0.1
![Page 23: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/23.jpg)
Hardware Servers
![Page 24: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/24.jpg)
Hardware Servers Physical computer (a hardware system) dedicated to running one or more such services
Servers are placed in collocation centers
The server may be: Database server
File server
Mail server
Print server
VPS servers
24
![Page 25: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/25.jpg)
Web ServersApache, IIS, nginx, lighttpd, etc.
![Page 26: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/26.jpg)
What Do the Web Servers Do?
All physical servers have hardware The hardware is controlled by the operating system
Web servers are software products that use the operating system to handle web requests
These requests are redirected to other software products (ASP.NET, PHP, etc.), depending on the web server settings
26
![Page 27: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/27.jpg)
Web Servers Market Share 2011
Apache 60.31%
IIS (by Microsoft) 19.34%
nginx (by Igor Sysoev) 7.65%
GWS (by Google) 5.09%
lighttpd 0.60%
27
![Page 28: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/28.jpg)
Client-Server Architecture
The Classical Client-Server Model
28
![Page 29: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/29.jpg)
Client-Server Architecture
The client-server model consists of: Server – a single machine or cluster
of machines that provides web applications (or services) to multiple clients Examples:
Web server running PHP scripts or ASP.NET pages
IIS based Web server
WCF based service
Services in the cloud 29
![Page 30: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/30.jpg)
Client-Server Architecture
The client-server model consists of: Clients –software applications that
provide UI (front-end) to access the services at the server Examples:
Web browsers
WPF applications
HTML5 applications
Silverlight applications
ASP.NET consuming services30
![Page 31: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/31.jpg)
The Client-Server Model
Server
DesktopClient
MobileClient
ClientMachine
network connection
network connection
network connection
31
![Page 32: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/32.jpg)
Client-Server Model – Examples
Web server (Apache, IIS) – Web browser
FTP server (ftpd) – FTP client (FileZilla)
EMail server (qmail) – email client (Outlook)
SQL Server – SQL Server Management Studio
BitTorrent Tracker – Torrent client (μTorrent)
DNS server (bind) – DNS client (resolver)
DHCP server (wireless router firmware) – DHCP client (mobile phone /Android DHCP client/)
SMB server (Windows) – SMB client (Windows)
32
![Page 33: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/33.jpg)
3-Tier / Multi-Tier Architectures
Classical Layered Structure of Software Systems
![Page 34: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/34.jpg)
The 3-Tier Architecture The 3-tier architecture consists of the following tiers (layers): Front-end (client layer)
Client software – provides the UI of the system
Middle tier (business layer) Server software – provides the core
system logic
Implements the business processes / services
Back-end (data layer) Manages the data of the system
(database / cloud)
34
![Page 35: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/35.jpg)
The 3-Tier Architecture Model
BusinessLogic Desktop
Client
MobileClient
ClientMachine
network
network
networkDatabase
Data Tier(Back-End)
Middle Tier(Business Tier)
Client Tier (Front-End)
35
![Page 36: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/36.jpg)
Typical Layers of the Middle Tier
The middle tier usually has parts related to the front-end, business logic and back-end:
Presentation LogicImplements the UI of the application (HTML5, Silverlight, WPF, …)
Business LogicImplements the core processes / services of the application
Data Access LogicImplements the data access functionality (usually ORM framework)
36
![Page 37: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/37.jpg)
Multi-Tier Architecture
Database
ORM
WCF
ASP.NET
HTML
PHP
37
![Page 38: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/38.jpg)
MVC (Model-View-Controller)
What is MVC and How It Works?
![Page 39: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/39.jpg)
Model-View-Controller (MVC)
Model-View-Controller (MVC) architecture Separates the business logic from
application data and presentation
Model Keeps the application state (data)
View Displays the data to the user
(shows UI)
Controller Handles the interaction with the
user
39
![Page 40: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/40.jpg)
MVC Architecture Blueprint
40
![Page 41: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/41.jpg)
MVC-Based Frameworks .NET
ASP.NET MVC, MonoRail Java
JavaServer Faces (JSF), Struts, Spring Web MVC, Tapestry, JBoss Seam, Swing
PHP CakePHP, Symfony, Zend, Joomla, Yii,
Mojavi Python
Django, Zope Application Server, TurboGears
Ruby on Rails
41
![Page 42: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/42.jpg)
MVC and Multi-Tier Architecture
MVC does not replace the multi-tier architecture Both are
usually used together
Typical multi-tier architecture can use MVC To separate
logic, data and presentation
Model (Data)
Data Access Logic
Views(Presentati
on)
Controllers(Business
Logic)
42
![Page 43: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/43.jpg)
Service-Oriented Architecture
(SOA)
![Page 44: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/44.jpg)
What is a Service? In the real world a "service" is:
A piece of work performed by a service provider
Provides a client (consumer) some desired result by some input parameters The requirements and the result are
known
Easy to use Always available Has quality characteristics (price,
execution time, constraints, etc.)44
![Page 45: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/45.jpg)
Service-Oriented Applications
Service-oriented applications resemble the service-consumer model in the real world Consist of service provider (server
side) and service consumer (client part) Typical examples are the RIA
Service providers provide some service
Service consumers access the services
Standard protocols are used like XML, JSON, SOAP, WSDL, RSS, HTTP, …
45
![Page 46: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/46.jpg)
What is SOA?
SOA (Service-Oriented Architecture) is a concept for development of software systems Using reusable building blocks
(components) called "services" Services in SOA are:
Autonomous Stateless business functions Accept requests and return
responses Use well-defined, standard interface
46
![Page 47: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/47.jpg)
SOA Services Autonomous
Each service operates autonomously
Without any awareness that other services exist
Stateless Have no memory, do not remember
state
Easy to scale
Request-response model Client asks, server returns an
answer
47
![Page 48: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/48.jpg)
SOA Services (2)
Communication through standard protocols
XML, SOAP, JSON, RSS, ...
HTTP, FTP, SMTP, RPC, MSMQ, ...
Not dependent on OS, platforms, programming languages
Discoverable
Service registries48
![Page 49: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/49.jpg)
форум програмиране, форум уеб дизайнкурсове и уроци по програмиране, уеб дизайн – безплатно
програмиране за деца – безплатни курсове и уроцибезплатен SEO курс - оптимизация за търсачки
уроци по уеб дизайн, HTML, CSS, JavaScript, Photoshop
уроци по програмиране и уеб дизайн за ученициASP.NET MVC курс – HTML, SQL, C#, .NET, ASP.NET MVC
безплатен курс "Разработка на софтуер в cloud среда"
BG Coder - онлайн състезателна система - online judge
курсове и уроци по програмиране, книги – безплатно от Наков
безплатен курс "Качествен програмен код"
алго академия – състезателно програмиране, състезания
ASP.NET курс - уеб програмиране, бази данни, C#, .NET, ASP.NETкурсове и уроци по програмиране – Телерик академия
курс мобилни приложения с iPhone, Android, WP7, PhoneGap
free C# book, безплатна книга C#, книга Java, книга C#Дончо Минков - сайт за програмиранеНиколай Костов - блог за програмиранеC# курс, програмиране, безплатно
?
? ? ??
?? ?
?
?
?
??
?
?
? ?
Questions?
?
Web Technologies Basics
http://academy.telerik.com
![Page 50: 6. Web Technologies Basics Part 1 - PHP & MySQL Web Development](https://reader035.fdocuments.in/reader035/viewer/2022062307/555a03a8d8b42ad00a8b50e4/html5/thumbnails/50.jpg)
Free Trainings @ Telerik Academy
“PHP & MySQL Web Design" course
academy.telerik.com/.../php-school-academy-meeting
Telerik Software Academy academy.telerik.com
Telerik Academy @ Facebook facebook.com/TelerikAcademy
Telerik Software Academy Forums forums.academy.telerik.com