http://www.prismintelligentsolutions.com.au Level 7, 91 Phillip Street, Parramatta NSW 2150 1300 4 PRISM (1300 477 476) you go ahead on the internet on yourlaptop or desktop you pull up your favorite browser you type in www.google.com and hit enter What happens? Let’s tell this story andwe can be as high level or low level as we want, and I’ll steer us in bothdirections. So you’ve hit enter. What happens? Anything you got? Oh. Good. So that’s the whole story. That’s very good. Let’s tease it apart a little bit now andI’ll repeat some of the answers sometimes into the microphone so thatour folks who are taking the course from afar can hear everything so your computer makes a request through your modem goes to your ISP, reaches google.com serversand they’ve replied with the response, so good. now let’s dive in deeper there, and let’s focus onthe act of hitting enter Does someone want to propose, just give me one step in more technical detail what happensnext and then we’ll get to that same endpoint eventually Perfect. So we first need to translatethe name of the site in this case the www.google.com
you go ahead on the internet on yourlaptop or desktop you pull up your favorite browser you type in www.google.com and hit enter What happens? Let’s tell this story andwe can be as high level or low level as we want, and I’ll steer us in bothdirections. So you’ve hit enter. What happens? Anything you got? Oh. Good. So that’s the whole story. That’s very good. Let’s tease it apart a little bit now andI’ll repeat some of the answers sometimes into the microphone so thatour folks who are taking the course from afar can hear everything so your computer makes a request through your modem goes to your ISP, reaches google.com serversand they’ve replied with the response, so good. now let’s dive in deeper there, and let’s focus onthe act of hitting enter Does someone want to propose, just give me one step in more technical detail what happensnext and then we’ll get to that same endpoint eventually Perfect. So we first need to translatethe name of the site in this case the www.google.com into an IP address and, someone else,what is an IP address? Good, so an IP address identifiesa server or computer on the internet and an IP address is simply a number ofthis form. Let me go ahead and pull up a little scratch pad for notes here so an IP address as you’ve probablyseen as something in the form of w.x.y.z and little internet trivia: each of these placeholders can be adigit from what to what? ...or number from what to what? Perfect. 0-255, and there’ssome restrictions on what numbers can be where, but essentially you have numberdot number dot number dot number. And each of those numbers can be again 0-255. If we’ve really wanna start pressingdeeper here, how many bits is used to represent an entire IP address underthis schema, for those familiar with bits. 32. So why is that? Well, forthough less familiar/unfamiliar, if you want to represent the number 0 - 255which is a total of 256 numbers you need 8 bits because 2^8=256,But we won’t go into too much detail on along those lines but if you’ve seen that IP addressesare just 32 bits it is because each of these numbersis 8 bits itself so actually let’s go here. There will be much math in thiscourse after at the following sentence really but if you have 32 bits:how many possible IP addresses are there for the world’s computers? so it’s to 2^32 which is roughly..those who are good with math in their heads..? So it’s roughly 4 billion. So that’s a lot.But these days most of you have laptops. Most of you have desktops Most of you have telephones in your pocketsor Ipads or the like. So there’s more to placesthese days that are consuming IP adresses so if you follow the popular media of late you’ll find that people havebeen freaking out that were about to run out of IP addresses but that’sbecause we’ve been using version 4 for far too long. Thankfully version 6 (u.v.w.x.y.z) has begunto get rolled out and version 6 (u.v.w.x.y.z) will have128 bit IP address ..which is great, because that’s2^128 which is huge! Barely pronounceable. But it will also become alittle more complex to break these things down so we can squeeze a few moreyears of discussion out of these addresses but realize the world is transitioning now just for the sake of the experiencefor those at home let me actually pause here just so we can plug in this recordingdevice so we can capture to another format so let’s leave that is thatcliffhanger for just a minute or twoand I’ll be right back. Where did we leave off?You’ve just hit enter.We had proposed that your computer had translated or needed to translatethe hostname www.google.com into an IP address and then we talkedfor a moment about various forms of IP addresses so let’s now push a little harder on howthis translation happens so Google has a numeric address of thisform (w.x.y.z) and as an aside Google actually probablyhas a whole bunch of IP addresses of that form. All of which lead to the same experience but perhapsdifferent servers so how does your little Mac or PC orLinux computer know what the IP address of www.google.comactually is? OK, good. So, it has to do a domain namelook up using a DNS server. For those unfamiliar, DNS is domain namesystem and this is an infrastructure on theinternet that pretty much does exactly that. It converts domain names andhost names to IP addresses and vice versa and will see tonight thatit does a few other things in terms of helping with the routing of email with validation of ownership ofdomains and the like so there are these servers out there nowyour computer or your home probably doesn’t have its own DNS server but probably Harvard does if you’re oncampus or Comcast does or Verizon or your company does. Now if you’re at a small college forinstance and you’re not visiting google.com but your visiting some random website.comIt’s very possible that you were the first person on a campus to visitthat website ever or at least in a long time so what if your small little campus’sDNS server has no idea what this IP addresses is? Are you sort of out of luck because youwent to that school, and not one where there’s more people using that websites or equivalently, it’s kind of the chicken and the egg problem (which came first?) if you’re the first person to ever need to visit that website andtherefore your campus’s DNS server has no idea what that mapping is how do you solve this problem? Exactly. So there’s a hierarchy,thankfully to the DNS system whereby even though you might have your ownDNS server on campus or company but that doesn’t necessarily store allpossible domain names and IP addresses in the world. In fact, that would be quite alarge database otherwise and it’s just not efficient to keep all of them aroundif they’re not being accessed at all or very frequently but your ISP knows some bigger fish and maybe thatbigger fish knows an even bigger fish that has its own DNS servers that mightknow, but in the worst case if no one along this hierarchy knows,there also exists in the world what are called root servers which are spread out geographicallyacross the several continents and it’s those root servers thatessentially know who does know, what the IP addresses ofsome random website.com in other words those root servers know who the authority is for instance forall of the .com’s in the world, for all of the .net’s or the like so that you can have this initialrequest from little old your computer bubble up to these very high-levelservers and then bubble back down to some authority who does actually know and the reason why that works is because when you go and buy your owndomain name which is a process will discuss in just a bit you have to tell the world what the IPaddress is of you DNS server, so someone has tobe informed proactively once really and only once when you buy the domain sofor now let’s come back to our story We’ve hit enter Google.com was in my browsers window.My computer has somehow figured out that it is 1.2.3.4 or something like that so now my computer puts together amessage to send it across the internet to Google.com.What does that message look like? Well in it’s simplest form - it’s a messagethat pretty much looks like this. It is literally the word GET in all capsa space a forward slash ( / ) if you’re just requesting the root of the web server markedtypically with / and then HTTP / version number Now in reality, there is a few more headers,so to speak, HTTP headers that get sent from browser to server, and we’ll seethose in action in just a bit, but this message captures really the most important aspect of therequest so your little computer creates avirtual envelope more technically called a packet of some sort inside of thatpacket is a message like this Put on the front of that virtualenvelope is a "To" address namely 1.2.3.4 or whatever Google’s IP addresses is. In the return field of this virtualenvelope you know just like you were mailing something to a human there’s thereturn address who which should be who’s IP address probably? Your own IP addressing, and yourcomputer does know that if you have an internet connection and then your computer sends it out on theinternet. Now we can dive deeper and deeper and deeper but for now assumethat your ISP has what’s called the default-gateway also known as a router and routers are the computers on theinternet that know how to get data from point "A" to point "B", or if they don’t know precisely how to go for "A" to "B" they know whom to pass it off to who can then get it one step closer topoint "B" so in reality a packet, this virtualenvelope, might go from router to router to routerto router sometimes as many as thirty different routers across the globe until finally it gets to its actualdestination Google.com. Google receives this virtual envelope, sees that it’s for its IP address,opens the envelope up, sees this message Google.com server happens to berunning a web server and so that webserver looks for the file called "/" now "/" is typically a synonym for anactual file name like index.html or index.php or any number of other default standard file names so Google grabs that file from its harddrives and then puts it it’s an own virtual envelope flips the two IP addresses the from andthe sender sends it back to the internet via theserouters it arrives on my computer. My computer,unbeknownst to me, opens this envelope sees a whole bunch of a language calledHTML renders that HTML top to bottom and Isee the search page for Google’s main site What is the function of the slash? so whenever you type in a URL There are several differentcomponents to it. HTTP typically followed by :// followedby something like this (www.google.com/) and so this is let’s say arepresentative URL, but we can actually to tease this apart into a fewcomponents. This is the protocol or schema at thebeginning, even though in a browser we almostalways used HTTP:// Have folks seen others? HTTPS, similar, but different, inthat it uses cryptography - a topic we’ll come back to. FTP://SFTP:// WEBCOW://Some of these are more standardized than others but the schema is typically an indicatorto some piece of software how it should view the contents atthat address so what comes after the ://It typically has something called a hostname or sub domain name followed by the domain name, which inthis case is google.com or followed more precisely by a domainname witha TLD - top-level domain a .com .edu .gov .uk would be the TLD and then you havewhat we call a path and a path specifies exactly what fileor folder you wanna access A single slash means get me the root ofmy hard drive and if you come from the windows worldthis is essentially equivalent to C: Or on a mac it’s equivalent tothat, or on a Linux computer it’s equivalent to that. So that is truly the root of your harddrive, the folder in which everything else onyour hard drive lives now it turns out in a browser thesedays you don’t have the type most of that. you can omit the HTTP://You can typically omit the www.You can omit the slash, and things just work Why is that? both for the most part it’sbecause browsers have just gotten a lot more user friendly right there what was the time a fewyears ago where advertisements in print and on TV would actually haveHTTP:// but then the world kind of realized thatyou know anytime you see www. something probably a website so we startedomitting HTTP:// Now the world has gotten acclimated toany mention of .com or .gov so we don’t even really need the wwwanymore and so whether or not www works or doesn’t work is actually completely configurable bythe system administrators of the website and in fact i don’t have a sort of a soapbox to hop on right nowbut invariably during a semester, I’ll come across some website for which foo.com or whatever thedomain is .com just doesn’t work you have to type inwww.something.com and that’s just a foolish technicaldesign decision on their part. We’ll talk today about how you can configure thingsto just work, and it involves a bit of DNS a bit of web server configuration but typically you don’t see that dead end because browsers these days if you typein foo.com and hit enter and there is no foo.com IP address out there the browser will presumptuously or helpfully prepned "www." to the start of theaddress and then retry that one some browsers if you just type foowill automatically try foo.com, foo.net, foo.gov some of the most popular ones so inshort a lot of the technical processes thatare happening are being sort of hidden now by browser user friendliness for better or for worse So, the story began with hitting enterthe story ended with you’re seeing the home page of Google. Any questions on the various steps inbetween, whether high level or lower level? Allright, so that’s the story told from theperspective of a user. Why don’t we tell the story from theperspective now of someone who owns a website or wants to operate a website sosuppose one of your goals in this class or some other is to actually have your own presence onthe web to actually buy your own domainname and have your own business or personal home page or whatever the casemay be. How do you go about doing that? You needmore than just a laptop and a browser now you need a server on the internet because even thoughevery computer on the internet, your laptop included has an IP address it’s not necessarily publicly accessiblebecause even that statement’s a bit of an oversimplification. You do not necessarily have apublic IP address. In fact if you go home and you have internet access at home,especially wireless you probably have a home router like anApple Airport Extreme, or you have a Linksys router or some device with antennasthat gives you wireless internet access but Comcast or Verizon or whoeveryou’re paying each month to give you internet access into the house via yourcable modem or DSL modem which in turn is probably connected tothat router if it’s not one in the same device whichsome of the ISPs provide these all-in-one devices these days Odds are you have one IP address and if youhave 3 brothers and sisters or parents or grandkids in the house all of you are sharing that one IP address and yet the individual computers in thehome still need an IP address. so what actually is the case is thatwhen you’re in a home network you have what’s called generally a privateIP address something of a form.. Anyone know what up popular internal IPaddresses is? Exactly. Anything, in fact, starting with192.168.x.y is a private IP address, so the folkswho invented the internet along the way decided "You know what? Weshould probably have some IP addresses that should never be given out." So that within the company or home or alittle test network you can have IP addresses that areguaranteed not to exist on the public internet so what home routers typically use iss192.168.0 or 192.168.1 and then the last digit, it can be againbetween 0-255, but some exceptions. It really it can’t be 0 or 255, so there are some constraints, but it gives you roughly 250 or so possible IP addresses If you don’t like that, there’s:172.16.x.y There’s a few more constraintson this one, but then if you really need a lot of internal IP addresses you can have what’s called a "class a"private network 10.x.y.z is a private addressand this actually gives you millions of IP addresses for your home or yourbusiness or your data center, but in short any IP addresses beginning with thesefew other prefixes are considered private but the problem then is that even ifafter this class you know HTML and CSS all the better. You know PHP, and SQL, and Javascript and you creates a website and you’verun it on your laptop using software we’ll introduce you to.A web server called Apache no one in the world is going to be able to visit yourwebsite because your address probably starts with one ofthese prefixes and your home router or cablemodem or DSL modems is not going to let outside random people into your homenetwork to access this IP address because frankly there’s tens of thousands ofpeople who probably have that exact same private IP address, so it’s justuniquely identifiable and because your home router and your cable modem is sometimes afirewall into itself this traffic not gonna get into your home so in short that won’t work.. but you have at least two options, twoalternatives, how can you get your website out on the internet? You can. Port forwarding. So let’s gothere. For those unfamiliar when you use a protocol like HTTP:// you’re actuallyusing other protocols behind the scenes and in fact you probably at leastheard the the buzzword TCP/IP transmissioncontrol protocol internet protocol It’s actually two protocols, two differentstandards or languages so to speak that govern how data can be transmitted on the internet and this is a bit of anoversimplification but for today’s purposes assume that IP, the internet protocol, is just a set of conventions thathumans came up with years ago that govern how you associate numericaddresses with computers so IP address derives from thisprotocol so IP is just the standard for assigning computers addresses however justsigning someone an address doesn’t mean you can get data to thataddress for that you need another standard another protocol and that’s typically TCP transmissioncontrol protocol So TCP is the standard that web browsers and web servers speak in order to actually physically move dataor electronically move data from point "A" to point "B" using the higher level notion of anIP address to actually uniquely identify points "A" and point "B" so for those who might want to go further in computerscience and in networking in particular there’s typically what’s called theTCP/IP stack and so there’s topics like there’s thetransport layer down here there’s the others the IP or addressing layer here there’s the application layer in shortmuch of the internet is the result of smart people having design things andthen design things on top of things on top of things and so we just typically over simplifyand say TCP/IP. So what’s the point there? TCP/IP allows not just the web towork but all sorts of applications There’s the web. There’s email. There’s instant messaging. There’s things like Spotify. There’s dedicated applications they’re using the internet but aren’t necessarily inside of abrowser so a server can actually do multiple things.It can receive email like Gmail can. It can be a website and get HTTP:// traffic so a server because it can do multiplething somehow needs to be able to uniquely identify the various things that it can do and so the world introduced this notionof port numbers and typically for a web server Rather, for HTTP:// it uses thisprotocol TCP and the world decided some years ago the number 80 will arbitrarilybut consistently identified this service so if you have a server and you have awebsite, and a website uses, as you probably know, HTTP:// but will look atwhat that means in a bit it is running so to speak on port 80it is listening so to speak on port 80 and the motivation for that is because you might also have an email server on the same physicalbox , right? Gmail, kind of an oversimplification, but they are both awebsite and an email service, and if you want to be able to send email to Gmailyou can also used TCP but you have to use port 25 in other words if you’ve go to http://www.gmail.com a with a browser you obviously want toweb page back so even though you, the human,haven’t typed 80, it’s automatically inserted for you by your browser, behindthe scenes but if you send an email from Eudoraor apple mail or Outlook or whatever you’re using you again probably don’t have to care aboutthis detail but that program is going to send data still to gmail.com but specifically to port 25. So, when a computer’s on the internet, aserver, and it’s listening for traffic all of that traffic comes in on a specificport a specific like pathway into the server so that it knows if it’s a webpage or an email, right? Because especially email; emails can contain HTML now so you need some way of distinguishingthe two fundamentally so when you propose port forwarding, whatdoes this mean? Well, if your home network has a public IP address, and you usually, again, get 1 from your ISP and that is some address of the formw.x.y.z and your individual laptop on whichyou’ve created your final project that you wanna make publicly available is that one of these IP addresses,doesn’t really matter what it is, what you can do is configure your homerouter AKA firewall AKA cable modem, it depends on what make and modelyou have, but that device, you can configure it to say any internet traffic that comes from theinternet to my home on my public IP address destined for port 80 should be "port forwarded" to IP address 192.168.x.y port 80 in other words you can tell this machineto take incoming data on that port and then route it very specifically to thiscomputer, your’s, so that it just works. Now, there is one gotcha here. Especially if you have siblings, for instance orother technically minded family members or roommates if you’re doing port forwarding in thisway only one of you can operate a webserver behind your cable modem because you onlyhave one IP address to uniquely identify your website and if you’vealready claimed 80 as your own and that’s the default for the worldbrowsers to use pretty much only your webserver can be accessed now there is a work around here if yourroommates really ticked off at you, you can say "Fine, fine, fine, I will give you port 81." but what does that mean? That means theentire world has to type out a URL like let’s say your address was indeed w.x.y.z this would be your IP address your URL your roommates, unfortunately, would be thiscrazy looking thing (http://w.x.y.z:81/), right, or any number really. Now, there are some restrictions on thenumbers. Probably can’t use 81, but the point is the same. This is not standard, and you probably don’t want your users having to remember such an esoteric detail as an arbitrary number. However if on the internet you visit any website with :80, odds are you will get to the websitewith which you’re familiar it’s just the browser is again for user convenienceinserting the port number automatically for you. and little trivia for HTTPS, the secure version of HTTP, what port number does that use? 443, and you sometimes do seethat in the URL and you also see some other ports commonly like :8080 :8080 is just kind of arbitrarypopular port that some companies used to run certain services but in short usinganything non-standard these days especially for commercial production websites where you’re trying to make money or trying to stay online up one hundredpercent of the time using non standard ports is bad, because thereare certain companies, there are certain campuses that will pretty much block anyports besides 80 and 443, but thankfully there’s a work around,even if you wanna run some random server like a bit torrent server, or something likethat all you have to do is change the portnumber to be 80 or 443 so the reality is that with firewalling and willhave this conversation toward the end the semester, when we talk about securitymore generally, in a lot of security mechanisms are kindof a joke because all you need is a modicum of savy or you know, having listened to the past30 seconds of words that I just said you can circumvent these kinds of restrictions. Hotels do this a lot,Starbucks does this a lot the port numbers are really just this verybasic mechanism, and the world and adopted somestandards, alright, so, perfect! We have a solution. All youhave to do is somehow figure out how to download the manual for yourLinksys router or Apple Airport and you can configure all this portforwarding stuff and run a website from your own, so not quite. Because if you actuallyhave a popular website, Verizon and Comcast might very well notice and just shut you off entirely, because that huge disclosure agreementyou probably clicked through and never read when you signed up for internet serviceprobably said you may not run a website on your home computer so plus that this was a pain in theneck to do anyway, plus I might unplug my laptop sometimes and so mywebsites gonna go down anytime i go to go out so not the best solution even if youhave a desktop so let’s at least try to push a little harder and assume that weneed to outsource this problem, or we at least need to put your computer on the internet itself, in a data center,on the campus, where it can stay plugged in perpetually, under your desk at work ifthe system admins allows it, and moreover i don’t want my website to live atw.x.y.z, or any number for that matter, I want it to live it david.com orsome URL that is sort of distinctly my brand ormy name, so that begs the question how do you goabout getting your own domain name? Has anyone done this before? Yeah, how do you do it? Okay, where do you purchase them? Okay, so namecheap.com is a verypopular place, fairly inexpensive Go Daddy is another very popular place This one (Go Daddy) is kind of riddledwith up-sell attempts, trying to get you to buyeverything in the kitchen sink, but you don’t need to do that. There’s all there’s all sorts of domain name registrars out there thesedays. A bunch of years ago network solutions was the only one, but then the market was created and sothere’s a lot of places to buy domain names. For the most part, it doesn’t matterwhere you buy your domain name from, but you do sometimes get different features in particular you get DNS featuressometimes, more control over your DNS servers. They might throw in free email accounts,free hosting, but for the most part, it doesn’t matter a hugeamount in particular, you don’t need to go to someone like network solutions andpay thirty dollars a year, when you could go to someone like Go Daddy and pay$9.99 a year or namecheap and pay $4.99 a year so in short paying more for domain name isn’t necessarily giving you anythingmore uh... in the way of uh... functionality. It depends on what maybe the add-ons are. So, how do we go about doing this? Well,let’s go to something like Go Daddy. Go Daddy’s kind of a...Well, let’s actually try namecheap. Let’s go to namecheap, see what theylook like, much of my friends have indeed used thiswebsite. right so let’s see domain name to searchand the search for david.com probably take. Oh,l that is a goodprice. Already doing better than Go Daddy All right. So as I expected it is takenas are almost all forms of david. *Ha* They’ve suggested I name myself "DavidJohn", "David Smith", "David Johnson", "King David", "David Photography.us" So one of the hardest things, frankly, ofstarting a business these days is finding an available domain name, let aloneyour own personal vanity domain names for people’s names but if we found something we like.. MaybeI do want DavidTV... Well, that’s atrocious. $6,000 for this domain but it’s not yet taken. It’s probably one of the cheaper onesup above so let’s assume we found something we’re happy with so we add it to our cart and we check out I now own some domain name,David something.com. So what now do I do with it? How do I associate it with my web server? and for that matter, how do I get a web server?Let’s assume I have a web server, and we’ll cross that bridge in a moment, but I have a domain name. What do I need to do with it to startusing it? Well I need to tell the world what my IP address is. So I need to, somehow, tell the world thatmy server.. I don’t know who’s going to be hosting it, but i know it will have aIP address, by nature of how the web works. so let’s assume I know the IP address isgoing to be w.x.y.z. I somehow have to inform the whole world that david.com’s IP address isw.x.y.z. So one of the things I’ll have to do atnamecheap.com or Go Daddy or networksolutions.com is I tell the registrar not what my own computers IP addresswill be but rather what the IP address of my domain names DNS server’s will be and the convention is typically thatevery domain name in the world should have 2 DNS servers: primary and secondary so a main one and a backup one. They can be one in the same, but theworld really pushes people having at least two for the sake of up time andredundancy so I need to know not my own IPaddress, per se, but I need to know the IP address of oneand then a second DNS server Now I don’t have my own DNS serversand I want to configure two more computers in addition to my webserver so this is where web hosting companiescome in. So in addition to buying the domain nameI also wanna host my website somewhere and it could very well be the same exactcompany. Could be Go Daddy, it could be Name Cheap depending on the service that theyprovide, but we need to have a web hosting option. So what’s the web host going to giveus? A web host is going to give us hard drive to put my files on, you know,maybe not hard drive, per se, but some illusion of storage space they are going to have their ownconnections to the internet this web hosting company there hopefully gonna have a pool ofIP addresses so that I can have at least one of them. They’re also going to have someRAM. they’re also going to have technical support staff. In short, they’re gonnahave a server, and all of the things necessary to keep a server alive on theinternet, and hopefully they’re also going to haveat least 2 of what..? DNS servers. So if I decide to host my website, let’ssay dreamhost.com. This is a very popular sort of "El Cheapo" (basic) kind of web hosting company that I’ve used myself in thepast like $6.95 or $8.95 a month. So that’s pretty good butagain you get what you pay for. I wouldn’t necessarily build a big business on it So for $8.95 a month I have the ability to upload my HTML andCSS files and soon PHP and Javascript files to their server. Their server has nearby 2 DNSservers, each of which, have their own IP addresses. So once I know whatDream Host’s IP addresses are for its nameservers, I’d tell Name Cheap or Go Daddy, or wherever I bought my domainname and that’s it the only time I have to talk to myregistrar again, most likely, is in a year when they charge me another $5.99 or $99 for my domain name. Unfortunately, "buying," you’re really renting your domain namefrom these registrars. Now there’s a whole bunch more involvedin setting up of the web server and getting my files there but at least now I’ve told the world that if you want to know where david.com is Ask these people. These two IPaddresses of the name server. Either one and those IP, those DNS serversshould hopefully know. Why? Because so long as I keep payingdreamhost or someone else $8.95 per month they will ensure that both of thoseDNS servers know what my own website’s IP address is,and how will they know? Because of what I’m paying for is somestorage space and some internet connectivity on one of their servers, oneof their servers has an IP address so they just tell their DNS serversthat david.com’s IP address, is whatever the IP addresses is of theserver they’ve told me to put my content on. and will actually look in little moredetail what’s involved in that. ..but any questions? so in answer to the somewhat frequent problem where a websitedoes work at www.something.com but not at something.com How do you fix something like that?There’s usually two pieces to the solution 1. You have to make sure that there’s aDNS record for something.com that is, there’s an IP address associatedwith it. In addition to one being associated with www.something.com and you need to configure the webserverto accept requests for either something.com or www.something.com but really let’s focus on just thisDNS piece for now. so DNS... turns out the DNS isrelatively straightforward and once you start operating a whole bunch ofservices on your own website. Maybe you have an email server, maybe you want to use hostedservices like Google calendar Google docs. You can do things like actually for CS75, for this course, the TFs (teaching fellows) and I use Gmail essentially to host CS75.net’s email so that’s the website as I’ll soon reveal if you haven’t pulled up the website, and we want to be able to have an emaillist so that each of us can email everyone else very easily. So we want email addresses of the form malan@cs75.net Now how do we do this? Well, we couldset up a mail server, we could pay someone to do this, but an amazing serviceout there is Google apps, some of you might be familiar and for small fishlike us where we only have a few people on staff you can actually have hosted Gmail,hosted Google calendar, hosted Google documents for I think 20 or fewer people for free and what you do is you configure yourown DNS servers to map something like mail.cs75.net to essentially gmail.com so thatwhenever we send an email to something of the form mail.cs75.net, it figures out via DNS to actually go to Google.We could have calendar.cs75.net and you hit enter, you actually end up at Google Calendar,but our copy of Google calendar, and this is all thanksto DNS and there’s only a few settings with which need to be familiarand we already talked about this one an NS record is a record in a DNS server that tells the world what the IPaddress is for that domain. So, what’s inside a DNS server? Frankly it’s a database, and you canthink of it as like a database with excel files so spreadsheets that justhave rows and columns and those columns essentially represents..In each row, rather, you would have for instance a domain name and an IP address.Domain name : IP address.Domain name : IP address. That’s really allthat’s underneath the hood in a DNS server at least so far as we’re concerned. But there are different types of rows.So one of those rows can be an official record that says the name server, NS, for thisdomain is whatever IP address Dreamhost gave me. For instance Now, what else can I have? Well there’s an "A" record. So an "A"record, a row of type "A" in that this spreadsheet of sorts is literally Domain name : IP addressit’s as simple as that, so if I had something.com In it’s like the address should bexd w dot x dot y dot c that’s what’s called in a record and i can also have mail docs aresomething dot com or calendar dot something dot com and i can associate with an i_q_ dress and how do i do this they totallydepends on your registrar or on your d_m_s_ provider whether extreme postergo daddy like but these days it’s usually a webinterface back in the day it was a command line you added a textfile on the server but these days it’s been made to be more user-friendly butit’s essentially a spreadsheet thirst to his slightly fancier features a c name or canonical name isn’t alias so it turns out with a lotof these webservices like school blacks where google’s providing the service you don’t necessarily want to have toknow what google’s i_p_ addresses writers one deep right on the only onewho works there and so you can’t really ask them out frankly could run a commandin figured out but if you hard code into your work in aserver the i_p_o_ dress of google dot comimplication is that if they ever need to change their i_q_ address which happensnot everyday pretty however few months few years for whatever technical reasons now your website goes down it’s common kinda be better at least like a conceptually if calendar dot something dot com didn’t resolve to google’s likey addressbut rather what if pounder dot google dot com could instead resolve moregenerically too calendar dot google dot com so don’t have your domain map to a nikeaddress had your domain name map to someoneelse’s domain and then let baird cnf server tell theworld what the ac current i_q_ addresses of calendar dot google dot com so in other words if you want this layerof obstruction where you don’t care what the i_p_o_ dresses you just care thatyour domain india synonym for someone else’s domain name then you use a c name record and whatthe two columns look like our domain name domain instead of the main aim aki address so it’s a wonderful useful feature especially these days if you look intohosted solutions not just like to collapse but companies that have services like uh... you know i customerservice forums if you go to a website know often havean address like support dot dell dot com or the like well there’s a lot of companies daysthat to provide our customer service web sites at but it would look kind of lame if igo to del dot com and i get redirected to customerservice dot com del would provide read rather re brandsomeone else’s service to look like dell even though someoneelse implemented and is hosting it so why us by a c name someone like dellcould say support dot dell dot com should actually result tocustomerservice dot com but the user should never know that because the oralstage support dot dell dot com so that’s just one of the things you can do with these things called seanangs and lastly in annex record as a maleexchange record and mail change record simply states what is the i_p_o_ dress of the server or servers that shouldhandle inbound mail for this domain and this is great because when you use your door overgmail or outlook and you type in the year uh... davidmail-in at harvard dot e_d_u_ and hit enter similarly there you have no idea whatharvard’s i_q_ dresses but your computer does but it’s not thei_q_ dress of harvard that you do you per se that your email client needs it’s the acted as a partridge mailserver so thanks today that’s your mac or pc can ask your icici is deanna server orgdot doc dot this whole hierarchy we discussed earlier in state what is the annex record forharvard idea and harvard dot e_d_u_ still means nameservers should be able to say send all mail to the psyche address and what’s nice about annex records asyou can have multiple wants with priorities so websites orf rather uh... domains that had very old largenumbers of users were you really don’t want their mail servers going down you could have two or three or tendifferent mail servers and the d_n_a_ system all say try thisone than this one than this one than this one just in case any of those go offline it’s all thanks to d_n_ s and whileresearch take all this for granted once you start developing your ownwebsites maybe creating your own companies or confirming back your ownschool having these abilities is wonderfully powerful and it really boilsdown to basics any questions all right so that was kind of a lot wantto take out three or so minute break characters restrooms in the hallwaythere soda machines i think around the whole corner on the move rejoin in about three mins alright we are back so why don’t we take a look at the courseitself and what you are in four and with the courses expectations are so in termsof prerequisites the official prerequisites are these so much moreyears of programming experience as well as comfort with html c_s_i_s_ so what does this mean in real terms sosummer school is very short since about six weeks and of course has three nalunch for billy sized projects and the gold really is to make sure thatat the end of this short semester you feel quite comfortable going off anddoing much more on your own in the way of website development not just htmlonce yes s informed static websites but reallydynamic websites that are driven by a language like p_h_p_ and javascriptback in the database like mysql so it’s a fairly intense course uh... if you believe takin something like computer science asks oneof the introductory computer science class we’re just one or two courses i will sayfrom past experience you’ll probably find the core challenging to say the least andtypically willy estimate about thirty hours per project so there’s threeprojects universally nine days for each of them on that’s about thirty hours each butthat was beyond average so students for whom programming is a little lessfamiliar or it’s been a bunch of your since you program to read only taken oneor two introductory courses but don’t really think of yourself as a programmer on the course is definitely morechallenging so do beware uh... diving in i will say if you’re on that fence andnot sure if your comfort level in background is there but you can go to c_s_ seventy-five dottv which is the opencourseware site for the course where we have several previous semestersworth of lecture videos handouts of projects some of which will be aresimilar to this summer’s so by looking for the past you canperhaps in for as to what this summer will be like and get a sense then if the p_b_s_ of pastors projectscompletely overwhelm you or completely excites you so i would try to use that as anadditional input tonight uh... before deciding whether this isthe course for you um... in terms of expectations and there are these three projects inattending or watching if distant or unable to make it all in-person thelectures on the lectures will be structured asfollows two tonight our focus is on h_t_t_p_ and for the mechanics theunderlying fundamentals of the internet that for years you prolly taken forgranted but once you really start building yourown website and having to negotiate things like configurations of serversand coding databases tonight will start looking at some of those more technicaldetails on wednesday and han next week will lookat p_h_p_ itself so one of p_h_d_’s on mostcompelling features these days is one it’s in tactically very familiar arevery similar to mine which is with which many of the folks in this room in athome or familiar syntactic lee it’s similar to ciency plus plus on and other a procedural languages on this very much in vogue very popularit’s pretty only present these days in terms of the web hosting companies thatthey’re out there and its super easy get setup even mac o_s_ comes with p_h_p_ anapache the webserver pre-installed and their packages for windows in thenixon other computers that make it super simple to get setup on in terms ofrelated languages rop iphone in ruby you’re probably the to close thiscontenders in terms of popularity with p_h_p_ and none of these is necessarily betterthan the others who could very quickly devolve into a religious debate but one of the nice things about p_h_p_is again the omnipresence of support for a doubt there and also i think pedagogical e thedocumentation for p_h_p_ is outstanding and as you’ll see the p_h_p_ dotnet online referencemanual for functions and whatnot is rich with examples intelligent discussionsand so we’ve just found that it’s a very nice way of diving indeeper to web programming in front of course like this you should be able tocontinue on if you haven’t come from that directionare ready to the likes of pipeline of ruby andrea speed for the job ofworld they espy’s for the windows world there’s a lot of commonalities amongthem will transition lecture three to looking in exile alyssa when it comestime to actually store data whether statically or dynamically you don’t need a full-fledged databaseyou don’t need my sick we don’t need oracle you don’t need anything alongthose lines you could just use text files but he’d be nice if it’s easy to readand write those text file select some now is a very popular language of sorts ofmetal language with which to right now textual files and to representative moregenerally of the topic will come back to when our javascript lectures on the document object models so they’llbe some commonalities there uh... as sql are structured querylanguage is what’s used by a many relational databases these days amongthem my sequel oracle postgresql theirs also in vogue these days or are nosequel servers document uh... storage engines which will look at later in thesemester as well but will primarily used for the coursesprojects my sequel will look at lecture six and seveneighths javascript and at this chat more general technique of ajax the ability toyou whose javascript to query a server even after pagesloaded to get back more data for instancegoogle maps does this to get more reptile squares of mapping informationwhen you click and drag a face book does this to push of liveupdates from your news feed in the light i will look toward the end of thesemester then at some higher level concepts like security which wool interlacedthroughout the semester but will really focus on it in lecture eight looking at commonattacks on web servers on websites on databases so as to not necessarily acquaint youwith everything they can go wrong but to at least plant the seeds in yourmind of things you should be thinking about indeed there’s so much code outthere that is just one ruble because thepeople don’t think do things like sanitize user input that is they don’tcheck it for dangerous characters so we’ll talk about things like sequelinjection attacks will talk about uh... prostate scripting attacks in anynumber of other ways that are so darn easy to avoid yet many people just don’t realize it or don’t know howinferno typically simple little function calls conflicts and in the last lecture will look atscale build so would be of great problem to have if you’ve got so much traffic that all of the lessons you learn fromlecture zero two eight uh... starts at your website searchcrumbling under the load and so will conclude the semester by looking at okay now you have to build now for a fewdozen people two hundred people your school but several thousand or maybe evenseveral thousand people per second how you actually scale from one little webserver to a biggerone but then once you have the biggest andmost expensive available webserver what do you do we start to scale as they say poor isawfully so you get multiple servers maybe even cheaper slower web servers but you somehow figure out how tobalance lowdown so to speak traffic across them how do you do that we databases how doyou do that geographically uh... how do you do that with cloudcomputing a buzzword that’s all the rage these days but has a very interestingtechnologies inter-lining will wrap up this master looking atthose bigger picture issues in addition to second lectures we will have most weeks on sections inoffice hours for the course has uh... for teaching fellows folks whohave either taught or take in the course before who’ll be with us in the form ofsections and office are sections will be a more slightly more intimateopportunities so on wednesdays in monday’s typically right after lectureif you’d like to stick around to dive a little deeper into that weeks project so in addition to the pbf specificationyou’ll get of a project one of its yes will walk you through theweek uh... the week’s project to give point now offer some design tips awesome helpfuldirection answer any confusion why did something quite poorly inlecture we can revisit those kinds of luck topics in sections that you getanother perspective altogether and then office hours which is meant tosimply follow section so one section officially wrapsafter an hour uh... office hours will be anopportunity for one-on-one human a with one or two fifty s uh... and this will be an opportunity inparticular for questions with the projects ifyou’re having trouble understanding something trouble chasing down some bugin addition to reaching out to us on line with a bs in person opportunitiesfor those of you who are local for those of you were dissent more on the online opportunities in justa moment in addition to um... the courses classes there areprojects three of them and they will outflow roughly in the order of the topics onthe syllabus portal start in terms of p_h_p_ which would be new to song ormost people in the room then will introduce mid semesterdatabases in my sequel being will introduce javascript and ajax and so that all sense would be thetripartite approach of the courses projects in terms of thetopics um... in terms of grades on projects aregraded fairly holistic lead because you’ll be encouraged to make a lot ofdesign decisions on your own you won’t necessarily have to implementper slice lee what we tell you to rather you’ll haveto meet certain feature and technical requirements so will to evaluate the three projectson these axes cisco will be in axis that and it’ll be a numeric sport thatcaptures how much of the project you actually attempted uh... correctness will capture how muchof your code works in accordance with us back if it’s very body that would not beconsidered very correct design is more subjective design is painmight work might work perfectly but does it look like a mass underneaththe hood you had like ten nested four that’s that is not good designed forinstance and so designed to be an opportunity forpf particularly qualitative feedback from the teaching fellows on your code and style is the more of the aesthetics or yourvariables reasonably named are is your code well commented is it nicelyindented the sordid easy things that are goodhabits to getting to meet if you’re not yet enough that’s what we define a style and then just for reference things areweighted in roughly the order the amount of time that’s required to get thingsright so for instance this is the formidableused a computer total score for each of the project were correctness for instance isweighted more heavily then style and uh... batch of capturethe fact that inventing a code polish and take you allthat long but she seemed on bob’s concert retake quite a bit of time so the format was meant to capture um... the courses website which helpopen just a moment has everything that you will need for the course includingvideos of lectures if you can’t make it some evening work it’s tricky because afull time work totally fine to watch the courseslectures online all the handout similarly will be available there what will be rolling out over email thisweek is access to a tool that actually uh... we’ve used in another class ofmine concious fifty but it’s a discussion tool that will allow you tointeract with classmates with myself with the courses t_s_ online sab online discussion forms of sorts butusing some of the same technologies that will talk about in the class including a jackson similar on so you will soon receive emails fromus with invitations of sorts to create accounts within the uh... website so that we can you can start directingquestions to classmates poor privately to the staff biopsy is fifty discuss so any questions on the structureexpectations of but here in the right place must of course itself in terms of attendance is uh... expected andencourage bucks not factored so see it in a sense of protracted uh... then in terms of lecture typically wereese were slated for three fifteen to six fifteen i think will rarely go lolthree hours typically the same course during the year on these two hours ofclassical typically have a little bit of wiggle room and let me not commit tojust two hours per night on but we will typically not go i thinkas many as three hours for the frankly a lot to take and com twice a week no less uh... so uh... where we end up its act any other questions olin over there are two sections the implication of that detail is that sections will not startnecessarily eta preordained time what will try to do is the test will come abit early so if we do end up wrapping up a lecturewe’ll take a short break the band i’ve been right outright immediately tosection an office hours so that you don’t sithere awkwardly just waiting for an arbitrary time to come around for the distance students sections willbe filmed as well and we will be making ample use of online interactions forstudents who are primarily distance on and we’ve also experiment in the pastwith things like skype in video conferencing or online chats com were quite flexible forwhatever works uh... pedagogical for folks good question and typically not fordistance jeans with sections we do film them but there is some leniency in whenwe post them we may experiment with trying to straighten some things onlinebut this room is not equipped for that so i shouldn’t makeup promises to thatjust yet but either way things will be availablein synchronously after the fact the office hours will typically be rightafter sections on mondays and wednesdays which are right after lectures uh... the motivation being especiallyfor folks who commutes we figured we try to compact things frommondays and wednesdays you’ll have to come to campus yet again and we’re flexible too if for instance you’re really struggling in the classyou have lots of questions or your schedule you have a nighttime classright after work ’em were happy to do things byappointment as well soldier will will meet you half way asbest we can somewhat hosting companies we talkedearlier about d_n_a_ aspin sort of getting traffic to some destination b but once they get their what’s waitingfor the use or where are your rates tim allen’s yes essence in p_h_p_ filesactually store so this is a little screenshot from thisone company dreamhost and i don’t necessarily recommend them over anyothers but they’re popular among our own andsuper cheap and just to give you a sense of what you get and what you don’t really get here’s a screenshot of what you get forparity for eight ninety five per month so you’d have to get unlimited terabites of disc storage space uh... you get unlimited tera bites ofmonthly bandwidth you get an unlimited number of domains hosted and you get anunlimited number of user counts email account bicycle databases and at the turn of the distribution ofthe next fall back took ourselves to good to be true so what is the capture but that’s an amazing deal for eightninety five unlimited everything so what are some of the taxes are whatare they doing here technologically to make this possible exactly so a lot of these web hostingcompanies are shared services whereby you might get this but they’re also promising the exactsame thing to ten other people to one hundred other people now turns out that its g_d_p_ theprotocol we discussed earlier there is a future for these days forwhat’s called virtual hosting so back in the day for the web everywebsite needed unique i_p_ address essentially so that when you type insomething dot com you went to one web sites and thatwebsite madonna server that server had a nike address and if you want to thesecond website you better get a second server or thesegive that computer a second i_p_ address however in more recent versions ofh_t_t_p_ will see through some experimentationwith actual browsers browsers send and other issue to behatter they don’t just send gets they also send a reminder to the webserver as to what the user typed into the u r l so that you can now have these daysmultiple websites foo dot com bardot combats dot com all living on the samephysical server at the exact same like he address and because the browser’s remind theserver what the user typed in from dot com or bar dot com or about dotcom the server even though it’s receiving traffic forthree different websites can figure out from those so-calledheaders what was requested and then return the appropriate domains homepage so in this case that’s great ’cause it makes thispossible we only have four billion i_p_ addresses in the world in the arelegitimately running out and so this is great that we can multiplex servers inthis way and put multiple people multiple websites on the same mikeyaddress but there’s a couple dot that’s what’sthe implication of yes the fact that multiple customers on thesame machine goods of the mission crashes now all ofyou are affected rather than just the one contention for resources right so you’rekind of in bad luck a bad place it for instance when the other customers on thewebsite server is face book dot com or something then take xiv unexpectedpopularity on all of a sudden or maybe it’s a web site that’s really text someone off and is getting some kind ofinternet-based attacked like a denial of service attack because people going after that websiteand just because your server your web site on the same server now you are down or otherwise offline aswell moreover at one of the res one of theways in which these uh... companies offer such discountedprices this ’cause it’s not just you and to other websites as prime not ten it could be a hundred could be athousand other customers on the same server and so there must be some fine printhopefully there’s some fine print somewhere that does say this is subject tosomething right they don’t have infinite tera bites on their web service infinitebandwidth there’s gotta be some catch here otherwise the world monopoly thousandsof dollars a month to host a real large-scale websites so you again sort of get what you payfor and this is actually expense of yearsago i signed up for some fly-by-night operation for like two ninety five byyear um... to host my website and it was awebsite that i did not care much for and that was good because it went down quitea bit um... so what they’re not guaranteeing here’s unlimited uptime for instance so there some some doctors but frankly if you’re just startingsmall you just one experiment you need it place for testing website or you don’t you’re eight ninety five ismore compelling than several hundreds of dollars or even more um... this is certainly fightscompelling but as an aside things like emailingcalendar and what not there’s another alternatives you don’t need to get thosethirty-year west coast when places like google exist but suppose you are not so comfortable with that approachand you suppose to that you’re not comfortable also withthe fact that we used to not have any control over adreamhost like server because it’s being shared by otherpeople in it because it’s being managed by other people which is to say if they are runningp_h_p_ five point two which is a few years old so rio like you’re running p_h_d_ fivepoint even if you want to take the advantage of new language features theywere introduced in p_h_p_ five three and more recently p_h_p_ five four you’re outta luck like you’re gonna haveto other funny web poster just deal with it you can’t just install it yourselftypically so similar they can you not upgradedifferent versions of software you can assist early reconfigured the webserverat will now they might give you some form ofcontrol but you’ll reach a point perhaps we’re just too frustrating not to haveadministrative access to the server so you can still achieve that so virtualprivate servers d_p_s_ is or an alternative to shared web hosting model and the d_p_s_ world you get a dedicated server to yourself lasorda you get the allusion of the dedicatedserver to yourself so thanks to a technology generically known asvirtualization these days you can park by our serverwith like a bunch of six user a bunch of course lots of ram lost of disk space and then you can run virtualizationsoftware on it uh... something known janet generally is a hyper by sir like vmware or parallels or virtualboxthere’s a whole bunch of these products free in commercial like out there that once you run them and install them on the server on top of that software you can theninstall multiple instances of windows multiple instances of lyrics multipleinstances if they allowed it of mac o_s_ so you can create the illusion ofmultiple distinct computers each of which has its own usernames andpasswords its own administrative or so-called route account and even though they’re sharing thephysical hardware they are not sharing the same software so what you would get as the customer isthe root login or the administrator login to your machine now there’s still the risk of resourcecontention because these players to go to the quickover provision freshly if your pet spending in nineteen ninety five a month and nota hundred and fifty-nine ninety four ninety five months you’re prolly gonna be on the serverwith fewer resources or with more customers but at least here you gain something and if you’ve been following along what is it fundamental you’re gaining from a d_p_s_ that you didn’t get from aweb host exactly control you can to keep things up todate you can install whatever you want and also it’s all morning altar serverscompromised all it’s our your words might not p whereas if the web hosting server iscompromised everything on that server is potentially for durable so still not perfect because the realityis too even though you are the only one nowwith through ordnance traded access because it’s a dedicated albeit virtualserver for you that she was kind of a white lie whoelse has access the people there even if they don’t know your passwordthey have physical access the machines easier physical access to any machine inthe world pretty much you can’t compromise that you can doanalytics computer for instance can be glued in what’s called single user mode by pretty much any letter x when itsbooting up and that sort of bands any request forpassword at which point you can even change it um... even on p_c_s in computers you canusually reset certain passwords by opening the case up putting a little metal connector ontopins in a short circuits out the password and clears it out so in short physical access bat forsecurity so you’re not gaining more security off fundamentally you’re just making it less likely thatsomeone else’s compromise will affect you and in some of these systems somesoftware that system administrators we’ll havethe password or at least access to the root account on your server so in short we should just assumed thatthis is for you but probably at least one other personcould physically access your conscience so what do you get uh... for the money well here and frankly these numbers area little more compelling ’cause it’s not on limited so what you’re kind ofinclined to believe a bit more about the quality of service for getting here but twenty gigabytes of storage nothat’s fine for typical website unless your website has a ridiculous amount of traffic indatabase traffic and logs which could build up and start taking mags arebigger bites of space uh... or if you’re allow users to uploadfiles are photos then you might need a lot of space but many websites even if they aredynamic this is probably planning transfers an interesting one twenty twohundred gigabytes per month for most websites that’s probably fineand less your website is a photo website or worse a video website then you have to start to do the mathand figure out exactly how much traffic data will be coming in and out of yourserver based on users patterns and moreoverthere’s also corner cases this will discuss toward the end of semester yougotta worry about the bad guys out there if someone just unlike you words boardor download some free piece of software that bangsar bangs the heck out of yourcomputer they could just you’ve got your monthlyallotment of bandwidth just by sending bogus traffic ordownloading the same video again and again and again so there’s very interesting adversarialtax when you have finances somehow tied to usage so youneed to be where that especially with cloud computing uh... and let’s see you get some amountof ran five hundred twelve megabytes here and so forth one of the things will lookat the ring the semesters we start playing with apache is all give you a sense of uh... how youcan assess how much ran your computers using image disk space it’s using i dare say when the most commonplatforms for web hosting these days whether it’s a vp s or it’s is a uh... sir by post izla nixon some form whether it’s debbiein or for the world war ubuntu war red hatter sent offer any number of versionsof the next will happen to use the door of the classbut it’s representative of many a similar operating systems you can use mac o_s_ but it’s not reallyuse commercially to host websites just ’cause that’s not really xoxo geared toward that you can use windows on but you reallythere’s no good reason there’s no come technically compelling reason touse a windows machine to host things like p_h_p_ your python ruby ’cause you’re paying money for windowslicense to run free software so it’s not necessarily compelling unless you are apowerful licenses and have the machines uh... generally going with these open-source tools is uh... quickcomment compelling because none of the software reviews in the course uh... cost any money whatsoever andthat’s nonetheless quite popular and robust so went out declines so we will introduce it tonightbut we will in the form of the first project so that you have an experience in the class that is as realistic aspossible what will actually have each of you do is run your own webserver and run yourown database server and actually run your own copy of lennox itself for this will use another tool that iuse another possible i’m told this is that the appliance and this will be adownloadable file that inside of which he is ininstallation of land expat or lennox pacific lee but also installed for you in advancewill be apache which is web server software my sequel which is databasesoftware p_h_p_ as well as support for a bunchesof other languages in standard tools and the like and the up side of this is that ratherthan have you connect for instance to some random harbored servers on whichyou only have temporary access this is a virtual machine that you’llhave a new computer for as long as you want to keep it around and it’s veryrepresentative of the configuration you would find added d_p_s_ or at a commercial web host and becauseyou’ll have a real access on its and because it will be live on yourmachine only you’ll have perfectly secure access to it ominous your laptop or desktop iscompromised and you’ll be able to configure apacheand p_h_p_ and really tinker with things and best yet best yet if you showed up that’s fine used on the new and you’reback to sort of beginning comes along as you’ve saved your code somewhere whichwill encourage you a how and where to do so more on that in a week or so and how would you connect to this kindof thing uh... so as the states zen one u news so why not use this as a ship status so if you have any specific stands forsecure shell and this is a way sort of all school waybut now much more secure of connecting to a remote server andexecuting commands on it so this is just uh... free program that comes with maco_s_ terminal and there’s analogues for the windowsworld party has a free program for windows that a lot of people like to use and it allows you to open up essentiallya black and white window or white and black window and see type in a username and password connect to some remote server andexecute commands on it and those commands can be to create files removedfiles configure the webserver turn the database on or off for the like so what they’ll find once we start usingthe c_s_ fifty appliance a virtual machine albeit running on your owncomputer not some server is you will be able to connect to thatappliance as though it’s a remote server looks sothat you’d never even need to see the appliance itself literally once you turnit on you can minimize it and pretend that it’s a server somewhere else on theinternet because once you install it theappliance into a virtual machine is gonna have its own i_p_ address but it’s going to be what type of i_p_address so it’ll be private to your own laptopso no one else can you can access it but you’ll be able to go through preciselythe same motions that you would if you are actually paying some third party tohost your website or you own some server outs where on the internet servicesdates will be one of the techniques that we use s f three p for those unfamiliar this isa screen shot of a popular of windows client for transferring files calledsecure effects but others exist free ones in particular just listed writing drop files from yourcomputer to a server but in this case the server is going to be a virtual machine runningon your own computer that may be maybe or maybe not is minimize but again experience of the precisely the same sold where does that still be bouts so turns out when you are writing html uh... you at fairly static content but you do havethese mechanisms and i’m guessing most people in the room have some were a lotof experience with it’s you know and basic web sites on thelife but these ultimately already basic input mechanisms by which we canstart making dynamic websites in other words we have text field password fieldshidden fields checkboxes radio buttons drop-down menus so these are the mechanisms by which wecan start to get input from users so that when they interact with ourwebsite they don’t necessarily see the same thing rather they might see different thingsevery time we visit that website so let’s do a little example here i’m gonna go ahead and don’t download this on your own just yetbecause we will be posting a newer version soon but i’m gonna go ahead andopen up a program coldfusion vmware fusion this is what’s calledgenerally again a hyper visor virtualization software and what i’ve just done is essentiallyrun lynn x on my own that and you too can do this i’m gonnaactually use the lyrics desktop discuss its here but i could similarly minimizeit as i will just few minutes and will connect to his well so now i’m runninglyrics on my syndicator and notice i currently have no idea dress that theyshould change in a few seconds once identity there we go so my lyrics computer virtual machinehas just asks for the network give me i p address and it came uh... the protocol the computers use to get idea dressesdynamically does anyone know dac p are dynamic host configurationprotocol that’s what did that it’s also how your own personal computerworks at home and gets a nike address from your links this router or airportextreme so i’m gonna go ahead and to do with this first let me go to mike backto my mac i’m gonna open up the simplest theprogram’s text edit which is what we used earlier animated just make a very simple webpage on first thing i do doctype html so in the course will use html fivewhich is the sort of the latest and greatest version of html and so i’m gonna say hello now let’s do this let’s call this and then body and close body and then on to say cool on ok gonna save this ominous go aheadand save it on my desktop as google dot html i’m gonna say yes uses two million ofthe text file and now i’m going to go ahead and pullup google dot html so i’m not exactly google just yet i cando a little better so let’s make this a little different slowly going here did style text align center so into any of this looks completelycritical new these are the kinds of things that we will take for granted andof course that the stuff looks familiar so let me say the relocate now looks alittle more like a low but it certainly lacking in some key features among them i searched far right so let’s go thereso let me start to make a simple web page that i get on thirty many of youcould have done are ready cuz you know html and forms and what not so let’s go ahead and do this it down hereon an essay form close by for a minute ago and fear and i needed inputs tight equals taxed and i prolly need a summit by hand solet me did input by you poor summits if this aboutyou starts with victory it as best we can saved reload okay so now it’s getting there this isn’t the prettiest things so letme go ahead and do style wear flats sade two hundred pixels school back here and say it it stilllooks a little small three hundred pixels uh... looks more global alike and we really want to be an all here we could do this line lucky so now we’ve got roughly google but inblack and white so unfortunately takes away more work toimplement the back end of this website writes a front-end pretty easy werepretty much done other than some colors and some other features these days but what about the back end so if iactually wanted a patch into google let’s see if we can now revisit thatconversation we started earlier when i tried to dublin dub dot google dot comis the answer what really is happening let’s take alook underneath the hood let’s look at the age to be traffic and think aboutwhat it is we’re gonna start building next week in terms of the actual backand so let’s suspend this mental thread pull up the actual global dot com and take a look at what’s is here i’m gonna go ahead first so that this is new lightning think it is we have the disabled this annoyinginstant search feature select this here i come search settings google instance disabling never showed instant results so thereason i wanna do this is ready to talk about javascript and ajax thetechnologies that nobody’s on annoying or beneficial instant searchfeature we wanted to sort of all swollen she d p searches right now sub disabled that’s so now hopefully ican save okay now i’m gonna go back to build adot com is what it is like five years ago when you want a search for somethingon the internet so now i’m going to go ahead and takefor instance harper so it’s still doing auto complete butit’s not immediately showing me the search results so now notice before here’s the or l onthat dub dub dub dot google dot com and now after early hit enter now known as the oracle so they’re this is now hinting at the fundamental functionality ofh_t_t_p_ we had just issued one of those debt requests we had two of them in factthe first one came up when i visited the home page then i hit enter in it appearsthat another get request has been sent wide because when you are all changed sogenerally anytime the keyword get is involved it’s because the orals changed or equivalent leave the aural changesyou just to get most likely so there’s a whole lot of distractingstuff up there but what is relevant in uh... what looks familiar up there in the u r ellen gray i have no idea what h_l_ is site so i don’t know source i don’t knowbut what looks familiar okay harbor so let me delete manually all the stuffthat i had no idea about what it means at least not yet so mummy i don’t knowwhat this is q equals harvard that i did okay legals harvard apple q i don’t knowi’m just gonna presumptuous the whittle it down to thatanalysis answer so interestingly still works and what’s nice is that there’s muchless distraction we can have the same story boat with fewer distractions indetail so it looks like when hitting enter on the previous pageif i throw away the distractions i have now been fitted snot slash butslash search question mark q equals harbor so what is q she wasgenerally known as the h_t_t_p_ parameter so it isn’t input to a webserver that’s generally comes from a four butas we’ll see a few weeks ago also confirm javascript doesn’t have to comefrom a form per se harvard is obviously what i typed in sowhat is slash search well it’s not obvious here whatprogramming language google uses before on face book we would probably seesearch dot p_h_p_ his face book is known for using p_h_p_ there also known fornot hiding their file tensions which is very easy to do but they just don’t forsome reason gold does hide their file tension but alot of google’s code at least run-in has written a currently in python or in some other languages so it’s not clear what language is on theserver but slash search is referring to some files or somefolder on the server what is the question mark the no the start of the parameters so anytimeyou have a question mark in your old that the marks the path and the preceding part of you are all from all of the parameters andparameters are key value pairs something equal something and if you have multipleparameters what separates them even though i already deleted the others ends the ampersand say assemble so if ihad it deleted all of that recall that we saw something like thisjust a moment though and boat hwy quills harvard and i don’t knowwhat took you is but that’s how you would separate parameterswith m percent so this means we have submitted uh... ke of q anna value of harvard tothe server so now let’s use a fairly common toolbuilt into chrome it’s also built into safari firefox or something similar when werecommend something called fire bug on the courses website with which to do the same kind of thingbut i’m in a good of you developer and developer tools and i will say thesedays certainly when using lamp clinics apache mysql and p_h_p_ which is thiscourses focused uh... many people are increasingly usingchrome one because it’s popular too because it’s faster because it comeswith some developer tools i would say firefox is also wonderfullyconvenient for doing development the mifsud certainly task on multiplebrowsers as well uh... require in one of the prep in thefirst project spec on you can get windows of rather internexplores getting better about having some integrated development tools fromthe course of perspective we don’t care what browser you usebecause you’ll be using again the appliance as a server you can use whatever browser whateveroperations from on your own computer that you’re most comfortable with but you are coming to this with some i’d say uh... less familiarity uh... with varioustools chrome is pretty popular in firefox tendto be packing better for development purposes in indonesia task on all ofthem so one of my senior i’d just opened thedeveloper tabs and now i have elements resourcesnetwork scripts timeline profiles audits and consul we’re not gonna use all ofthese but if you would never quite helpful one the elements have shows you the page’shtml but it pretty princess for u and itmakes of hierarchical so that with those little triangles you can dive in deeper n c even though if we look at you source forthe page it is an automatically of the page afaikuh... over here and view page source this is what came back from the server and i would argue this is not veryreadable unanimity actually still al even the html not that readable colorcoded maybe still not useful so what is this still x the developer toward actually parsesit for you see can start to navigate and this is actually wonderfully compellingwhether it’s your site or someone else’s if it’s someone else’s it’s a wonderful way of learning howthey did something or how they stylized something if it’s your own site sowonderful way of chasing down bugs and also as you’ll see changing on thefly some of the aesthetics without having to change actual filesand then relo notary upload so we don’t care so muchabout elements right now we do care about network so let me go tothe networks have and what this tableau do first is uh... smith all of the network traffic between mybrowser and the server and will show each peacekeeping requestone per line at the bomb some gonna leave this window open andclick reload and again this is my u r l that’s a lot i’d only hit reload oncebut why in the world that so many rose appear down here by clicking wants but look how much stuff just happened each of those again represents an eightyd p requests or virtual on bola from browser to server and back yet what does that mean behind the scenes okay good civil winnie support otherthings to me and concrete example of something as the polar so inside of the htmldiff initially downloaded therecould be an image tag outsource tackling two tak two si es esta javascript imagescould be flash files could be a whole bunch of other assetsso to speak and to get those the browser ispredefined to sort of a personal ego get thoseassets so if it sees a source tagore image tag it will send another virtual enveloperequesting that file specifically it might do it over the same networkconnection the same t_c_ p socket so to speak but each of these rose represents adifferent file that was downloaded ironically it seems that’s harvard’s notbehaving well win the terms of the auto previews but that’s good another day wecan look at why uh... but let’s look at the first onebecause that’s the one that will be the most enlightening for now and when i click on this there’s a few details so one the preview is just what was returned and here’s another big mess of resultsfrom the web server but we don’t care so much about that i care about the headers so many zoom in on this and rather than look at this fairlypretty printed version of it i want to look at the brawl source over diving indeep sort of uh... intellectually here so let me look at the source now this is what was literally sent in that virtual envelope that we started tonight’s discussionwith so there’s the top-line debt slashsearch question mark you week was harvard stay safety p slash versionnumber so that was in the envelope and we did promise to some other stuffin there second line is a reminder to the server as to what the user type and so what isthe hostname now frankly but was not sharing theirservers with other companies most likely so this doesn’t really matter there butfor shared web hosting companies the fact that i’m being reminded what do u rl was means i can serve up food dot com or bar dot com about us dot com sothankfully it’s d_p_ does that there some arcane information here related to passing and connectionsinefficiency only wait my hand it back for now user-agent is interesting you might notice are ready but if youdon’t every web page of adverb visited is every website you’ve ever visited knows what computer you have and whatopportune system you’re running and what browser you were using why is that what browsers by default reveal precisely that information i’dhave just told global behind the scenes that i have a mac running mac os x are ten point sevenpoint four and if i scrolled down further or they will be able to inferthat i was using chrome versions something or other so why in the world is that useful good so hard to believe this is use fullfrom the bugging purposes useful for demographic purpose is to know who yourusers are goods so there’s some features that could bedictated by what type of o_s_ or browser someone’s using for instance if you goto a website that lets you download software it’s not necessary that you detect withusers opportune system browser are it’s kind of a nicer user experience if theserver only shows you the mac software because you clearly have a mac asopposed to me having to figure out which of the links to click for lenexa windows or mac o_s_ uh... another argument frankly is thatthis is completely unnecessary and we should never gotten to this habit in thefirst place because it for uh... it’s not necessarily used all that much and indeed writing websites that of require knowingwhat the user’s browser is is actually generally bad practice because therewill be certain privacy tools that users can install on the computerglitches hide this information altogether for better or for worse and if you’rerelying on certain headers to be sent your own website could misbehave so they work turns out there’s othertricks for doing detection and typically is will see in javascriptit’s better generally to detect whether a browser has a certain feature rather than is that a specific operatingsystem for specific version of a browser however databases for the billboardsthis that allow you to figure out based onthe so-called user agents strings what version of browser inopportune system someanswers because frankly this is a little hard to read so softer exist thatsimplifies this so you can just check a boolean variableis mac ortiz pc our butts below so more pain details that always my handthat cookies will come back to in a week ortwo when we have to start using them to our advantage but will also talk aboutthe security implications of them but in a nutshell all of these headers just text is whatwas inside of that virtual on book and the mostimportant one arguably was the very first one ’cause that tells people whatto return but now we see that it’s not just last it’s a full path so google has hopefully parks thatstring so-to-speak slash search question markcubicles harbor and then you lustig you equals harvard as import to its database or what not to return customized results to me now if you scroll down let’s see howgoogle reply so this is just a chrome thing it is just kind of dumb down display ofthe query string printers justice useful specially for developer you can see itmore easily this way but let me go ahead and use source nowfor response headers this is what the server responded with so turns out many of you have seen numbers return byservers who has ever seen message four oh four comeback it was for foreman file not found right so it’s a nation’sbee status code it’s an arbiter number the world decided on years ago thatmeans files not found what are some others you might have seen sizes five oh one so internal server error ofsome sort five oh three audience another internalerror or resource are forbidden there’s four oh three rather which isforbidden uh... three oh one and three oh two areredirects which are actually quite useful will start using those in thenext lecturer to such aren’t there some codes that you’ve probably seen for fourth may be the most popular two hundred you might not have ever seenbecause the best one of all two hundred is literally ok in theseeverything worked out well see just don’t see it because it indicates success as thoselittle green icon that we uh... saw a moment ago before i expandedthis so this is the servers response two hundred means found what you’re lookingfor here it is now what else comes down we have the date from the server whichmight be useful uh... expires in past controls sodirectives to the browser saying do or don’t pass this even though these arenot necessarily reliable talk about this when we get the p_h_p_ uh... this is interesting set cookie set cookie is amazingly powerful if nota little unsettling especially northern advertising in tracking but we’ll talkabout that in the context of p_h_p_ notice that the servers telling us thatit supports jeez it which is like uh... compression utility which is a compression utility in thisjust means a you can compress your date of june from me uh... the name of the server g_w_ s probablygood google web services and then some headers that they use forsome the security things will talk about later in the semester so that’s whatschool was returned in addition to the content that has come back from theserver so let’s see this outside the scope of abrowser on the boat open uh... a program called terminal the switches comes with mac o_s_ forthose of you with windows padi as another option will look at that uh... or encourage that info my musicsupply uh... bull book at that or recommend that for future projects aninterim program call telnet telnet is like associates put uninfected nowthat’s a bit of an oversimplification i’m gonna go ahead and tell that togoogle dot com and nothing actually happens but he didfigure out the was likely address so that’s interesting but tell that by the fall uses porttwenty uh... has been so long twenty-one tom is a sport twenty want to see peopleare twenty-one bikes there’s no tone that server their tone it used to be tosend messages and connected email servers in the like but what if i instead say eighty so there’s no colin in this programthere is in a browser but this is going to connect from mylaptop to google dot com on ccp port eighty so this is interesting now i’ve connected to their server wine are how do i know that stony connected to tell doubly dot dotdot l dot google dot com where did this all come from the days of the n_ s_ trickery tally forload balancing purposes they had multiple server so they’re fraud gottenone of them specifically but i’m gonna pretend to be a browserunless they get me slash using issue d_p_ version one point one and the answer and then if that’s the last of myheaders i have to hit entered twice and wala what do i see well the fonts kind of big in the htmljavascript kind of mina five but that’s exactly what my browser got back but ifi keep going up and open up and up notice i can say exactly what the servers response was so i see my age to be headers they cameback from the server uh... set cookie and all those samelines exactly what i saw on the browser so i just pretended really to be a browser and we can do this withany websites and it’s more than just a curiosity canactually help with the bugging great actually seeing what’s coming back froma server i can do dot dot dot dot harvard dote_d_u_ eighty death slap slashes vp one point uh... one answer answer so interesting bad request now why is that said we see some html isthis the webserver assumes that a browser will typically be doing this why might this be a bad requests i’m actually in a guest here let’s trythis gets slash is tepee one point one post prioritize u so it didn’t like the fact that i didnot say the host hatter which means harvard’s web serversprobably using something called virtual hosting which is that feature i alludedto earlier when a website can support molt when webserver cansupport local websites bought for that to work browsers have tocooperate and the fact that i did not send that had her meant that the serverdidn’t know who’s hoping to return so we gave me that four hundred response of i don’t knowwhat to do now let’s try one other thing on thecancelled s and let me do telnet sue not dubbed the dubbed aharbored idea let’s try this one to see what happens so get slash h_d_t_v_ one point oneanswer answer they didn’t like that so let’s fix thisagain so gets slash uh... issue the p onepoint one post harbor dot you do you answer answer interested this is not the home page where i getthis time some message about it’s moved harbor but you do has moved permanentlyyou know that’s and if i scroll up more esoteric lian headers is one ofdifferent status code three oh one which you mentioned earlier three oh one thesepermanent redirect if a browser receives a three oh one it should never asked that questionagain it should just remember harbor dote_d_u_ moved any move to wear to the value of the location field whichshould also be included in the response centers how did that happen well some system administrator gene atharvard just decided arbitrarily that’s but reasonably that we don’t want to standardize onharbor dot e_d_u_ ann arbor authors in people’s browsers we want themautomatically to be redirected to dub dub dub dot harvard dot the id a dotharvard dot e_d_u_ white one printing minutes one it’s perfectly reasonable to more technologically it can be betterfor securities a bit of an overstatement butfor technical reasons having the w_w_w_ means your cookies can be isolated tow_w_w_ dot harvard dot e_d_u_ whereas if your cookies were insteadsent to harvard that you do you that means your cookies could be read reallybite any websites so including c asp dot harvard dot e_d_u_ or xd summer dotharvard dot you do you so they sing doubly david w you’re also forcing uh... released bydefault cookies to be more precisely define so there’s some technical reasonsas well only a year or two ago was this problemfixed on the recent a few years back someone on a new came to harbor tour onthe news office and one of her first things i one of her first acts was to fix eucharistic omission for years recoveredthat you do you did not exist devito v_w_ dot harvard dot e_d_u_existed and they weren’t even redirecting south that is a bug that’snow been uh... and questions then uh... what just happened and one of the terminal window open themeat offer up some other troubleshooting tips anissa lookup nameserver lookup is awonderful way of doing those d_m_s_ lookups we talkedabout before what i’ve just done is asked the nearest city in a server whichhappens to be this because that’s how harvard’s configuredthe campus that’s the deanna server and i’ve asked what’s the idea dress ofharvard i do u and it’s given me the psyche address so far we get curious that we do that’suh... they should be peak on five slash i can address interesting whatever why this is not working willagain be hosting like the website is not configured to understand mikey addressesby default however let’s try another one and it’slookup cnn.com what c_n_n_ dot com interesting so it turns out we denounce you can alsodo what’s called round robin you can return multiple mikey addresses for web server and those can rotateliterally in the order in which their return to do but balance and we’ll discuss that topping again forthe end of the semester and scale ability but let me just one of these and c_n_n_ either pretty day on guessingthey don’t really share with some other websites so let’s just go to their i_p_address and indeed there’s works now notice my you are all hasn’t changed so now if i really want to get sort ofphone uh... i really want to get sort of uh... creative i’m gonna do this on mymac and you can do this on a windows machine is well there’s typically fileon macs in my next computers is called at sea coasts which is a text filebitmaps that hard cuts ita dresses four domain names this is useful generally for internalcorporate used for development purposes so will be able to do this with projectsas well uh... i’m gonna go ahead and uh... sentthe case here just a text file and noticed this issome basic ones that come with the system this is my t_v_ six version sixaddress written in a uh... crazy form i’m gonna go ahead and paste in not thatu r l but the i_q_ dress of c_n_n_ and i’mgonna say this is david news dot com so this is like manually overriding the mapping bataya ki address tosomething else here only for my own computer i’m not running again a server it’s just that my opportune system ako s in windows issupposed to look at a file like this before asking india nasser so now let’s see if this works doesn’t work with allwebsites but let me go to h_t_t_p_ colon slash slash david news dot com kamon areas i’d just made my own or new site frankly this is kind of stupid of themum... they go i was just joking with somefriends the other day that you could kind of have fun with this and make fairly offensive domain names of theonly to c_n_n_ somehow uh... and why is this so this is trivial defects frankly in aweb server i a web server could be configured as you will be able to dowith features of the past you before long of checking upon receipt of one of those virtualenvelopes what was in the to field if the to field does not match somethingthat were happy with redirect the user how you respond withwhat sascha three oh one somebody’s actually trivial to fix thiskind of things that could still be they can’t stop david news dot com fromneeding to c_n_n_ dot com but they can stop the browser fromstaying there or the spy encouraging it without three oh one to redirectelsewhere and this redirection is super com andnot just for harbor dot you do you but even the courses own website if i goto issue p colon slash slash two seventy fivedotnet and hit enter notice what the oral changes too a few things happen there so this is the courses website what aresome of the things that got answered in automatically it seems deaf indeed so idea then just go to thedub dub dub version i also went to the secure person why we’ve just gone into the habit and ipersonally guns out of using us as offer everything it’s relatively cheap to doit’s relatively trivial to turn on and it’s only getting cheaper it’saccuser getting faster and some of you might be familiar with abouta year-and-a-half ago uh... toolkit caught fire shape was released which was a wonderfully free proof ofconcept of something called the a session hijacking attack something we’lltalk about in a few weeks time in the context of security long story short if you are visiting thewebsite that uses h_t_t_p_ colon slash slash it is fairly trivial for someone in your nearby wirelessvicinity whether in this room at starbucks even in your own home if youhave adversarial for gaza blends are roomates to can’t login to your facebook accountor your google account or i cannot go facebook account twitter account or anywebsites that’s not using h_t_t_p_ ass and that is because if you’re not using a g_p_s_ nothing’s infected known probably knew that but among the thingsthat are infected or things called cookies so if you are just broadcastingcookies and cookies it turns out is hosting aweaker to hard the mechanism by which users are remembered as being loggedinto websites if you’re just sending that cookie tool website again and againto remind unlike n on login on login that sign creek did anyone in starbuckscan sniff that cookie and with the right technical savvy asyou will soon have senate has their own another log into whatever you work doesn’t mean they know your password but it doesn’t mean they can hijack yourcurrent sessions so to speak so a protracted google because globalabout a year or two ago thanks to some of the issues in china they had withcrack hacking and whatnot they transition all their services to asteep yes at least if you opt into at face book also find the offers this but again we come back to this uh... youa few more weeks of insecurity in your lives if you don’t mind but will come back to this and talkabout how you can have certain defenses up and i tragically even websites that redirect strong law the uninfected version to the infectedversion might still be vulnerable because many of those websites willfirst do a redirect that sends your cooking in the clear andthen it realizes all of this to be secure by then it’s too late so even thoughbanking websites almost always uses there have been certain banks to beknown to be not to technically uh... savvy who are still leaking cookies on four uh... reasons that will soonreveal so i said the duh duh duh based ups and then this stupid main page whichis a media with the thing which is the tool we use for the courses website it’sfree with the software and that’s not really intellectuallyinteresting just their own software contact any questions on a cd p will delete david news dot com and again that wouldn’t work with allwebsites in fact harvard’s probably would not work for us so which is the party’s hdv headersstill become in invaluable resource when it comes time to chase down blogs arefeatures in your own code let me take another quick look atsomething within krone’s uh... developer toolbar in more than onelast thing with regard to google and see if we can implement a little more of ourown version of the world so let me go to the elements tab and just as a proof of concept here goeswhat’s adds a little complex underneath the hood but let me go ahead and right-click onharvard university and they choose inspect elements and inspect element is nice because it’sgoing to jump me right too the part of the html that relates to that portion of the pagewhich is wonderful useful for diving in deeper to specific place so that is the a_h_ wrath that got me atharvard university link now suppose i’m actually google’sdesigner and we’re not quite happy with the shadeof blue where the font size or font face it so i want to take over the website but frankly i don’t have to log into theserver and change font size and save the file dinh reload the browser and go thro the suit kinda like to do it uh... in line in the browser albeit at withoutsaving any changes so notice you’re on the right if you’venot used from before that gordon developer tool bar notice on the right you have a summary of all of the styles that relate to thatspecific elements in the web page so from top to bottom here’s the cvuh... there’s the ciency assessed cascading top-to-bottom here all of the rules that apply to thatall so there’s apparently somewhere and googlecssc apparently the file called search online sex and a link uh... dot w class mention inall of this where they’re specifying the color of the link in the cursor thatshould be used over it so let me just right for text legallyhere let me just change this to let’s say something we the random like or just so that is what i’ve done a their changewho was elected or of course non permanently and only for the links inthe page for which that csrs rule applies but the point here is that thisis just a wonderfully quick and dirty way of experimenting especially ifyou’re quite evil and you want to get let the picsalignment perfect in something being able to just tweaked it ever soslightly here and then figure out the values are and then write down in theactual file on the server just wonderfully useful also too if you’re trying to figure outwhat font website uses i mean fighting the computed stop asthis can be a little overwhelming like my god there’s so many rules that applyto this element because of the cascading nature of c_s_ s let me just look at the computed styleswhich is a summary of the end result of all of these styles that have beenapplied enough i look for font-family indeed this is uh... appliances aerial followed bysensor so i know what font now google said just the debugging trick if you’venot used it this and the networks have one abusing quite a bit most likely so now back to our own version of googleunfortunately if i typed and harbored at google search doesn’t go anywhere sort of the kind ofdid where did it end up urals almost the same it’s a crazylooking you are opposite is obviously a file on my hard drive not on theinternet but what the change in the oro yeah good so the question mark unattended but nope rameters got sent so let me go ahead and take a look at myfile o well no predators were sent to them andgive any of the main so let me go back and fix this restrict the fought so wecan see more once and the need to input name equal skewhere and let me go back over here and reloadthe page and now we go ahead and take harbor andnow clickable search so now we have some progress so this is interesting now unfortunately google dot html is nota website nor is that dynamic it’s literally justa static files you can send any parameters you want it’s just you know inorg everytime but what is byproducts each year i’m kind of in a hurry to implement myown search engine uh... you know i read uh... knocked off my own new sites now would you mind search engine well i can actually do this form action should actually go to let’s saydot dot dot dot google dot com slash search and i’m gonna say math the equals andget in all our case here slight inconsistency with what we’ve seen before now let me go back to this page reload and now mimetype harbored and watch theoral as i could answer uh... now i have implemented my ownversion of gul but how right all i did was i constructed a form on a specified a method of deathsinaction that happens to be a point b elsewhere but because of its dpm because a browserknows how to handle foreign it compiled all of the key value pairs in this case just wantyou equal something put it in the oral consented to that action attribute sent it to that particular u rl so now we have implemented our own version approval now of course denies that they were our search resultsand they were completely cutting corners here but that’s where we’ll need somethinglike p_h_p_ to do things server-side let me pause for just a moment peter dowant to say hello to class peters one of our for teaching fellows the others areat work right now do on a lot too actual hole up i have to come near youwith a microphone value what you want to come this way so the cameras little more really available uh... although i a look forward toworking with all of you and i will see you on wednesday much any questions that about the wolf faqs pgp precaution that’s it had it not been named kit would this bebroken so let me go back into here and let’s just call a query thinking that’sa reasonable name to give a parameter to mini reload mates gml me take thatharvard answer and interesting they support we’re so let me misspellings and that’s probably not supported butmaybe let’s say family reload type harvard center okay that doesn’t work so there’s a bar cleary r_k_o_ forwhatever backwards compatibility agrees other questions yes and on the entirety apartmentscampus your sessions can be hijacked so if you have malicious roommates orare you aria this thurs four technical people around you you are vulnerable tothis issue hijacking can happen anywhere worker can is not use whether betweenyou and the access points the wireless access point we’re betweenyou and the endpoints uh... webserver and i should say especially those of youare from out of town realize that harbor does that fine print in rules about notdoing this to other people otherwise they’d that you can solve this problem byexpelling people that’s one way if you can’t do technologically so this is one of these things werereturned educators how it can be done but don’t go trying this in the dorms oncampus which he go home on your own homenetwork other questions so where does this leave so we startedby talking about global and we keep talking about who will be discussed sopopular but it above the story applies to really any website out there so we talked about the in az and theprocess of not only booking up a web page is your rayl rather mikey addressbut also getting your own ita dress and getting your own web server in your owndomain name we talked a little bit about html formswhich would which you might be tonight are ready to the tools with which youcan get a little more comfortable with diagnosing things in debugging thingsand we’ve written so that you know that’s a that’s a form all that we haven’t done yet is actuallyimplement the dynamic website for that we’ve completely outsourced to c_n_n_and global today one of the first things we will do thiscoming wednesday is diving deeper to p_h_p_ and things like depts imposedconcessions and shopping carts awesome the security implications aroundthem will dive in cbc is fifty appliance in this virtual machine environment withwhich you get to uh... play you in terms of apache inp_h_p_ and mysql so tonight will turn abid early allstick around with peter for anyone with questions you might happen otherwise wewill see you again on wednesday and after wednesday’s lecture will flow right intersection office hours if youhave questions about contents even though the first projectwill be released for a week or so sienna couple days