2014년 9월 25일 목요일

JavaScript와 jQuery, HTML5


  • Why used Java Script or JQuery?

- 성능이 좋아서?
- 표준화가 되어있기 때문에
- 다양한 plug-in이 상용화되면서 UI관리 용이(Bootstrap, YUI, extJS)

※ Twitter Bootstrap : http://getbootstrap.com/
YUI : http://yuilibrary.com/
Sencha : http://www.sencha.com/products/extjs/ (유료)

Full Frame : 필름 사이즈가 full-frame이다...


  • JQuery Mobile

- 모바일 폼에서 UserInterface를 만들기 쉽게 

  • HTML5, CSS3

- JavaScript와 HTML5는 대비되는 코드인가?
   : 그렇지는 않지만 실질적으로 HTML5로 구현되는 코드를 JS로 구현하는 것도 가능하다.

  1. Add element in HTML5

semantic elements : <header>, <footer>, <article>, <section>.
form controls : number, date, time, calendar, range.
graphic elements : <svg> ,<canvas>.
multimedia elements : <audio>, <video>.

  1. Add Storage in HTML5
쿠키말고도 저장이 가능하다니!

- 캔버스(Canvas)의 이해
- SVG(Scalabale Vector Graphic) : ※참조
- Geolocation : 위치정보서비스
- Drag and Drop

- Local Storage : 쿠키 이외의 정보를 브라우저에 저장

=================================================================
(생략)
...
// Check browser support
if (typeof(Storage) != "undefined") {
    // Store
    localStorage.setItem("lastname", "Smith");
    // Retrieve
    document.getElementById("result").innerHTML = localStorage.getItem("lastname");
} else {
    document.getElementById("result").innerHTML = "Sorry, your browser does not support Web Storage...";
}
...
=================================================================

- WEB Socket :

※ Bitmap vs Vector = (image make dot, low quality/low resource) vs  (image make line(x, y), high quality/high resource)

댓글 없음:

댓글 쓰기