Language HIGH LEVEL Overview
27
Language HIGH LEVEL Overview More to come in future classes
description
Language HIGH LEVEL Overview. More to come in future classes. Languages. HTML CSS Javascript PHP / Ruby / Java / ASP / Perl. Client-server model. When searching on Google: Your PC’s browser requests a webpage from Google’s server Google’s server processes that request - PowerPoint PPT Presentation
Transcript of Language HIGH LEVEL Overview
Language HIGH LEVEL Overview
More to come in future classes
Languages
• HTML• CSS• Javascript• PHP / Ruby / Java / ASP / Perl
Client-server modelWhen searching on Google:
1. Your PC’s browser requests a webpage from Google’s server
2. Google’s server processes that request
3. Google’s server sends your browser anHTML file
4. Your PC’s browser renders what you seeas a webpage from that HTML
Simplest Reply: HTML Page
• Server simply sends you a single .html file• Only HTML, no other programming required• Said to be “static” – never changes• Cannot have any interaction• Cannot pull content from a database• Cannot read or save other files• Cannot log in or log out
HTML• HTML serves one purpose: layout content on a
webpage• Hyper Text Markup Language• Created by Tim Burners-Lee at CERN in 1991• Today universal, open standard supported on all
browsers: Internet Explorer, Firefox, Chrome, Opera, and more
• Also now called “XHTML” – basically the same
HTML - Example
HTML + CSS
• Problem: HTML was limited in how you could display things.
• Solution: Cascading Style Sheets
• Compliments HTML – more control over how things look, in bulk manner
• Introduced idea of “separating form from content”
• CSS can be embedded in HTML or be sent by the server as a second document
HTML + CSS - Example
JavaScript (JS)• Client side script – runs in your browser - NOT THE SERVER
• Server sends JS in HTML or as a separate file
• Makes the web page interactive– Mouseovers– Clocks– Alert boxes– Drag-and-drop
• Much more complicated than CSS or HTML – big leap
• Warnings– Older browsers can’t work with newer commands– Can be disabled by browsers (approx 1-3%)– Code is 100% viewable – people can steal
Server ArchitectureServers run programs, just like your PC:
• Operating System (OS)– Manages server’s hardware and other programs– Linux, Windows
• Web Server Software (HTTP)– Process’s client requests, sends response– Apache, LigHTTPD, IIS
• Database (DB)– Optional, used for large web apps– Stores tables of information – i.e. user info– MySQL, Postgres, Oracle, Microsoft SQL
• Scripting Language Processor– Depends on the language your site is coded in– The “processor” will read your script and execute it
Server-side Languages
• Scripting language generally determines architecture
• PHP, Ruby, ASP, Java, Perl
• Executes code on the server
• Saves files, logs users in/out, queries the database
• Totally invisible to client
• Sends client HTML once completed
Common Web App ArchitecturesArchitecture LAMP Ruby on Rails ASP.NET
OS Linux Linux Windows Server
Server Apache Apache IIS
DB MySQL MySQL Microsoft SQL
Server-side script PHP Ruby ASP
Framework (optional) Rails .NET
Layout HTML HTML HTML
Styling CSS CSS CSS
Client-side script JavaScript JavaScript JavaScript
PHP• “PHP Hypertext Processor” (recursive acronym)
• LAMP architecture– Linux for OS– Apache for webserver software– MySQL for database– PHP for programming
• Advantages: – Large developer base– All open source– Very scalable– Great documentation at PHP.net
• Disadvantages: – Slower development than Ruby or ASP
• Sites that use PHP in parts or all of their site:– Facebook.com– Wikipedia.com– Wordpress.com
PHP Example<html> <head> <title>PHP Test</title> </head> <body> 1+1 = <?php echo 1+1; ?> </body> </html>
Executed by web server
What the browser sees<html> <head> <title>PHP Test</title> </head> <body> 1+1 = 2</body> </html>
Executed by web server
Ruby (on Rails)• Ruby is the language
• Almost always used with Rails – the framework
• Advantages: – Developed specifically for modern web apps– Fastest to develop on– Tight integration between server, DB, front and back ends– Easy to make API’s
• Disadvantages: – Poor scalability (so far)
• Samples of sites using Ruby:– Twitter.com – fail whale– Basecamp.com – 37 signals maintains Rails
ASP• “Active Server Pages” - Microsoft’s web programming language
• Primarily for use if you want to go Microsoft across the board– Windows for OS– IIS for web server– Microsoft SQL server for DB
• Advantages: – Comes with a workflow & website framework– “Enterprise” - geared towards large companies – Microsoft provides customer service
• Disadvantages: – Proprietary– Expensive– Not as popular as PHP or Ruby
• Samples of sites using ASP:– Microsoft.com
Other Languages Java• By Sun/Oracle• Fallen out of popularity for web apps
Python / Django• Google has historically used Django• Runs quickly on the server
Perl• Early Language• Not designed for web, slow development
AJAX• “Asynchronous JavaScript and XML” – is a technique, not a language
• How it works– Javascript sends requests to server– Server-side script (PHP) processes request– Server sends back XML– Browser updates the webpage
• Samples of sites using AJAX:– http://maps.google.com– http://www.kayak.com
Maps.Google.com
Web HostingHosting Option Self-hosted Shared Hosting Dedicated /Co-lo Cloud Hosting
Where You own your box and connect it to the internet in your garage
Your site is one of many on a machine at your webhost’s facility
You get your own private box at your webhost’s facility
Your site is abstracted across many boxes at your webhost
Hardware Access Total None Set-up None
Software Access Total Limited Total Total
Reliability Poor Good Good Good
Scalability None None OK Great
Security Poor Poor Great OK
My Preferred Configuration
Hosting: Dedicated Servers at LiquidWeb.com
OS: CentOS 5 (Linux)Server: Apache 2DB: MySQL 5SS-Script: PHP 5Framework: Proprietary
Benefits: Open source, low cost, stable, scalable, easydevelopment, large developer pool
Why is this important?
Dot Com 1.0 mistake: • I have a great website idea. • I’ll just pay some guy to make it. • Then I’ll make millions!
With Technical founders Without Technical Founders
Successful Web Companies
(quasi-technical)
Dot Com 1.0 Reality• You can’t tell a good contractor from a bad one
• Your contractor tells you all your terrible ideas are great just so you’ll hire him
• ½ of your billings go towards waste-of-time-phone calls
• You end up with a terrible site
• It’s programmed in Java and completely unmaintainable
• You don’t have the capacity to improve it or even fix bugs
• Your “amazing idea” will be copied by a better technical company in a week
• They’ll make millions and you just wasted $50,000
Web 2.0 Lessons
• Every founder needs a basic level of technical proficiency
• At least one founder needs to be technically advanced
• Ideas are worthless, the best execution wins
• Web companies need to be technically driven
• Products need to be constantly iterated and improved
Learn More
• W3Schools.com• Go to any webpage, right click, “View Source”
