CS490 Web Design, AJAX, CS490 Web Design, AJAX, JQueryJQuery

HTML

CSS

JavaScript

Jquery

Common Tools

Web Services

AJAX

Bootstrap

Best practices

Mobile Websites

AgendaAgenda

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?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?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

SyllabusSyllabusThe 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 PolicyOffice Hours / Open Door PolicyOffice 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.

AppointmentsIf 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.

ExpectationsExpectationsBalance 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 SoftwareRequired Software

OS Independent – Windows, UNIX, Mac are all fine

Browsers – install ALL 3Internet Explorer *FirefoxChrome

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 CheckKnow-How Check1) 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 ResourcesCS Department Resources

Web ServerCreate 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 SolverBe a Problem Solver

If your internet goes out or is super slowA 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 breaksEverything 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 KnowThings You Need to KnowFile editing from Unix/LinuxVim, Pico, or Nano

Basic UNIX commandshttp://web.cs.sunyit.edu/~lampej/UnixCommandSummary.pdf

Programming ConstructsYou will be working with multiple markup languages and scripting languages. You need to be comfortable with programming.

Data Structures and Object Oriented ProgrammingArrays, hash tables, objects, basic algorithms, pointers, functions

TheoryThe key to learning new languages quickly is truly understanding the theory behind programming.

How to hand in homeworkHow to hand in homeworkYou 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.htmlstyle.cssscript.jsdone.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 homeworkHow to hand in homeworkEach homework directory will contain the following files:index.htmlstyle.cssscript.jsdone.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.

done.txtYour 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 worksHow a website works

WebServ

erhttp://www.sunyit.edu

1) HTTP Request

2) Request for file

RequestingStatic Content? *

Yes, return static content *

No

Process Server-Side RequestPHP, Java, .NET, etc.

Static Content *

* Static Content includes text, JSON, XML, HTML, CSS, JavaScript, images, and anything else that is returned to the browser.