Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
bernoussama committed Apr 29, 2024
1 parent 3df3d0f commit 46fe46c
Show file tree
Hide file tree
Showing 4 changed files with 64 additions and 42 deletions.
3 changes: 1 addition & 2 deletions src/layouts/Layout.astro
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,7 @@ title: string;
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/uikit.min.js"></script>
<!-- <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/uikit-icons.min.js"></script> -->
<link rel="preload" href="/fonts/geist-font/fonts/GeistVariableVF.woff2" as="font" type="font/woff2"
crossorigin />
<link rel="preload" href="/fonts/geist-font/fonts/GeistVariableVF.woff2" as="font" type="font/woff2" crossorigin />
<link rel="preload" href="/fonts/geist-font/fonts/GeistMonoVariableVF.woff2" as="font" type="font/woff2"
crossorigin />
<link rel="stylesheet" href="/fonts/geist-font/style.css" />
Expand Down
5 changes: 0 additions & 5 deletions src/pages/blog/test.md

This file was deleted.

41 changes: 41 additions & 0 deletions src/pages/blog/web-request-journey.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
---
title: "The journey of an HTTP request"
description: "What happens when you type https://www.google.com and press enter?"
layout: "../../layouts/PostLayout.astro"
---
## DNS request

The first step is to find google's server IP address, so it sends a DNS request to get the IP address associated with the subdomain 'www' part of [google.com](http://google.com) domain.

## TCP/IP

when it gets the IP address your browser establishes a TCP connection over the IP protocol with the server

## Firewall

<!-- If you're accessing Google from behind a firewall (e.g., a corporate network), the request will first pass through the firewall, which enforces security rules to protect your network from unauthorized access. -->
Before the request reaches the web server, the firewall will check it against rules set by Google security teams. Only if the request passes the firewall's rules will it be allowed to reach the web server.

## HTTPS/SSL

since you sent an HTTPS request visiting [https://www.google.com](https://www.google.com), your connection is secured using HTTPS and SSL/TLS. This encrypts the data exchanged between your browser and Google's servers, protecting your privacy and preventing eavesdropping

## Load-balancer

Google's infrastructure is designed to handle an immense amount of traffic. So your request will likely hit a load balancer server first, which distributes incoming traffic across multiple servers to ensure optimal performance and availability.

## Web server

Your request is then routed to one of Google's web servers, which are responsible for serving the HTML, CSS, and JavaScript files that make up the Google search page.

## Application Server

While the web server handles the static files, Google's application servers dynamically generate content based on your request. For example, if you search for something, the application servers will process your query and fetch relevant results.

## Database

To retrieve search results, the application servers query Google's massive databases, which store and index a substantial portion of the Internet's content. Once all the necessary data has been assembled, it's sent back through the same chain (application server, web server, load balancer, etc.) to your browser, where the Google search page is finally rendered for you to use.



This entire process happens in a split second, thanks to the incredible engineering and infrastructure behind Google's services. The next time you visit [google.com](http://google.com), appreciate the complexity and coordination required to make it all work seamlessly.
57 changes: 22 additions & 35 deletions src/pages/index.astro
Original file line number Diff line number Diff line change
Expand Up @@ -8,16 +8,18 @@ import Card from '../components/Card.astro';
<Layout>
<main class="container">
<div class="mx-auto max-w-7xl">
<div
class=" transition-all mx-auto flex max-w-[980px] flex-col items-center gap-2 py-8 md:py-12 md:pb-8 lg:py-24 lg:pb-20">
<div class=" transition-all mx-auto flex max-w-[980px] flex-col items-center gap-2 py-8 md:py-12 md:pb-8 lg:py-24 lg:pb-20">
<h1 class="text-center text-3xl font-bold leading-tight tracking-tighter md:text-6xl lg:leading-[1.1]">
Hi, I’m Oussama,
Your Next Software Developer</h1>
<h2 class="max-w-[568px] text-center text-lg sm:text-xl"

<h2 class="text-center text-lg sm:text-xl"
style="display: inline-block; vertical-align: top; text-decoration: inherit; max-width: 568px;"
uk-tooltip="title: Backend Dev who knows how to center a div;pos: right">
Specialized in Full-stack Web Development
</h2>
<span class="max-w-[568px] inline-block text-center text-lg text-muted-foreground sm:text-xl">
<span class="text-center text-lg text-muted-foreground sm:text-xl"
style="display: inline-block; vertical-align: top; text-decoration: inherit; max-width: 568px;">
A passionate Problem Solver, who chose Software Development to help build impactful solutions
through software.
</span>
Expand Down Expand Up @@ -55,20 +57,15 @@ import Card from '../components/Card.astro';
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/neovim/neovim-original.svg' />
<TechBadge name='Vim'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/vim/vim-original.svg' />
<TechBadge name="bash"
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/bash/bash-original.svg' />
<TechBadge name="bash" iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/bash/bash-original.svg' />
<TechBadge name='Python'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/python/python-original.svg' />
<TechBadge name='C'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/c/c-original.svg' />
<TechBadge name='Powershell'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/powershell/powershell-original.svg' />
<TechBadge name='C' iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/c/c-original.svg' />
<TechBadge name='Powershell' iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/powershell/powershell-original.svg' />
<TechBadge name='JavaScript'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/javascript/javascript-original.svg' />
<TechBadge name='Go'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/go/go-original-wordmark.svg' />
<TechBadge name='arduino'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/arduino/arduino-original.svg' />
<TechBadge name='Go' iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/go/go-original-wordmark.svg' />
<TechBadge name='arduino' iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/arduino/arduino-original.svg' />
<TechBadge name='Typescript'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/typescript/typescript-original.svg' />
<TechBadge name='Astro'
Expand All @@ -87,20 +84,15 @@ import Card from '../components/Card.astro';
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/react/react-original.svg' />
<TechBadge name='NodeJs'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/nodejs/nodejs-original.svg' />
<TechBadge name='Rust'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/rust/rust-original.svg' />
<TechBadge name='Rust' iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/rust/rust-original.svg' />
<TechBadge name='Docker'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/docker/docker-original.svg' />
<TechBadge name='Figma'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/figma/figma-original.svg' />
<TechBadge name='Nginx'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/nginx/nginx-original.svg' />
<TechBadge name='MongoDB'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/mongodb/mongodb-original.svg' />
<TechBadge name='PostgreSQL'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/postgresql/postgresql-original.svg' />
<TechBadge name='MySQL'
iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/mysql/mysql-original.svg' />
<TechBadge name='Nginx' iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/nginx/nginx-original.svg' />
<TechBadge name='MongoDB' iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/mongodb/mongodb-original.svg' />
<TechBadge name='PostgreSQL' iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/postgresql/postgresql-original.svg' />
<TechBadge name='MySQL' iconLink='https://raw.githubusercontent.com/devicons/devicon/master/icons/mysql/mysql-original.svg' />

</div>
</section>
Expand All @@ -119,9 +111,8 @@ import Card from '../components/Card.astro';
<ProjectCard src="images/Source-project.webp" title='Source - Responsive Template'
body='A fully responsive multi-purpose landing page template'
href='https://github.com/0ussamaBernou/source-layout' techs={["HTML5", "CSS3" ]} />
<ProjectCard title='More projects...' href='https://github.com/0ussamaBernou'
buttonText='View More'
src='https://images.pexels.com/photos/270408/pexels-photo-270408.jpeg?auto=compress&cs=tinysrgb&w=720&dpr=2' />
<ProjectCard title='More projects...' href='https://github.com/0ussamaBernou' buttonText='View More'
src='https://images.pexels.com/photos/270408/pexels-photo-270408.jpeg?auto=compress&cs=tinysrgb&w=720&dpr=2' />
<!-- <Project src="https://cocktail.bernoussama.com/" src="/images/cocktail.webm"> -->
<!-- <h3>Cocktail showcase</h3> -->
<!-- <p>Carousel of cocktails fetched from cocktailDB api</p> -->
Expand Down Expand Up @@ -162,34 +153,30 @@ import Card from '../components/Card.astro';
<div class="flex flex-col items-center gap-8 mt-8">
<h2 class="text-2xl font-bold">My services</h2>
<div class="grid md:grid-cols-2 grid-flow-row gap-8">
<Card title="1. Consultation"
body="It all begins with a conversation where we'll pinpoint what this project is all about." />
<Card title="1. Consultation" body="It all begins with a conversation where we'll pinpoint what this project is all about." />

<!-- <div class="uk-card uk-card-default uk-card-body"> -->
<!-- <h3 class="uk-card-title text-lg"><strong>1. </strong>Consultation</h3> -->
<!-- <br> -->
<!-- <p>It all begins with a conversation where we'll pinpoint what this project is all -->
<!-- about.</p> -->
<!-- </div> -->
<Card title="2. Proposal"
body="A detailed project proposal including a visual preview will be presented and a plan of action will be decided." />
<Card title="2. Proposal" body="A detailed project proposal including a visual preview will be presented and a plan of action will be decided." />
<!-- <div class="uk-card uk-card-default uk-card-body"> -->
<!-- <h3 class="uk-card-title text-lg"><strong>2. </strong>Proposal</h3> -->
<!-- <br> -->
<!-- <p>A detailed project proposal including a visual preview will be presented and a plan -->
<!-- of action will be -->
<!-- decided.</p> -->
<!-- </div> -->
<Card title="3. Creation"
body="Clients receive regular updates regarding their project status while I create and test it." />
<Card title="3. Creation" body="Clients receive regular updates regarding their project status while I create and test it." />
<!-- <div class="uk-card uk-card-default uk-card-body"> -->
<!-- <h3 class="uk-card-title text-lg"><strong>3. </strong>Creation</h3> -->
<!-- <br> -->
<!-- <p>Clients receive regular updates regarding their project status while I create and -->
<!-- test it.</p> -->
<!-- </div> -->
<Card title="4. Launch & Support"
body="Peace of mind is delivered with the final project in the form of available ongoing support." />
<Card title="4. Launch & Support" body="Peace of mind is delivered with the final project in the form of available ongoing support." />
<!-- <div class="uk-card uk-card-default uk-card-body"> -->
<!-- <h3 class="uk-card-title text-lg"><strong>4. </strong>Launch & Support</h3> -->
<!-- <br> -->
Expand Down

0 comments on commit 46fe46c

Please sign in to comment.