Introduction to web (techie side)

Download Introduction to web (techie side)

Post on 17-Oct-2014




0 download

Embed Size (px)


A very insightful presentation by Nick McGrath about a technical introduction to websites. It explains how a website works and where it lives.


<p>web101.ppt</p> <p>How web sites work </p> <p>An epic story of how delivers important news to my screen every </p> <p>morning </p> <p>Covering </p> <p> What is a website and where does it live? </p> <p> How does our browser find a given website? </p> <p> How does our browser display a given website? </p> <p> What is a database and how does it work? </p> <p>What is the Internet? </p> <p> The internet is like our office computer network but on a global scale </p> <p> There are literally millions of computers in this networked together </p> <p> Simply put the internet is an international network of computers. </p> <p>What is the World Wide Web? </p> <p> The www exists on the internet </p> <p> Its a lose term to define the part of the internet that everyone can see and use </p> <p>What is a website? </p> <p> According to the wikipedia a website is a collection of related web pages, images, videos or other digital assets that are addressed with a common domain name </p> <p> Lets be serious though, we all know what a website is. Weve all been to, or of course </p> <p>Do websites actually exist in cyberspace? </p> <p> No!!! </p> <p> Websites live in specific locations on web servers </p> <p>How do we find what were looking for? </p> <p> With all these computers and all this information available on the www wouldnt it be great if there was a uniformed way of locating all the resources were looking for </p> <p> Introducing the uniformed resource locator or URL for short </p> <p> </p> <p>How does a URL map to a web page? </p> <p> Domain names are part of a URL ( </p> <p> DNS servers map domain names to physical machines </p> <p>Finally our browser has found our site </p> <p> Now our computer can open a dialogue between the browser and the web server using the request-response model </p> <p>Finally a web page </p> <p> This is what we expect to see on our screen </p> <p>How does it happen? </p> <p> A request is made to the server for a single specific file (in this case index.html) </p> <p> A response is sent back to the browser in the form of HTML </p> <p>HTML </p> <p> Our browser reads the HTML and renders it to our screens </p> <p> Why doesnt it look anything like the web site I know and love?? </p> <p>HTML is very simple </p> <p> Yes that kind of simple </p> <p> BUT it does do a couple of things very well </p> <p>HTML has friends </p> <p> HTML is very good at displaying text / data and linking to other resources </p> <p> Links to other resources can be overt or covert </p> <p> This page has been improved slightly by including cascading style sheets </p> <p>HTML and Images </p> <p> Its still not quite right </p> <p> The Browser now needs to request all the Images from the server too </p> <p>We request this </p> <p>It starts like this </p> <p>Trasforms into this </p> <p>And finally blossoms into this </p> <p>Statistics </p> <p> In the example we just saw there were 64 files downloaded to the browser, they were combinations of css, js, jpg, gif and swfs And it all happened so quickly </p> <p> A little closer to home, on the PhotoChains homepage there are more than 130 separate files downloaded!!! </p> <p>So who builds this? </p> <p> Basically everything weve seen so far is built by Keong or a bunch of people like him </p> <p> And if web sites / pages never changed Id be out of a job </p> <p>A little bit of jargon </p> <p> Server side code versus client side code </p> <p>So what does server side code do? </p> <p> Web pages are not all static, in fact most these days are dynamic </p> <p> Servers run pieces of code to deliver different and more specific responses to the browser </p> <p> Server side rarely lives alone though, its usually coupled with one or more databases (or databi if you want to impress) </p> <p>What is a Database? </p> <p> Think of Doms rolodex, it stores specific information </p> <p> The databases we use allow us create our own structure </p> <p>Finally </p> <p> We now know what a website is and where it physically lives </p> <p> We also know how our computer finds that website </p> <p> And finally we know how a webpage gets displayed in our browser </p> <p> We know what a database is and a bit about how it works </p> <p>Honourable techies </p> <p> Thanks for listening, you can all be honourable techies for the day Because deep down I all know you want to be </p>