WEB
FUNDEMENTALS
DEVELOPMEN
T
w w w. l i n k t r. e e / g d g . g h a r d a i a /
Presentation by islam Lameche
HOW DOES THE
WEB WORK?
request from request from
client client
Response from Response from
server server
Client Internet Server
Presentation by islam Lameche
WHAT MAKES UP A
WEBSITE?
FRONT-END (CLIENT BACK-END (SERVER
SIDE) SIDE)
This is the side that renders This is the side that handles
content on a website. most of the logic and data
storage
Presentation by islam Lameche
CHAPTER 1:
FRONT-END
Presentation by islam Lameche
CHAPTER 1:
FRONT-END
When we send a request for a website, what we
get back is the necessary files to render the
page, which are comprised of HTML, CSS and
JavaScript.
• HTML is used to define the structure of the page.
• CSS is for styling HTML elements.
• JavaScript is for making the page interactive.
Presentation by islam Lameche
HT
ML
HTML or hypertext markup language is used to establish the skeleton of our
website.
Presentation by islam Lameche
CS
S
CSS or cascading style sheets allows us to style our html and make it look
more aesthetically pleasing.
Presentation by islam Lameche
JAVASCR
IPT
Not to be confused with Java, javascript is a general purpose programming
language that allows us to add functionality to our elements.
Presentation by islam Lameche
FRONT-END FRAMEWORKS
AND LIBRARIES
Frameworks are a base and collection of tools to facilitate a specific purpose
REACT BOOTSTRAP THREE JS JQUERY
The most popular A collection of function
Bootstrap contains a
framework, allows for For creating and to simplify HTML DOM
bunch of pre-made css
blazing fast rendering displaying animated 3D traversal, event
that can be added with
and reusable computer graphics handling, animation,
utility classes.
components. and Ajax.
Presentation by islam Lameche
CHAPTER 2:
BACK-END
Presentation by islam Lameche
CHAPTER 2:
BACK-END
A back-end is where we process data not directly
observed by the user, typically composed of:
• A server for handling and processing incoming
requests.
• A database for storing persistent data.
Presentation by islam Lameche
WHAT IS A
SERVER?
A server is any software or hardware that handles requests and returns
responses.
-In the context of web dev we’re talking about http(s)
Presentation by islam Lameche
HTTP/
HTTPS
HTTP(S) or hypertext transfer protocol (secure) is a set of conventions for how
data should be transferred over the internet, it is defined by 4 main verbs.
• GET
• POST
• PUT
• DELET
E
Presentation by islam Lameche
HOW TO CREATE
A SERVER
Presentation by islam Lameche
HOW TO CREATE
A SERVER
First we’re gonna pick a programming language, some of the most used ones
are:
PYTHON JAVASCRIPT RUBY
(NODE)
C# GO JAVA
Presentation by islam Lameche
HOW TO CREATE
A SERVER
First we’re gonna pick a programming language, some of the most used ones
are:
DJANGO EXPRESS RUBY ON RAILS
[Link] GIN SPRING BOOT
Presentation by islam Lameche
DATABA
SES
A database is a large and structured collection of data, there are two types of
databases:
SQL (STRUCTURED QUERY NOSQL ( NOT ONLY SQL )
LANGUAGE)
• Data organized in tables • Every noSQL implementation is different
• Each row is an entry • Some are key-value based like redis
• Data retrieved using the SQL language. • Some are document based like mongodb
• Similar to an excel spreadsheet • Data is queried based on the DBMS
Presentation by islam Lameche
THANK
YOU