728x90

정규표현식은 복잡한 조건 비교문 없이
패턴 단위로 문자열을 검증할 수 있어서 무척 유용하...지만...-_-;;
자주 사용하지 않으면 할 때마다 헷갈린다는 단점이 있다.

자바스크립트만 이용해서 사용자 입력값을 검증하는 것은
무조건 문제가 생길 수 있기 때문에 서버측 검증을 꼭 해야만 한다.
물론 서버측에서는 여러가지 다른 수단 (가령, 스토어드 프로시저 파라메터의 데이터 타입) 이 있기 때문에
자바스크립트에서 정규표현식 검증을 하고
서버단에서는 별도 Validation 을 하는 것도 좋은 방법이다

각설하고,

사용자 계정 생성시 자주 사용하게 되는 룰이 영문, 숫자만 허용하는 것인데
이를 자바스크립트 정규표현식을 사용하면 무척 간단하게 표현이 가능하다

var regType1 = /^[A-Za-z0-9]+$/;
혹은
var regType1 = /^[A-Za-z0-9]*$/;

 
영어는 대문자 소문자가 있기 때문에 두가지를 모두 식에 표현해 주어야 한다

var regType1 =/^[A-Za-z0-9]+$/;

혹은
var regType1 = /^[A-Za-z0-9]*$/; 

숫자도 0-9 라는 조건을 통해 필터링 할 수 있다

var regType1 = /^[A-Za-z0-9]+$/; 
혹은
var regType1 = /^[A-Za-z0-9]*$/; 

+ 는 대/소 영문자, 숫자가 한번 이상 나온다는 의미이며 
꺽쇠 바깥쪽의 별표(아스타리스크,*)는 꺽쇠 안의 조건이 0번 이상 반복된다는 의미이다
+와 *는 미묘하게 차이가 있지만 위의 목적으로는 어느것을 사용해도 무방하다

만약, 문자열 길이를 제한하고 싶으면 어떻게 하면 될까?
그 때는 브레이스({,})로 문자열 갯수를 지정해 주면 된다.

var regType1 = /^[A-Za-z0-9]{4,12}$/; 

위와 같은 식을 이용하면 4자 이상, 12자 이하의 문자열 필터링이 가능하다.
완성된 코드는 아래와 같다.

var regType1 = /^[A-Za-z0-9+]*$/;
if (regType1.test(document.getElementById('userid').value)) { alert('아이디가 조건에 맞지 않습니다'); }

참고로 정규표현식 관련된 책들중 얇고 부담 없지만 탄탄한 책은
한빛미디어에서 출간된 "처음 시작하는 정규표현식 Regular Expression" 을 추천한다 

[자세히보기]


- NoPD -

 

쿠팡 파트너스 활동을 통해 소정의 수수료를 지급받을 수 있습니다

 

728x90
728x90
Node.js 를 공부하고 코드를 테스트 하는 방법은 여러가지가 있습니다. Cloud9 과 같은 웹 기반의 IDE 를 이용하는 방법이 가장 간편하고 사용자 환경도 타지 않기 때문에 좋지만 웹 기반이다 보니 은근히 불편한 점들이 있는 것도 사실입니다. 이 때 우리가 선택할 수 있는 좋은 대안은 Node.js 를 PaaS 형태로 제공하는 호스팅 서비스를 이용하는 것입니다. 그중에서도 오늘은 Node.js 를 비롯하여 Ruby, Java, Python 등을 PaaS 형태로 제공하는 Heroku 를 이용하기 위한 준비를 해보겠습니다. (간만에 글 올리면서 마치 준비된냥 Heroku 를 건드립니다 ;;;)

먼저 Heroku 를 사용하기 위해서는 간단한 가입 절차를 거쳐야 합니다. 이런 류의 외국 서비스들이 그러하듯 간단한 이메일 인증만을 하면 무료로 사용할 수 있는 공간을 할당받게 됩니다. Heroku 는 기본적으로 무료 서비스이고 추가적으로 용량을 늘리거나 다른 서비스를 이용할 때 추가적으로 비용을 내면 됩니다. 참고로 Cafe24 가 제공하고 있는 Node.js 호스팅 서비스의 최소 단위는 월 500원 입니다 ;;;



 Heroku 에 가입하기 위해서 가입 페이지로 이동합니다. (바로가기 : https://api.heroku.com/signup) 간단한 이메일 입력만으로 가입은 끝납니다. 참 쉽죠잉? 이메일을 입력하고 Sign Up 버튼을 누르면 입력한 이메일로 컨펌 URL 이 발송됩니다. 이메일도 빨리 도착하기 때문에 수신함에서 메일을 찾아 본문의 컨펌 URL 을 클릭하면 됩니다.


이메일에 대한 유효성 점검이 끝났다고 모두 끝은 아니겠지요? 비밀번호 정도는 셋팅 해줘야 나중에 로그인을 할 수 있을 겁니다. 설마 정말로 이메일만 입력했다고 모든게 끝이라고 생각했다면 여러분은 바보 입니다 -_-;; (퍽퍽...) 실제로 개발을 하고 소스 버전 관리를 하고 커밋 하는 등의 행위를 위해서 커맨드 라인 도구를 제공하는데 이 때도 필요한게 바로 이 비밀번호이니 잘 기억해 두시기 바랍니다.

 
비밀번호까지 입력하고나면 간단한 Get Started 방법에 대한 가이드가 화면에 출력됩니다. 로컬에서 개발하고 Heroku 로 소스코드를 업데이트 하고 구동시키기 위해서 몇 가지 도구가 필요한데요, Git 과 SSH 도구를 잘 엮어둔 Heroku Toolbelt 라는 패키지를 제공하고 있습니다. 사용자 환경이 윈도우냐 맥이냐, 아니면 리눅스냐에 따라 패키지가 여러가지로 제공되니 각자 필요한 패키지를 다운로드 받아 설치하면 되겠습니다. Heroku Client 와 Git, SSH 등이 설치된다는 것 기억하시구요.

 
잠시동안 지루한 설치 작업이 진행되고나면 끝납니다. 그리고 아무것도 보이지 않습니다. 뭘 해야 할까요? 윈도우 기준으로 설명을 드리면 설치가 끝나고 나면 윈도우 커맨드라인 도구 (시작 > cmd) 를 실행해서 Heroku 라는 커맨드를 통해 명령행 도구를 실행하셔야 합니다. 그냥 Heroku 라고 한번 쳐보시고... " 아 그렇구나 " 하신다음 위의 스샷처럼 heroku login 명령을 내려주시기 바랍니다. heroku login 명령을 입력하면 조금전에 가입시 썼던 이메일과 비밀번호를 입력합니다.


Git 에 엑세스 하기 위해서는 SSH Key 를 만들어야 합니다. 로컬에서 접근하기 위해서도 필요하고 Heroku 가 Git 에 접근하기 위한 권한 부여를 위해서도 필요합니다. heroku login 을 처음 하게 되면 이런 과정을 한큐에 다 정리를 해줍니다. SSH Key 를 생성해서 로컬에 저장해 주고 (윈도우의 경우 기본 사용자 프로파일 경로에 /.ssh/ 폴더 밑에 생성) Heroku 에 업로드까지 깔끔하게 마무리 해줍니다. Key 가 잘 등록되었는지 확인하기 위해서는 heroku keys 라고 입력해 보면 됩니다. 키를 지우려면 heroku remove 하면 되고 키 추가를 위해서는 heroku keys:add 하시면 됩니다.

자 여기까지가 Heroku 사용을 위한 환경 셋팅입니다. Heroku Toolbelt 가 제공되기 전까지는 별도로 Git 도구를 설치하고 키 생성을 하는 등 번거로운 작업이 많았지만 이제는 참 많이 편해졌다고 다들 그러시더군요 -_-... 그럼 샘플 코드 올려서 구동해보는 건 다음시간에... 해보시지요.

- NoPD -

 
728x90
728x90
XE는 사용자가 꽤 많은 CMS (Content Management System) 임에도 불구하고 열악한 기술지원과 매뉴얼 때문에 커스터마이징을 필요로 하는 사람들에게 참 많은 숙제를 안겨주고 있다. 제로보드 시절만 해도 그렇지 않았는데 네이버가 인수한 이후에는 뭔가 부드럽지 않은 분위기다.

오늘 올리는 내용은 사실 포스팅으로 남겨 두기도 참 뻘쭘한 내용이다. XE 개발자 매뉴얼에 제대로 기술이 되어 있지 않아 삽질한 내용이기 때문이다. MySql 에서 쿼리 크기를 제한할 때는 쿼리 뒷부분에 limit [숫자] 형태로 쿼리 갯수를 제한할 수 있다. MS-SQL 에서 select 문 바로 뒤에 top [숫자] 를 적어주는 것과 동일한 효과다.

select * 
  from xe_documents 
 where module_srl=3038
   and voted_count > 5
 limit 5


특정한 게시판 모듈에서 추천수가 5 이상인 게시물을 가져오되 5개를 넘지 않도록 만든 아주 간단한 쿼리다. 이 쿼리를 XE 가 사용하는 XML 형태로 변경하면 어떻게 될까? 구현하는 사람에 따라 차이가 있겠지만 아래와 같은 XML 로 만들어질 것 같다. 


	
        
		
	
		
		
		
	
	
		
	
	


삽질을 했던 이유는 바로 마지막의 <list_count> 부분이다. 개발자 매뉴얼 그 어디에도 <list_count> 엘레멘트가 <navigation> 엘레멘트의 하위 엘레멘트라는 표기가 없다. 물론 <navigation> 엘레멘트 설명에는 "정렬 순서나 페이징을 지원" 이라고 되어 있지만 그 설명을 "따라서 <list_count> 는 <navigation> 의 자식입니다"로 해석할 수 있는 사람은 몇 안될것 같다. 누군가 동일한 삽질을 할까봐 포스팅으로 남겨둔다.

- NoPD - 
728x90
728x90
새로운 언어나 개발환경에 익숙해 지는데에는 간단한 실습만한 것이 없다. Hello World 를 출력하는 프로그램이 모든 언어의 첫번째 예제가 되는 것은 다 이유가 있다. Hello World 를 출력하는 프로그램을 통해 언어가 가지고 있는 기본적인 코드 구성 방법을 이해할 수 있고 표준 입출력을 이용하여 결과값을 출력해 볼 수 있기 때문이다. 

node.js 역시 마찬가지 방법으로 접근을 해보고자 한다. 다만 javascript 에 익숙치 않은 사람들을 위하여 점진적으로 코드를 완성해 나가는 방식을 이용해 앞으로 설명을 하고자 한다. NoPD 역시 OOP 기반의 언어들에 익숙한 상태라 처음 javascript 에 익숙해 지는데 시간이 무척 오래 걸렸다. javascript 가 궁극의 개발 언어라고 주장하는 사람들은 이런 javascript 의 코드 개발 방식을 들기도 하니 유심히 살펴볼 필요도 있을 것 같다


자바스크립트로 서버를 만든다고?

node.js 는 서버 혹은 클라이언트에서 사용될 수 있는 스크립트임을 앞선 포스팅에서 이야기 했다. 클라이언트야 그렇다 치고 서버에서는 도대체 무슨 역할을 할 수 있는 것일까? node.js 는 로직을 가지고 있는 javascript 로서의 역할도 충분히 하겠지만 그 보다는 웹 서버, 소켓 서버 등의 역할로 사용되는 경우가 더 많다. 서버에 설치된 웹 서버 (예> IIS, Apache) 의 유무와 상관없이 독립적으로 동작이 가능하다.

웹 서버라는 것이 결국은 특정한 포트 (예> 80) 를 통해 TCP 통신을 받아들일 수 있도록 해주는 역할이라고 해석한다면 소켓 서버를 특정한 포트로 만드는 것과 별반 다른 것이 아니라는 점을 이해할 수 있을 것이다. 이제 간단한 웹 서버를 만드는 코드를 통해 node.js 의 구조를 이해하고 얼마나 생산성 높은 개발 환경인지를 알아보도록 하자.

var http = require('http');

먼저 위와 같이 코드를 입력해 보자. var 는 자바스크립트에서 변수를 선언할 때 사용되는 키워드이다. http 라는 변수를 선언하고 이 변수에는 require('http') 라는 문장을 통해 node.js 의 http 모듈의 객체 인스턴스를 생성하도록 했다. node.js 은 다양한 모듈을 가지고 있는데 모듈을 사용하기 위해서는 위와 같은 코드를 이용한다. 다른 언어에서 include 나 using, import 와 같은 역할을 한다고 보면 된다.

코드의 구조를 잡아보기

객체 인스턴스를 생성했으면 이제 이 인스턴스가 제공하는 다양한 메소드를 이용하기만 하면 된다. node.js 의 서버 모듈이 제공하는 다양한 메서드와 이벤트는 공식 웹사이트의 도움말을 참고하면 좋다 (바로가기 :  http://nodejs.org/api/http.html) 우리는 일단 간단한 웹 서버를 만들어 볼 예정이니 문서가 제공하는 방대한 내용을 다 이해할 필요는 없다. 이제 코드에 살을 좀 붙여보자.

var http = require('http');

http.createServer(function (request, response) {

});

생성한 http 인스턴스가 제공하는 createServer 메소드를 호출하는 코드이다. createServer 메소드는 파라메터로 requestListener 를 받는다고 공식 문서에 정의되어 있다. requestListener 는 특별한 것은 아니고 공식 문서에도 기술되어 있는 것처럼 request 이벤트의 이벤트 핸들러 형태를 따르는 함수면 된다. 그런데 이 서버는 어떤 포트를 통해 요청을 받을 것인지가 명시 되어 있지 않다. http 객체가 제공하는 listen 메소드를 이용해 1234번 포트로 요청을 받는 서버를 만들어 보도록 하자.

var http = require('http');

http.createServer(function (request, response) { 

}).listen(1234);

참 간단하다. 이제 이 코드에 우리가 추가해야 할 것은 요청(request) 가 들어 왔을 때 무엇을 회신(response) 할 것이냐이다. 웹 서버라는 것이 별 것은 아니고 사용자의 요청이 들어왔을 때 적절한 회신을 해주는 것임을 생각해 보면 이해하기는 어렵지 않다. 회신할 내용을 만드는 코드를 넣고 서버가 동작중임을 알리는 콘솔 메세지를 추가해보자.

var http = require('http');

http.createServer(function (request, response) {
  response.writeHead(200, {'Content-Type': 'text/plain'});
  response.end('Hello World~!\n');
}).listen(1234);

console.log('Server running at http://127.0.0.1:1234/');
결과 확인해 보기! 

어렵지 않게 웹 서버를 무사히 만들어 냈다. 물론 진짜 웹 서버에 비하자면 동적인 웹 페이지의 생성, 적절한 결과의 응답등이 빠져 있지만 이런 부분들은 앞으로 여러 포스팅을 통해 다양한 모듈을 활용하여 풀어나갈 수 있는 부분이니 여기선 구조를 이해하는 선이면 충분할 것 같다. 이제 node.js 에서 만든 코드를 실행해 보도록 하자.  

 
서버가 동작중임을 알려주는 메세지가 화면에 출력되어 있다. 기본적으로 createServer 는 별도로 종료하지 않는한 계속 구동되고 있게 된다. 서버를 종료하는 별도 로직을 추가하거나 (특정한 요청에 응답?) Ctrl-C 등을 눌러 프로세스를 종료 시키면 서버는 종료되게 된다. 물론 서버가 종료되면 안되는게... 기본 동작 요구사항일 것이므로 그냥 그렇다고만 알고 있자. 이제 웹 브라우저를 이용하여 웹 서버에 접근을 해보도록 하자.


놀랍지 않은가? 단 몇줄의 코드로 웹 서버를 구동시켜 보았다. 앞서 이야기 한 것처럼 보완할 부분이 많은 말 그대로 껍데기 밖에 없는 웹 서버이지만 node.js 의 원리를 이해하고 강력한 기능을 맛보기에는 충분한 예제였다. 앞으로 node.js 를 이용하여 재미있는 것들을 많이 만들어 나가도록 하자.


- NoPD -

 
728x90

+ Recent posts