course reviemashiyat/csc309/lectures/course review.pdfquery parameter zipcode=97201 and replace the...
TRANSCRIPT
![Page 1: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/1.jpg)
Course ReviewA overview of what we learned this past 3 months.
![Page 2: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/2.jpg)
HTTP & URL
�
![Page 3: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/3.jpg)
“REST is just a set of conventions about how to use HTTP.Instead of having randomly named setter and getter URLs and using GET for all the getters and POST for all the setters, we try to have the URLs identify resources, and then use the HTTP actions GET, POST, PUT and DELETE to do stuff to them. So instead of
GET /get_article?id=1
POST /delete_article id=1
You would do
GET /articles/1/
DELETE /articles/1/”http://stackoverflow.com/questions/2191049/what-is-the-advantage-of-using-rest-instead-of-non-
rest-http
REST
![Page 4: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/4.jpg)
REST
Best Practices for designing REST API→ think about “resources”→ elements & collections→ map out the 4 methods for each→ Prefer Nouns, Plural, Concrete→ Use Parameters for more advanced queries
![Page 5: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/5.jpg)
Social Coding, GIT, branches
![Page 6: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/6.jpg)
HTML5: New Features
● Semantic elements and Markups● Audio and video support ● Canvas ● Drag and drop ● Local data storage ● Offline applications ● Server events ● Geolocation
![Page 7: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/7.jpg)
CSS
● HTML specifies document structure ● CSS specifies presentation
Advantage of CSS→ Precise control over presentation → Simplify site maintenance → Faster downloads → Media-specific rendering
![Page 8: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/8.jpg)
Asynchronous JavaScript and XML
Asynchronous JavaScript and XML (AJAX) is not a programming language, but a new way to use existing standards to exchanging data with a server, and updating parts of a web page - without reloading the whole page.
AJAX uses a combination of ● XMLHttpRequest object to exchange data
asynchronously with a server.● JavaScript/DOM to display/interact with the information.● XML as a format for transferring data.● CSS to style the data.
![Page 9: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/9.jpg)
AJAX How it works
![Page 10: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/10.jpg)
Ajax: JQuery write less, do more
Call a local script on the server /api/getWeather with the query parameter zipcode=97201 and replace the element #weather-temp's html with the returned text.
$.ajax({
url: "/api/getWeather",
data: {
zipcode: 97201
},
success: function( data ) {
$( "#weather-temp" ).html( "<strong>" + data + "</strong>
degrees" );
}
});
![Page 11: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/11.jpg)
JQuery write less, do more
<script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function() { $('#mo').click(function() { $('#mo').append('<p>Clicked!</p>'); }); });</script>
● Cross Browser.● Lots of helpers and utilities.● Very active community
![Page 12: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/12.jpg)
JQuery UI
jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library.
![Page 13: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/13.jpg)
JQuery Mobile
A Touch-Optimized Web Framework
jQuery Mobile is a HTML5-based user interface system designed to make responsive web sites and apps that are accessible on all smartphone, tablet and desktop devices.
![Page 14: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/14.jpg)
Responsive Web Design
Responsive Web design (RWD) is a Web design approach aimed at crafting sites to provide an optimal viewing experience.
![Page 15: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/15.jpg)
Frameworks
many more to choose from
![Page 16: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/16.jpg)
User Experience
![Page 17: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/17.jpg)
MVC vs. 3-tier
![Page 18: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/18.jpg)
Express.js
→
→
→
![Page 19: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/19.jpg)
CRUD Pattern
�Pattern for operating on db tables�
�
�
�
�
![Page 20: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/20.jpg)
MySQL with Node.js
Download and Install mySQL from,http://dev.mysql.com/downloads/
Start/stop/restart your MySQL server,sudo /usr/local/mysql/support-files/mysql.server start/stop/restart
Install mySQL Driver (connector module) for nodenpm install mysql or npm install felixge/node-mysql
![Page 21: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/21.jpg)
→
→ →
“NoSQL” = “Not Only SQL”
![Page 22: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/22.jpg)
Key-value stores.
Wide-column stores.
Document.
Graph stores.
NoSQL Database Types
![Page 23: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/23.jpg)
HTTP is Stateless
![Page 24: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/24.jpg)
Adding state to HTTP (1.0 and earlier)
There are various ways to add and maintain states on top of HTTP (not as an integral part):
Client mechanisms:◦ ◦ ◦ ◦
Server mechanisms:◦
![Page 25: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/25.jpg)
Cookies
Motivation:→→→
![Page 26: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/26.jpg)
Session - Persistent State
![Page 27: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/27.jpg)
Security threats
![Page 28: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/28.jpg)
Hashing
● Encrypt passwords, don’t store “in the clear” → Could decrypt (e.g. DES) to check, key storage? → Even better: “one-way encryption”, no way to decrypt → If file stolen, passwords not compromised → Use one-way hash function, h: preimage resistant → Ex: SHA-1 hashes stored in file, not plaintext passwd
![Page 29: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/29.jpg)
Dictionary Attacks
![Page 30: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/30.jpg)
HoneyPot,
Password Filtering,
Limit Login Attempts,
Aging Password, etc.
Security Measure
![Page 31: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/31.jpg)
Web Performance: Design
fi
![Page 32: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/32.jpg)
Design Techniques
fi
![Page 33: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/33.jpg)
HTML Resources
![Page 34: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/34.jpg)
CSS Techniques
![Page 35: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/35.jpg)
Network - Techniques
![Page 36: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/36.jpg)
Database - Techniques
fi
fi
![Page 37: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/37.jpg)
Cloud Service Models
Desktop as a service (DaaS), backend as a service (BaaS), and information technology management as a service (ITMaaS).
![Page 38: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/38.jpg)
Advantage and disadvantages
![Page 39: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/39.jpg)
Nodejs Good or Bad?
![Page 40: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/40.jpg)
https://www.destroyallsoftware.
com/talks/the-birth-and-death-of-
javascript
![Page 41: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/41.jpg)
The Power of Community
![Page 43: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/43.jpg)
What App you should build using Node.js
![Page 44: Course Reviemashiyat/csc309/Lectures/Course Review.pdfquery parameter zipcode=97201 and replace the element ... jQuery UI is a curated set of user interface interactions, effects,](https://reader034.vdocuments.mx/reader034/viewer/2022050114/5f4b8a59a40a2550712e9beb/html5/thumbnails/44.jpg)
Where you should not use Node.js