November 11, 2011
As a courtesy, Anvil Studios is going to offer an in-depth course in the basics of web development. This course will be presented through posts on our blog. This is going to be a N00b friendly course. So if you are already well-oiled in web development, we advise you to turn to more solid food, found in some of our other articles and series.
Welcome to Bootcamp
Welcome to Web Development Bootcamp. During the course of this series we will teach you everything you need to know to develop a fully functional and standards compliant website or web-based application.
Websites can be broken up into two main parts, Client- and Server-side. The Client-side is mostly responsible for display and user interactivity while the majority of logic and functionality is managed by the Server-side. These two parts can then be broken down further into the languages responsible for them and their functions.
The Client-side handles:
- The content
- The way the content is displayed
- The way the user interacts with the content
Each of the above mentioned is handled by a different language.
- HTML : Specifies the content on a page
- CSS : Handles the styling of the content on a page
Initially all of the functionality was thrown together in a single document for every page, but time and experience has taught us that this is not the way to do things. Best practice has become to start off with just the HTML without any styling whatsoever. After all the content has been created the styling follows. Once the styling is complete the bells-and-whistles are attached.
There are several benefits to separating pages into the three different parts and not throwing everything together in a single document. These benefits include:
Because the content and style are separate; either, or both, can be modified without influencing the other. For example, changing the header styling for the template changes it on all the pages, saving you the time of modifying every individual page. It could also allow you to change the entire template of the website by simply replacing the CSS file without needing to touch any of the HTML.
Graceful degradation / Progressive enhancement
There are billions of people on the planet, each a potential client on your website. Person A and Person B might not have the same type of device on which they view your site; They might not have the same browser; They might not even speak the same language. As a web developer you want to make your content available to as many people as possible.
The Server is where all the logic and heavy lifting takes place. The Database handles the storage of all your valuable information, MySQL manages the retrieval and modification of the data and PHP makes the decisions, according to user input or predefined commands, on what has to happen with the data.
For more advanced encounters (Big web apps or CMS) the troops need orders. These orders are given by the upper brass, the General, PHP. General PHP tells the front-line where to go and what to do. When the troops need new supplies or reinforcements General PHP can radio (MySQL) to the home base and depot (your Database) to request whatever they need.
Together the front-line and upper brass make up the well-oiled machine that keeps you safe at night.
Hopefully you now have a better understanding of how all the technologies work together to deliver an end-product to the users. Starting off with the HTML Bootcamp we will take you through everything you need to know to create a fully functional website.
Over and Out