Introduction to the server side - Learn web development | MDN (2023)

  • Overview: First steps
  • Next

Welcome to the MDN beginner's server-side programming course! In this first article, we look at server-side programming from a high level, answering questions such as "what is it?", "how does it differ from client-side programming?", and "why it is so useful?". After reading this article you'll understand the additional power available to websites through server-side coding.

Prerequisites: Basic computer literacy. A basic understanding of what a web server is.
Objective: To gain familiarity with what server-side programming is, what it can do, and how it differs from client-side programming.

Most large-scale websites use server-side code to dynamically display different data when needed, generally pulled out of a database stored on a server and sent to the client to be displayed via some code (e.g. HTML and JavaScript).

Perhaps the most significant benefit of server-side code is that it allows you to tailor website content for individual users. Dynamic sites can highlight content that is more relevant based on user preferences and habits. It can also make sites easier to use by storing personal preferences and information — for example reusing stored credit card details to streamline subsequent payments.

It can even allow interaction with users of the site, sending notifications and updates via email or through other channels. All of these capabilities enable much deeper engagement with users.

In the modern world of web development, learning about server-side development is highly recommended.

What is server-side website programming?

Web browsers communicate with web servers using the HyperText Transfer Protocol (HTTP). When you click a link on a web page, submit a form, or run a search, an HTTP request is sent from your browser to the target server.

The request includes a URL identifying the affected resource, a method that defines the required action (for example to get, delete, or post the resource), and may include additional information encoded in URL parameters (the field-value pairs sent via a query string), as POST data (data sent by the HTTP POST method), or in associated cookies.

Web servers wait for client request messages, process them when they arrive, and reply to the web browser with an HTTP response message. The response contains a status line indicating whether or not the request succeeded (e.g. "HTTP/1.1 200 OK" for success).

The body of a successful response to a request would contain the requested resource (e.g. a new HTML page, or an image), which could then be displayed by the web browser.

Static sites

The diagram below shows a basic web server architecture for a static site (a static site is one that returns the same hard-coded content from the server whenever a particular resource is requested). When a user wants to navigate to a page, the browser sends an HTTP "GET" request specifying its URL.

The server retrieves the requested document from its file system and returns an HTTP response containing the document and a success status (usually 200 OK). If the file cannot be retrieved for some reason, an error status is returned (see client error responses and server error responses).

Introduction to the server side - Learn web development | MDN (1)

Dynamic sites

A dynamic website is one where some of the response content is generated dynamically, only when needed. On a dynamic website HTML pages are normally created by inserting data from a database into placeholders in HTML templates (this is a much more efficient way of storing large amounts of content than using static websites).

A dynamic site can return different data for a URL based on information provided by the user or stored preferences and can perform other operations as part of returning a response (e.g. sending notifications).

Most of the code to support a dynamic website must run on the server. Creating this code is known as "server-side programming" (or sometimes "back-end scripting").

The diagram below shows a simple architecture for a dynamic website. As in the previous diagram, browsers send HTTP requests to the server, then the server processes the requests and returns appropriate HTTP responses.

Requests for static resources are handled in the same way as for static sites (static resources are any files that don't change — typically: CSS, JavaScript, Images, pre-created PDF files, etc.).

Introduction to the server side - Learn web development | MDN (2)

Requests for dynamic resources are instead forwarded (2) to server-side code (shown in the diagram as a Web Application). For "dynamic requests" the server interprets the request, reads required information from the database (3), combines the retrieved data with HTML templates (4), and sends back a response containing the generated HTML (5,6).

(Video) Web Development Tutorial - Server-side scripting

Are server-side and client-side programming the same?

Let's now turn our attention to the code involved in server-side and client-side programming. In each case, the code is significantly different:

  • They have different purposes and concerns.
  • They generally don't use the same programming languages (the exception being JavaScript, which can be used on the server- and client-side).
  • They run inside different operating system environments.

Code running in the browser is known as client-side code and is primarily concerned with improving the appearance and behavior of a rendered web page. This includes selecting and styling UI components, creating layouts, navigation, form validation, etc. By contrast, server-side website programming mostly involves choosing which content is returned to the browser in response to requests. The server-side code handles tasks like validating submitted data and requests, using databases to store and retrieve data and sending the correct data to the client as required.

Client-side code is written using HTML, CSS, and JavaScript — it is run inside a web browser and has little or no access to the underlying operating system (including limited access to the file system).

Web developers can't control what browser every user might be using to view a website — browsers provide inconsistent levels of compatibility with client-side code features, and part of the challenge of client-side programming is handling differences in browser support gracefully.

Server-side code can be written in any number of programming languages — examples of popular server-side web languages include PHP, Python, Ruby, C#, and JavaScript (NodeJS). The server-side code has full access to the server operating system and the developer can choose what programming language (and specific version) they wish to use.

Developers typically write their code using web frameworks. Web frameworks are collections of functions, objects, rules and other code constructs designed to solve common problems, speed up development, and simplify the different types of tasks faced in a particular domain.

Again, while both client and server-side code use frameworks, the domains are very different, and hence so are the frameworks. Client-side web frameworks simplify layout and presentation tasks while server-side web frameworks provide a lot of "common" web server functionality that you might otherwise have to implement yourself (e.g. support for sessions, support for users and authentication, easy database access, templating libraries, etc.).

Note: Client-side frameworks are often used to help speed up development of client-side code, but you can also choose to write all the code by hand; in fact, writing your code by hand can be quicker and more efficient if you only need a small, simple web site UI.

In contrast, you would almost never consider writing the server-side component of a web app without a framework — implementing a vital feature like an HTTP server is really hard to do from scratch in say Python, but Python web frameworks like Django provide one out of the box, along with other very useful tools.

(Video) Basics Of Server Side Programming

What can you do on the server-side?

Server-side programming is very useful because it allows us to efficiently deliver information tailored for individual users and thereby create a much better user experience.

Companies like Amazon use server-side programming to construct search results for products, make targeted product suggestions based on client preferences and previous buying habits, simplify purchases, etc.

Banks use server-side programming to store account information and allow only authorized users to view and make transactions. Other services like Facebook, Twitter, Instagram, and Wikipedia use server-side programming to highlight, share, and control access to interesting content.

Some of the common uses and benefits of server-side programming are listed below. You'll note that there is some overlap!

Efficient storage and delivery of information

Imagine how many products are available on Amazon, and imagine how many posts have been written on Facebook? Creating a separate static page for each product or post would be completely impractical.

Server-side programming allows us to instead store the information in a database and dynamically construct and return HTML and other types of files (e.g. PDFs, images, etc.). It is also possible to return data (JSON, XML, etc.) for rendering by appropriate client-side web frameworks (this reduces the processing burden on the server and the amount of data that needs to be sent).

The server is not limited to sending information from databases, and might alternatively return the result of software tools, or data from communications services. The content can even be targeted for the type of client device that is receiving it.

Because the information is in a database, it can also more easily be shared and updated with other business systems (for example, when products are sold either online or in a shop, the shop might update its database of inventory).

Note: Your imagination doesn't have to work hard to see the benefit of server-side code for efficient storage and delivery of information:

  1. Go to Amazon or some other e-commerce site.
  2. Search for a number of keywords and note how the page structure doesn't change, even though the results do.
  3. Open two or three different products. Note again how they have a common structure and layout, but the content for different products has been pulled from the database.

For a common search term ("fish", say) you can see literally millions of returned values. Using a database allows these to be stored and shared efficiently, and it allows the presentation of the information to be controlled in just one place.

Customized user experience

Servers can store and use information about clients to provide a convenient and tailored user experience. For example, many sites store credit cards so that details don't have to be entered again. Sites like Google Maps can use saved or current locations for providing routing information, and search or travel history to highlight local businesses in search results.

A deeper analysis of user habits can be used to anticipate their interests and further customize responses and notifications, for example providing a list of previously visited or popular locations you may want to look at on a map.

Note: Google Maps saves your search and visit history. Frequently visited or frequently searched locations are highlighted more than others.

Google search results are optimized based on previous searches.

  1. Go to Google search.
  2. Search for "football".
  3. Now try typing "favorite" in the search box and observe the autocomplete search predictions.

Coincidence? Nada!

(Video) Introduction to Web programming at server side

Controlled access to content

Server-side programming allows sites to restrict access to authorized users and serve only the information that a user is permitted to see.

Real-world examples include social-networking sites which allow users to determine who can see the content they post to the site, and whose content appears in their feed.

Note: Consider other real examples where access to content is controlled. For example, what can you see if you go to the online site for your bank? Log in to your account — what additional information can you see and modify? What information can you see that only the bank can change?

Store session/state information

Server-side programming allows developers to make use of sessions — basically, a mechanism that allows a server to store information on the current user of a site and send different responses based on that information.

This allows, for example, a site to know that a user has previously logged in and display links to their emails or order history, or perhaps save the state of a simple game so that the user can go to a site again and carry on where they left it.

Note: Visit a newspaper site that has a subscription model and open a bunch of tabs (e.g. The Age). Continue to visit the site over a few hours/days. Eventually, you will start to be redirected to pages explaining how to subscribe, and you will be unable to access articles. This information is an example of session information stored in cookies.

Notifications and communication

Servers can send general or user-specific notifications through the website itself or via email, SMS, instant messaging, video conversations, or other communications services.

(Video) Client-side vs Server-side, Front-end vs Back-end? Beginner Explanation of JavaScript on the Web

A few examples include:

  • Facebook and Twitter send emails and SMS messages to notify you of new communications.
  • Amazon regularly sends product emails that suggest products similar to those already bought or viewed that you might be interested in.
  • A web server might send warning messages to site administrators alerting them to low memory on the server, or suspicious user activity.

Note: The most common type of notification is a "confirmation of registration". Pick almost any large site that you are interested in (Google, Amazon, Instagram, etc.) and create a new account using your email address. You will shortly receive an email confirming your registration, or requiring acknowledgment to activate your account.

Data analysis

A website may collect a lot of data about users: what they search for, what they buy, what they recommend, how long they stay on each page. Server-side programming can be used to refine responses based on analysis of this data.

For example, Amazon and Google both advertise products based on previous searches (and purchases).

Note: If you're a Facebook user, go to your main feed and look at the stream of posts. Note how some of the posts are out of numerical order - in particular, posts with more "likes" are often higher on the list than more recent posts.

Also look at what kind of ads you are being shown — you might see ads for things you looked at on other sites. Facebook's algorithm for highlighting content and advertising can be a bit of a mystery, but it is clear that it does depend on your likes and viewing habits!


Congratulations, you've reached the end of the first article about server-side programming.

You've now learned that server-side code is run on a web server and that its main role is to control what information is sent to the user (while client-side code mainly handles the structure and presentation of that data to the user).

You should also understand that it is useful because it allows us to create websites that efficiently deliver information tailored for individual users and have a good idea of some of the things you might be able to do when you're a server-side programmer.

Lastly, you should understand that server-side code can be written in a number of programming languages and that you should use a web framework to make the whole process easier.

In a future article we'll help you choose the best web framework for your first site. Here we'll take you through the main client-server interactions in just a little more detail.

  • Overview: First steps
  • Next

In this module

  • Introduction to the server side
  • Client-Server overview
  • Server-side web frameworks
  • Website security


What is server-side in web development? ›

Server-side development, sometimes called back-end development , is a type of development that involves programs that run on a server. This type of programming is important because web browsers, or clients, interact with web servers to retrieve information.

Is server-side programming easy? ›

Getting started with server-side programming is usually easier than client-side development, because dynamic websites tend to perform a lot of very similar operations (retrieving data from a database and displaying it in a page, validating user-entered data and saving it in a database, checking user permissions and ...

What else do you need to learn about server-side programming? ›

Server-side Programming :
  1. Querying the database.
  2. Operations over databases.
  3. Access/Write a file on server.
  4. Interact with other servers.
  5. Structure web applications.
  6. Process user input. For example if user input is a text in search box, run a search algorithm on data stored on server and send the results.
Oct 26, 2017

What are the three 3 main elements of a web server? ›

The three main elements of a Web server are the hardware (computers and related components), operating system software, and Web server software.

What are the benefits of server-side? ›

A server-side rendered application speeds up page loading when the user suffers from a slow internet connection. Thus it greatly improves the whole user experience. Easy indexation by search engines.

What language is used on server-side? ›

Server-side code can be written in any number of programming languages — examples of popular server-side web languages include PHP, Python, Ruby, C#, and JavaScript (NodeJS).

Which language is mostly used for server-side? ›

Hypertext Preprocessor (PHP) is one of the world's most popular server-side scripting language for building dynamic, data-driven Web applications.

Which server-side language is easiest to learn? ›

Simple to Code: PHP is a simple to use server-side coding language. This is one of the reasons it is widely used for web development projects. Its easier to learn PHP compared to other languages like Java.

Is HTML is mostly used for server-side coding? ›

html files on the server are called static web pages . Web pages that are created as they are requested are called dynamic web pages . Writing programs to create dynamic pages is server-side programming since the programs run on the web server.

What are 4 major components of a server? ›

4 Key Components of a Server: CPU, Memory, Hard Disk & RAID Card.

What are 3 skills needed to be a web developer? ›

Key skills to be successful in web development include:
  • Computer literacy.
  • Strong numeracy skills.
  • Strong creative ability.
  • Attention to detail.
  • Strong communication skills.
  • Excellent problem-solving skills.
  • A logical approach to work.
  • The ability to explain technical matters clearly.

Can you become a web developer with no experience? ›

If there's one job that's easy to pick up with no prior experience or education at all, it's web development. You can get started right now, and in a few weeks or months of study and practice, you'll have a working understanding of how to develop a website.

What are 3 types of web developments? ›

There are three types of web development roles: developers who specialize in the user interface (“front-end”), those who write the underlying code for running all website operations (“back-end”), and those who manage all aspects of a website (“full stack”).

What is the main purpose of a web server? ›

The communication between a web server or browser and the end user takes place using Hypertext Transfer Protocol (HTTP). The primary role of a web server is to store, process, and deliver requested information or webpages to end users.

What is a web server examples? ›

On the hardware side, a web server is a computer that stores web server software and a website's component files (for example, HTML documents, images, CSS stylesheets, and JavaScript files). A web server connects to the Internet and supports physical data interchange with other devices connected to the web.

What are the two types of web servers? ›

There are mainly four types of web servers – Apache, IIS, Nginx and LiteSpeed.

Which role is responsible for server-side development? ›

A backend engineer is responsible for designing, building, and maintaining the server-side of web applications. In other words, a backend engineer's primary responsibility is to build the structure of a software application.

How does server-side processing work? ›

Server-side processing happens when a page is first requested and when pages are posted back to the server. Examples of server-side processing are user validation, saving and retrieving data, and navigating to other pages.

What does server-side include? ›

Server-side includes are directives that can be placed in your HTML file, telling the web server to include additional information in the displayed document. This feature is most often used to display the size of a file before downloading, or the date last modified of the current document.

Is server-side front end or backend? ›

The back-end, also called the server-side, consists of the server which provides data on request, the application that channels it, and the database which organizes the information. For example, when a customer browses shoes on a website, they are interacting with the front end.

Why Python is used in server-side? ›

It is widely used for backend development and uses an object-oriented approach. Python helps programmers to perform jobs faster than other object-oriented languages by using fewer lines of code. Furthermore, most developers are able to switch between Java and Python with ease.

Why JavaScript is server-side language? ›

JavaScript is a client-side script, meaning the browser processes the code instead of the web server. Client-side scripts are commonly used when we want to validate data before sending it to the web server, adjusting the interface in response to user feedback, and for implementing other advanced features.

How can I improve my server-side performance? ›

5 Strategies to Optimize Your Server
  1. Pick the Right Application (Instead of Default App)
  2. Enable Caching.
  3. Defragment the Database Tables.
  4. Optimize Your Database Settings.
  5. Work on DNS Query Response Time.
Aug 18, 2021

Is server-side programming back end? ›

Server-side and Back-end are identical statements. They both mean that the code is run on you server as opposed to the clients machine, often for dealing with databases. Where as Client-side and Front-end both mean the code is executed on the users computer, usually for UI and design.

Which is the hardest programming language to learn as a beginner? ›

LISP. It is the second oldest programming language after FORTRAN, and is still used in higher-level systems and for artificial intelligence. It is hard to learn because: Its is a fragmented language with domain-specific solutions.

Which backend language should I learn as a beginner? ›

C# C-Sharp is one of the most widely used languages for creating system backends. It's because of its incredible features, such as Windows server automation.

Which backend language is best for beginners? ›

JavaScript is an easy-to-learn backend language. Even most novices begin their programming career with JavaScript.

Is CSS a server-side technology? ›

Markup languages like HTML and CSS are interpreted by the browser on the client side.

What are 3 types of servers? ›

Today's servers are primarily available in three forms: racks, blades and mainframes. The majority of IT teams turn to rack and blade servers to meet their server requirements. Some teams opt for mainframe computers to handle their workloads, although not nearly to the extent of rack and blade servers.

What are 3 functions of a server? ›

A server stores, sends, and receives data. In essence, it "serves" something else and exists to provide services. A computer, software program, or even a storage device may act as a server, and it may provide one service or several.

What are the basics of a server? ›

Servers can fill multiple purposes, such as supplying software and applications to other computers on the network, while others may be dedicated for a single purpose. Popular services that servers provide to SMB customers include: file and print sharing, web, database, remote access, and authentication.

Is Web Developer easy or hard? ›

“As a web developer, you will encounter numerous challenges. Some of them will be easy to fix, while others will be extremely hard,” Kowalski says. “It's critical to be persistent in improving your skills since the industry is ever-changing.” There's definitely a lot to learn in web development.

Can I learn web development on my own? ›

Web design can be quite complex and daunting, but with the development of the Internet and technology, web design can be easier than ever before nowadays. There are many resources on the Internet, and everyone can learn to be a great web designer on their own.

What is the hardest part of web development? ›

Platform compatibility is one of the most common and significant web development challenges businesses often face when building their projects.

How much does a beginner web developer make? ›

How much does an Entry Level Web Developer make? As of Jan 28, 2023, the average annual pay for an Entry Level Web Developer in the United States is $43,621 a year.

What is the minimum salary of a web developer? ›

Web Developer salary in India with less than 1 year of experience to 6 years ranges from ₹ 1 Lakhs to ₹ 7 Lakhs with an average annual salary of ₹ 2.9 Lakhs based on 26.9k latest salaries.

What are the 5 stages of web development? ›

The Web development life cycle includes the following phases: planning, analysis, design and development, testing, and implementation and maintenance.

What are the 7 web development processes? ›

The tasks are split into the six phases of web design development: "Information gathering", "Structure", "Design", "Build", "Testing" and "Launch". Group tasks by Status to see the progress pipeline ("Backlog", "In progress", "In discussion", "Sent for approval", and "Done").

What is client side and server-side in web development? ›

Client-side means that the action takes place on the user's (the client's) computer. Server-side means that the action takes place on a web server.

What is client side vs server-side web development? ›

Client-side or front-end web developers use their programming talents to create visually appealing websites for users. This means they build homepages, shopping pages, and slideshows. Server-side or back-end developers create, design, and manage server-side code responsible for data exchange.

What are the examples of server-side? ›

  • C# or Visual Basic in ASP.NET environments.
  • Java.
  • Perl.
  • PHP.
  • Python.
  • Ruby.
  • Node. js.
  • Swift.

What is server-side in HTML? ›

Much like with client side, 'server side' means everything that happens on the server, instead of on the client. In the past, nearly all business logic ran on the server side, and this included rendering dynamic webpages, interacting with databases, identity authentication, and push notifications.

Is HTML server-side or client-side? ›

Source code is visible to the user. of server-sideside is an HTML page. Its main function is to provide the requested output to the end user.

Which language is best for server-side programming? ›

Hypertext Preprocessor (PHP) is one of the world's most popular server-side scripting language for building dynamic, data-driven Web applications.

What are the two sides of web development? ›

One, called frontend developers, is responsible for the user-facing side of a web solution. The other, known as backend developers, works with the hidden part consisting of a database and server. Together, these two big teams create visually attractive and interactive websites and web applications.

Which is better client-side or server-side? ›

Between the two options, server-side rendering is better for SEO than client-side rendering. This is because server-side rendering can speed up page load times, which not only improves the user experience, but can help your site rank better in Google search results.

What is a server simple example? ›

server, network computer, computer program, or device that processes requests from a client (see client-server architecture). On the World Wide Web, for example, a Web server is a computer that uses the HTTP protocol to send Web pages to a client's computer when the client requests them.


1. Web Programming - Server Side Include
(Dr. Ron Eaglin's Web and Database Programming)
2. Introduction to Web Development #4 - Server Side | Sinhala Tutorial
3. Server-Side Node: Introduction
( Mulhern Brendan)
4. LEC # 27: Introduction to Server Side Language C# and How can we use C# for Website Development
(Touch Star Institute)
5. Introduction to Web Development || Understanding the Web || Part 2
(Web Dev Simplified)
6. PHP: Server Side Scripting For Web Development | Webinar -1 | Edureka
Top Articles
Latest Posts
Article information

Author: Prof. Nancy Dach

Last Updated: 03/08/2023

Views: 6236

Rating: 4.7 / 5 (77 voted)

Reviews: 92% of readers found this page helpful

Author information

Name: Prof. Nancy Dach

Birthday: 1993-08-23

Address: 569 Waelchi Ports, South Blainebury, LA 11589

Phone: +9958996486049

Job: Sales Manager

Hobby: Web surfing, Scuba diving, Mountaineering, Writing, Sailing, Dance, Blacksmithing

Introduction: My name is Prof. Nancy Dach, I am a lively, joyous, courageous, lovely, tender, charming, open person who loves writing and wants to share my knowledge and understanding with you.