Web Programming Step by Step

Lecture 24b
What's Next?

Reading: Ch. 13

Except where otherwise noted, the contents of this presentation are Copyright 2010 Marty Stepp, Jessica Miller, and Alex Loddengaard.

Sharing your work with others

• show off your awesome programs to your friends!
• put your web dev skillz (and links to your programs) on your resume!
• set up your Dante web space
• your UW web site will be at http://students.washington.edu/YOUR_UWNETID
• put this line at the top of your PHP code:

  <?php
  error_reporting(E_ALL);   # makes dante show error messages
  ...
  

Protecting web resources

• please don't post your HW solutions on the web unprotected!
  (we want to be able to assign some of these programs again)
• posting resources with a shared password:
  • create files named .htaccess and .htpasswd with proper contents and put them in your HW root folder on Dante
  • doesn't require a UW NetID
  • can give password to friends / family / employers

Example htaccess, htpasswd files

.htaccess :

AuthUserFile .htpasswd
AuthGroupFile /dev/null
AuthName EnterPassword
AuthType Basic
require user USERNAME

.htpasswd :

USERNAME:ENCRYPTEDPASSWORD

• place these files in the top folder of the content you want to protect
• htpasswd generator (gives you the text to copy-paste into your .htpasswd file)

Getting Ajax to work

• Ajax (XMLHttpRequest, Ajax.Request) can only connect to the same server as where your .html and .js files are located
• If you put your work up on Dante, your Ajax code will be unable to reach Webster!
• Solution: Put proxy.php in the same folder as your Dante code, and change any Ajax URLs
  • from: http://webster.cs.washington.edu/dir/file.ext
  • to: proxy.php?url=http://webster.cs.washington.edu/dir/file.ext
  • if URL has parameters, encode the query string with JS escape function

MySQL on dante

• How to use MySQL on Dante
  • or, if that doesn't work, install it yourself
• download our databases: simpsons.sql, world.sql, imdb_small.sql, imdb.sql
• importing a database into MySQL from a file:
  • upload one of the above .sql files to your Dante space
  • open an SSH terminal window on Dante and type:

  mysql -u username -p databaseName < filename.sql
  

• exporting a database from MySQL to a .sql file:

  mysqldump -u username -p databaseName > filename.sql
  

Setting up your own web server

• why?
  • test your web apps locally without needing to upload them to Dante
  • host your own projects from your house and connect to them
  • other useful services: SSH, VNC, SMB (Samba), CVS, ...
• how?
  • Linux: Ubuntu (LAMP) server tutorial
  • Windows: Apache (WAMP) tutorial; IIS tutorial

Revisiting past homework assignments

• extensions to the assignments from this course:
  • HW1,2: Pick other web sites and try to mimic them
  • HW4: implement persistent dating data, uploading of images, a login system
  • HW5: rewrite the gallery.js functionality yourself using Ajax
  • HW6: use Scriptaculous to add effects and animate the movement of the tiles
  • HW7: write the PHP that reads names.txt and feeds XML to client
  • HW8: implement the real 6 degrees of Kevin Bacon as seen at oracleofbacon
• make your assignments compatible w/ IE6, Opera, Safari, etc.
• complete the extra features you didn't have time for during the quarter
• go back and look at the Ruby/Flash lecture notes; try some of the programs

Further Learning

• Yahoo! web developer videos
• more Javascript
  • learn to write classes/objects in Javascript (tutorial #1, #2)
  • learn other JS libraries such as Google Ajax Search API (slides), Yahoo! UI, or jQuery
• topics we didn't have time to cover:
  • Web design and usability
  • Going "live", making a real web site with your own domain name
  • Embedding multimedia content (old HW assignment) (resources)
  • Macromedia Flash: tutorial 1, tutorial 2, tutorial 3
• server-side web programming in Java
  • JSP / servlets (#1, #2)
  • applets (#1, #2)

Taking a web site "live"

• buy your own domain name (e.g. martystepp.com): DreamHost
• learn about (stalk) your users with Google Analytics
  
• improve your page / improve PageRank: SEO, meta tags
• make a few bucks with ads: Google AdSense
• get the word out: Google AdWords, Webmaster Tools
  

Courses you can/should take

• CSE 143 - learn more about structuring data and algorithms (if you haven't taken it yet!)
• CSE 403 - software engineering (large software projects)
• CSE 490H - distributed systems
• CSE 498/499 - senior capstones and project courses
• INFO 343/344 - web design, web tools/development
• ENTRE 475/476 - business aspects of web development