Building My First Static Website

Maisa — Wed, 10 Jul 2024 22:59:04 +0000

Intro:

I first became aware of a company website as important strategic tool when I took a marketing course, for big corporations like construction firms. One of the ideas that struck me with inspiration was over-comming my fear to build a static website, an actual one this time - for Toucsan:-). The initially very scary prospect of really turned into something where I learned so much in the months following doing it, that after all is said and done my taste for web development was greatly heightened.

The Process:

The process started with ideation - researching everything about Toucsan, their industry and customer base. Afterwards, I began exploring the technical and necessary technologies in order to make my vision reality. The mockup design was an essential step during which I could layout the structure and visual styles before being on the coding phase.

The real test of its capabilities came with the actual build. Inspired by the "step-by-step tutorials" that make VLC app-making seem like a piece of cake, I still decided to give it another shot. I losttrack of how many times I got frustrated styling, structuring and integrating features. But as I cleared each hurdle, my confidence and ablilities expanded.

One of the biggest challenges was ensuring the website was mobile-friendly. Implementing responsive design using media queries was a whole new skill set I had to develop. But seeing the site adapt seamlessly to different screen sizes was incredibly rewarding.

Reflections:
While the final product may not have been perfect, I'm proud of what I accomplished. This first static website build was an invaluable learning experience. I now have a deeper understanding of web development fundamentals, from front-end architecture to user experience design.

Most importantly, this project has inspired me to keep building. The sense of accomplishment I felt upon completing Toucsan's website has fueled my passion for coding. I'm excited to take on more projects and continue honing my skills as a web developer.

Conclusion:
Building my first static website for Toucsan Construction was a formative experience that has left a lasting impact. What began as an ambitious goal became an empowering journey of learning, problem-solving, and personal growth. I'm grateful for the lessons learned and the motivation to keep evolving as a web developer.

What happens when you type "https://www.google.com" and press enter

Maisa — Sun, 12 May 2024 22:13:27 +0000

Introduction

Until recently, I never questioned myself what happens behind the scenes whenever I search for a website and press enter, However gaining the knowledge about all of these steps right now makes me want to explain it in a way that's accessible to everyone.
Normally when you see this question and if you have no idea about the answer your basic answer would be that after I press enter I receive a page that I searched for but this actually not the case, there's much more to it, it goes through certain steps just to get you the page you see when you click enter, and these steps are:

DNS request
TCP/IP
Firewall
HTTPS/SSL
Load-balancer
Web server
Application server
Database
Rendering ## DNS request

Simply the network devices are identified by their IP adderesses not their names, that's why when we initiate a website search, the first step is sending a request to the DNS (Domain Name System) server to look for the IP address of the domain name (which in this case is "google").

The DNS server acts as a directory that maps domain names to their respective IP addresses.

TCP/IP

Since we got the IP address from the previous step, now the computer(client) will use the IP to connect to the server just through the TCP(Transmission Control Protocol) connection.
To make it clear to you the TCP/IP acts as a reliable messenger that ensures excellent communication between your device and the destination server, working as a bridge that securely deliver your requests and receives respones and this only happens between your device and the destination server with no one in between.

Firewall

The device you are using may has a firewall as well as the server might have a firewall too, so this firewall checks if the request is allowed, and if everything is okay here and there it allows the connection.

HTTPS/SSL

Using HTTPS (HyperText Transfer Protocol Secure) makes sure the data transfered is secure by encoding the data using the methods SSL or TLS.

Load-balancer

Since there might be multiple servers, the load-balancer makes sure that the request get to the right server, ensuring that no server will get busy with requests just to give the best experience to the client.

Web server

The web server basically handles the HTTP request, decide the action that will be executed then communicate with the application server and deliver web content to the clients

Application server

The application server is exactly where the execution of the request is made, interacts with the database and prepare the response to be sent

Database

This is where data is stored, retrieved, and managed, ensuring that your search query is successfully executed

Rendering

After the response is sent to your browser, the browser renders the HTML, CSS and Javascript to give you the page you see on the screen.

Conclusion

Isn't it very interesting? the fact that all these steps
starting from DNS request to Rendering happens without people noticing any of it, literally in a blink of an eye. Understanding all these underlying processes should get you to appreaciate and love the world of web development.

Forem: Maisa