여행과 일상

Tornado는 python으로 만들어 진 오픈소스 웹 관련 툴들로 구글의 webapp과 유사하다. 하지만 가장 큰 차이점은 non-blocking이고 빠르다는 것이다. epoll을 사용해서 non-blocking 서버를 구현하기 때문에 동시에 몇천개의 처리해 줄 수 있기 때문에 리얼타임 웹 서비스에 적합하다. * 설치 다운로드 경로 : https://pypi.python.org/pypi/tornado 압축해제 후 해당 경로에서 빌드 및 설치python setup.py buildpython setup.py install 설치가 끝나고 나면 설치되었는가 확인도 할 겸 프로그래밍을 배울 때 가장 처음에해보게되는 Hello World 를 출력해 보겠다. import tornado.httpserver impor..

1. 제어 - 선택 .add() : 요소를 추가 선택한다. / $("p").add("div") // p 요소와 div 요소를 선택한다. .not() : 선택된 확장집합에서 인자에 해당하는 요소를 제거한다. / $("p").not(".green") // p 요소의 확장집합에서 class가 green인 요소를 제거한다. .children() : 요소의 고유한 자식으로 구성된 확장 집합을 반환한다. .contents() : 선택한 요소의 자식 요소를 가져온다.(text node 포함) $('.container').contents().filter(function(){}); // class container 요소의 자식요소(text 포함)를 가져와 filter 한다. iframe text를 가져올때 사용 .fir..

2. 속성(CSS), 추출- 속성(CSS) .addClass() : 지정한 요소에 class 값을 추가한다. $("p").addClass("name"); // class = "name" 추가.hasClass() : 지정한 요소에 class 유무를 확인한다. if($("p").hasClass("name")==true) // class 가 "name"인지 확인 true/false.removeClass() : 지정한 요소에 class 값을 제거한다. $("p").removeClass("name"); // class = "name"을 제거.toggleClass() : 지정한 요소에 class를 추가/제거 $("p").toggleClass("name"); // class = "name"이 있으면 제거 / 없으면 ..

3. 검증.is() : 현재 상태를 확인하여 반환한다. true / false var chk = $("div").is(":animated"); // chk 는 true, false $.contains() : 첫번째 인자 요소에 두번째 인자 요소를 가지고 있는지 확인한다. $.contains($("#name"), $("#code")) // #name 요소 아래에 #code 요소가 있다면 true $.isArray() : 인자가 배열인지 확인한다. $.isArray(arr) // arr이 Array 인지 체크 true / false $.isEmptyObject() : 인자가 empty 인지 체크한다. $.isEmptyObject(arr) // arr 이 empty 인지 체크 empty : true / fal..

4. 효과.animate() : 해당 객체의 CSS 변화 효과를 준다. /$('p').animate({CSS Map}, {options}); / $('p).animate({color:'white', font-size : 22px}, {duration : 400, easing : 'ease-in', complete : function(){....}}); {queue:false} .delay() : 해당 시간만큼 실행을 delay 시킨다. / $("div").slideDown().delay(5000).slideUp(); // id div 요소를 슬라이드 다운 후 5초 후 슬라이드 업 한다. .stop() : 실행중인 애니메이션을 중지한다. $("div").stop(); // div의 큐의 애니메이션을 멈춘다..

Event - event 제어 .bind() : event가 발생하면 실행될 함수를 지정한다. (이미 생성된 DOM에 대하여) / $("#image").bind("mousedown", function(){ // id image 요소에 마우스를 클릭했을 때, 해당 함수 실행 지정 });.unbind() : bind()를 해제한다. .live() : 동적으로 생성된 DOM 객체들의 이벤트를 연결한다. (이벤트 버블 발생 가능) / $("#image").live("click", function(){ // id image 요소에 마우스를 클릭했을 때, 해당 함수 실행 지정 });.die() : live() 제거 .delegate() : 동적으로 생성된 DOM 객체들의 이벤트를 연결한다. (이벤트 버블 방지) /..

ajax함수 ajax함수는 다음과 같은 표현식으로 구현이 되며, options에 들어갈 속성을 아래에 정리해 놓았습니다. 더 자세한 사항은 넥스트리 블로그에 게시된 김재훈 님의 Ajax를 품은 jQuery를 참조하시면 됩니다.1 $.ajax(options);url : 통신을 원하고자 하는 URL주소를 입력합니다.(필수 입력 값)data : 서버로 보낼 데이터를 입력합니다.type : GET, POST등의 통신 방식 지정합니다.dataType : 통신의 결과로 넘어올 데이터의 종류를 지정합니다.success(data) : 통신 성공시 호출 해야하는 함수를 지정합니다. 매개변수로 결과로 넘어온 데이터를 받습니다.error : 통신 실패시 호출 해야하는 함수를 지정합니다.complete : 통신 성공 여부와 ..

속성 선택자 - [name] : name 속성이 있는 요소를 선택 - [name = "value"][name2 = "value2"] : name 속성의 값이 value이고 name2 속성의 값이 value2 인 요소를 선택 - [name = "value"] : name 속성의 값이 value인 요소를 선택한다. - [name != "value"] : name 속성의 값이 value가 아닌 요소를 선택한다. - [name ^= "value"] : name 속성의 값이 value로 시작하는 요소를 선택한다. - [name |= "value"] : name 속성의 값이 value 이거나 value로 시작하는 요소를 선택한다. - [name *= "value"] : name 속성의 값에 value가 들어 있는 ..

모든 공백 체크 정규식var regExp = /\s/g; 숫자만 체크 정규식var regExp = /^[0-9]+$/; 이메일 체크 정규식var regExp = /^[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,3}$/i; 핸드폰번호 정규식var regExp = /^\d{3}-\d{3,4}-\d{4}$/; 일반 전화번호 정규식var regExp = /^\d{2,3}-\d{3,4}-\d{4}$/; 아이디나 비밀번호 정규식 var regExp = /^[a-z0-9_]{4,20}$/; 휴대폰번호 체크 정규식 var regExp = /^01([0|1|6|7|8|9]?)-?([0-9]{3,4})-?([0-9]{4})$/;..

모바일 웹 그냥 웹인데 모바일 화면에 맞게 구성한 웹당연히 pc로도 볼 수 있으나 pc는 고려 안했으므로 ▲ 이런식으로 나옴 http://m.naver.com/등등.. m 으로 시작하는 웹사이트들을 모바일웹이라고 합니다 웹앱 웹앱에 대한 설명들을 찾아보면 모바일웹과 네이티브앱의 장점을 합친거란 말이 있는데설명이 너무 애매해서 무슨 말인지 알 수 없죠 '한약파르풰 같은 맛이다'이러면 누가 알아볼까요 그래서 직접 봅시다 http://app.chosunbiz.com/plugins/apps/www/i.html?server_no=2&c=0 조선비즈 웹앱입니다 마치 진짜 앱 같죠. 하지만 결국 웹입니다.다시말해 모바일웹하고 근본적인 차이는 없지만 겉모습과 구동방식을마치 앱인것처럼 착각하도록 꾸며놓은 것을 웹앱이라고..