Web development involves a typical client server model. Client Server communications is built on the OSI stack and different communication protocols exist at each layer.
Internet is built upon TCP/IP as the transport and internet layer and HTTP/HTTPS as the application layer.
A client communicating with a web server via a web browser needs to establish a TCP connection on the listening port of the serer.
After establishing a TCP connection, the client communicates over HTTP.
HTTP requests in the form of GET/POST are sent to the server and the server responds with metadata and HTML content.
This HTML content is interpreted by the web browser to render web pages on client's browser.
Web development is a vast field with thousands of libraries, frameworks, protocols and technologies. It's impossible to study all of them but the important thing to realize is that there are many ways to accomplish a similar outcome.
All these techniques can be grouped into 2 aspects, Client-side programming and Server-side programming.
Client side programming has mostly to do with the user interface, with which the user interacts. In web development it's the browser, in the user's machine, that runs the code. This code must run in a variety of browsers and should ideally be platform independent. The code must be secure and should not exploit client resources.Its main tasks are:
Server side programming has to do with generating dynamic content. It runs on servers. Many of these servers are "headless". Most web pages are not static, they search a database in order to show the user updated personalized information. This sides interacts with the back end, like say, the database. This code has to do with:
What we have today are some advanced enterprise web UI builder tools such as Vaadin and GWT supported by frameworks such as Spring.
Humble Beginnings of cgi: The first attempt to deliver dynamic content to the users was to use cgi processes or scripts. These were mostly written using perl because of its inherently rich text processing capability. The clients will request to access cgi programs by making requests to the cgi server. The cgi server will then invoke a separate cgi child process, and a perl interpreter had to be invoked during the process and cgi programs didn't take any advantage of the server itself, e.g. cgi scripts couldn't write to the server log because these cgi programs ran outside the sandbox of cgi server. Addressing heavy traffic was also an issue. Bottom line, the whole process was inefficient, or rather can be improved.
asp: This was Microsoft's solution for dynamic web content. asp required iis servers to run. When a client requests an asp page, the server interprets the request, converts it to HTML and delievers back to the client. asp was originally HTML and VB scripts but now it supports XML, javascript, .NET and many other languages. This means that the browser doesn't have to know any of the underlying technologies because the server will just deliver all the HTML content that the browser needs to know. asp was simpler, faster and secure than cgi. Why secure? because the browser doesn't know anything about how it got the HTML content!
php: php servers the same purpose as asp. However,
It is powerful enough to be at the core of the biggest blogging system on the web (WordPress)!
It is deep enough to run the largest social network (Facebook)!
It is also easy enough to be a beginner's first server side language!
PHP files can contain text, HTML, CSS, JavaScript, and PHP code. php code is executed on the server as asps. php has a great community and almost everything that you can think of has already been done using php.
Note: php can include HTML, CSS and javascript. The following example is a script to upload a file to the remote server.
OK. So far it's fireworks on the server side but what about client-side programming. Incomes javascript.
Note: asp and php scripts get called by user interactions in the web page. e.g. POST request sent by clicking a form button.
js: javascript is considered as java's response to Microsoft asp. Although there is server-side js available I'm only discussing about client-side js. It's sed for form validation, animations, interacting, user activity tracking etc. all done on the browser itself. The HTML pages have javascripts embedded in the page sources and almost all browsers today support javascript.
This is done by the js interacting with the DOM of the web page.
Security is a major concern in allowing the scripts to use browser resources and different security measures are in place. The browser acts as a sandbox and the js are not permitted to access resources in users local system, everything is done through the browser to avoid data and cookie theft.
AJAX: Stands for asynchronous javascript and XML. Typically all techniques that we discussed needs to reload the page to speak with the server. This is costly and AJAX offers a solution. It communicates with the server asynchronously in the background, meaning it will send some request to server to fetch that data and while the response comes back, other javascripts and functionality in the page can function while the requests arrives. This requires specific support for ajax in browser but almost all browser do support. AJAX was popularized by google when the search content appeared on the fly when the users started typing content. This is also seen in IMDB, facebook etc. What happens is that ajax requests are passed by grabbing what the user has already typed in the form.
Variants of Javascript exist such as node.js and angular.js but that's fro anther day. It's important to leave a note about JQuery which is a rich js library that supports fast DOM manipulation, CSS manipulation and AJAX so that you can write less js code lines to minimize development time.
Internet is built upon TCP/IP as the transport and internet layer and HTTP/HTTPS as the application layer.
A client communicating with a web server via a web browser needs to establish a TCP connection on the listening port of the serer.
After establishing a TCP connection, the client communicates over HTTP.
HTTP requests in the form of GET/POST are sent to the server and the server responds with metadata and HTML content.
This HTML content is interpreted by the web browser to render web pages on client's browser.
Web development is a vast field with thousands of libraries, frameworks, protocols and technologies. It's impossible to study all of them but the important thing to realize is that there are many ways to accomplish a similar outcome.
All these techniques can be grouped into 2 aspects, Client-side programming and Server-side programming.
Client side programming has mostly to do with the user interface, with which the user interacts. In web development it's the browser, in the user's machine, that runs the code. This code must run in a variety of browsers and should ideally be platform independent. The code must be secure and should not exploit client resources.Its main tasks are:
- Validating input (Validation must be done in the server. A redundant validation in the client could be used to avoid server calls when speed is very critical.)
- Animation
- Manipulating UI elements
- Applying styles
- Some calculations are done when you don't want the page to refresh so often, e.g. AJAX
Server side programming has to do with generating dynamic content. It runs on servers. Many of these servers are "headless". Most web pages are not static, they search a database in order to show the user updated personalized information. This sides interacts with the back end, like say, the database. This code has to do with:
- Querying the database
- Encode the data into html
- Insert and update information onto the database
- Business rules and calculations
What we have today are some advanced enterprise web UI builder tools such as Vaadin and GWT supported by frameworks such as Spring.
Humble Beginnings of cgi: The first attempt to deliver dynamic content to the users was to use cgi processes or scripts. These were mostly written using perl because of its inherently rich text processing capability. The clients will request to access cgi programs by making requests to the cgi server. The cgi server will then invoke a separate cgi child process, and a perl interpreter had to be invoked during the process and cgi programs didn't take any advantage of the server itself, e.g. cgi scripts couldn't write to the server log because these cgi programs ran outside the sandbox of cgi server. Addressing heavy traffic was also an issue. Bottom line, the whole process was inefficient, or rather can be improved.
asp: This was Microsoft's solution for dynamic web content. asp required iis servers to run. When a client requests an asp page, the server interprets the request, converts it to HTML and delievers back to the client. asp was originally HTML and VB scripts but now it supports XML, javascript, .NET and many other languages. This means that the browser doesn't have to know any of the underlying technologies because the server will just deliver all the HTML content that the browser needs to know. asp was simpler, faster and secure than cgi. Why secure? because the browser doesn't know anything about how it got the HTML content!
php: php servers the same purpose as asp. However,
It is powerful enough to be at the core of the biggest blogging system on the web (WordPress)!
It is deep enough to run the largest social network (Facebook)!
It is also easy enough to be a beginner's first server side language!
PHP files can contain text, HTML, CSS, JavaScript, and PHP code. php code is executed on the server as asps. php has a great community and almost everything that you can think of has already been done using php.
Note: php can include HTML, CSS and javascript. The following example is a script to upload a file to the remote server.
Note: asp and php scripts get called by user interactions in the web page. e.g. POST request sent by clicking a form button.
js: javascript is considered as java's response to Microsoft asp. Although there is server-side js available I'm only discussing about client-side js. It's sed for form validation, animations, interacting, user activity tracking etc. all done on the browser itself. The HTML pages have javascripts embedded in the page sources and almost all browsers today support javascript.
This is done by the js interacting with the DOM of the web page.
Security is a major concern in allowing the scripts to use browser resources and different security measures are in place. The browser acts as a sandbox and the js are not permitted to access resources in users local system, everything is done through the browser to avoid data and cookie theft.
Variants of Javascript exist such as node.js and angular.js but that's fro anther day. It's important to leave a note about JQuery which is a rich js library that supports fast DOM manipulation, CSS manipulation and AJAX so that you can write less js code lines to minimize development time.
Comments
Post a Comment