CS490 Web Design, AJAX, JQuery Web Services AJAX Bootstrap Best practices Mobile Websites HTML CSS JavaScript Jquery Common Tools

Agenda What is this class? Who am I? Syllabus Expectations Required software Know-How Check CS Department Resources How to hand in homework How does a website work? HTML

What is this class? Topics Covered - Web Design, AJAX, Jquery Special Topic - This is the first time this class is being taught so we will be playing it a little by ear. Lecture & Lab – Participation is encouraged

Who am I? 9 years developing web applications professionally Senior Software Engineer for Lockheed Martin specializing in web applications Graduated from SUNYIT with my B.S. and M.S. in Computer Science

Syllabus The syllabus will be passed out but it is also posted on the class website: http://web.cs.sunyit.edu/~lampej/web/

Office Hours / Open Door Policy Office Hours – Monday 5:00-6:00pm Email me anytime. I usually respond within 24 hours. Remember to be reasonably professional and to only ask questions after you have put in significant effort on your own. Appointments If you cannot meet me during office hours, before/after class and your question cannot be answered via email, you may schedule an evening or weekend appointment with me. Please only request an appointment if it's truly necessary.

Expectations Balance a casual atmosphere with professional behavior - Have fun but remember college is practice for your future career. Be responsible for your own education - Don't play the blame game or make excuses. Respect your classmates Participate in class - Some people learn best by listening, some learn best by reading, and some learn best by doing. Why not do all 3? Try before you ask Have a positive, can-do attitude. Be a problem solver. Work hard Communicate

Required Software OS Independent – Windows, UNIX, Mac are all fine Browsers – install ALL 3 Internet Explorer * Firefox Chrome Putty or other SSH client Text Editor of your choice Image Editor of your choice. Recommended: GIMP More may be added to this list as we go

Know-How Check 1) Is anyone new to the school and/or CS department? 2) Is anyone new to UNIX? Does anyone need a refresher on UNIX? 3) Has anyone never used vi or vim? 4) Has anyone never used source control?

CS Department Resources Web Server Create your website on the CS department web server. Instructions: http://web.cs.sunyit.edu/~username/ SSH and SCP (Secure Shell and Secure Copy) Connect to the UNIX server fang or buck to upload and/or edit files on your website.

Be a Problem Solver If your internet goes out or is super slow A lot of what we will be doing in this class can be done offline. If you run into problems with your network connection, do most of the work offline and then do the rest later. If your computer breaks Everything we will be doing in this class can be done from just about any computer with no setup. Keep a copy of your work somewhere accessible. Source & Version Control gives you a backup of your files and lets you keep track of your changes. Learn to use it. Git is a free, easy to use option that is available on the CS servers.

Things You Need to Know File editing from Unix/Linux Vim, Pico, or Nano Basic UNIX commands http://web.cs.sunyit.edu/~lampej/UnixCommandSummary.pdf Programming Constructs You will be working with multiple markup languages and scripting languages. You need to be comfortable with programming. Data Structures and Object Oriented Programming Arrays, hash tables, objects, basic algorithms, pointers, functions Theory The key to learning new languages quickly is truly understanding the theory behind programming.

How to hand in homework You do not need to tell me when your homework is done. Follow these instructions and I will receive it. Create the following directory structure ~ (CS home directory) www Cs490web hw# (1 through 10) index.html style.css script.js done.txt (see next slide) You may password protect your cs490web folder if you like. Send me the username and password by email. Instructions here: http://www.cs.sunyit.edu/help/htaccess.php

How to hand in homework Each homework directory will contain the following files: index.html style.css script.js done.txt You can have additional files but they must somehow be linked to one of these 3. For example, you can add an additional CSS include to your HTML file that uses another CSS file, but the style.css file must be the primary. Your homework is not handed in until this file exists. It can be empty, or it can include a message to me about your homework. DO NOT create this file until your homework is ready to be graded.

How a website works Web Server Process Server-Side Request 2) Request for file http://www.sunyit.edu 1) HTTP Request Requesting Static Content? * Yes, return static content * No Static Content * Process Server-Side Request PHP, Java, .NET, etc. * Static Content includes text, JSON, XML, HTML, CSS, JavaScript, images, and anything else that is returned to the browser.