일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- 750R
- 웹디자인
- 제이쿼리
- 오픈소스
- 개발환경
- node.js
- non-blocking
- npm
- JQuery
- 자바스크립트
- MongoDB
- 마이크로소프트
- Javascript
- Python
- CoffeeScript
- callback function
- 크로스브라우징
- git
- Microsoft
- Ajax
- 마소
- 콜백 함수
- 인턴
- NoSQL
- 빅데이터
- 테스트
- github
- AngularJS
- CSS
- Today
- Total
목록분류 전체보기 (50)
Inspired World
Node.js를 production server에서 운영할때는 NODE_ENV 를 production으로 설정한 후 쉘에서 주로 forever start app.js 명령을 이용해서 node.js 어플리케이션이 예기치 못한 오류로 꺼지거나 하는 경우를 방지 할 수 있는데요. 주의! 먼저 쉘에서 npm install forever -g 로 forever 가 설치 되어 있어야 합니다 개발 과정에서는 forever 보다 node app.js 이렇게 그냥 실행하게 되면 소스를 수정할 때 마다 ctrl + c node app.js 를 반복해줘야 하는 귀찮은 일이 발생합니다. 하지만 소스가 변경될 때마다 알아서 저 ctrl + c node app.js 작업을 해주는 프로그램이 있습니다. 그 이름은 바로 Superv..
JavaScript에서 procedural programming과 object oriented programing을 모두 할 수 있습니다. 의외로 Object Oriented Programming ( 객체지향 프로그래밍 ), OOP 이 가능한지 모르시는 분들이 있어 이번 포스팅에서 소개하기로 했습니다. 먼저 객체 생성자 (Constructor)를 만들어볼까요? * 소멸자 (Destructor)는 따로 정의 안해도 됩니다. 기본적으로 JavaScript는 Garbage Collection을 하니까요. var Person = function ( info ) { this.height = info.height || '178cm'; this.weight = info.weight || '72kg'; this.nam..
Google App Engine(구글 앱엔진) 버전이 1.6.2로 업그레이드 되면서 Cloud SQL을 통해 Django를 제대로 지원하게 되었다는 소식을 얼마전에 알게 되었는데요. App Engine의 특성상 DB를 구글의 Big Table을 쓰기 때문에 인기 Python web framework인 Django의 Model (데이터베이스 ORM)을 다 뜯어 고쳐서 써야 했던 기존 App Engine 과 달리 구글의 Big Table을 Cloud SQL로 한번더 맵핑 해주기 때문에 Django의 Model을 그대로 쓸 수 있기 때문에 정말 Django 스러운 Web App을 이제는 App Engine 환경에서도 배포할 수 있게 되었습니다. 용량은 10GB 제한으로 좀 아쉽긴 하지만 작은 프로젝트라면 충분..
보통 Node.js 를 실행할 때 NODE_ENV 값을 이용해서 production ( 배포 ) 모드 development ( 개발 ) 모드 이렇게 두 가지로 나누어서 실행하게 되는데요. Node.js 프레임워크인 Express 의 경우 production 모드 일때는 파일 캐싱, 에러 메시지 감추기 등 배포의 적합한 환경 설정을 하구요. development 모드 일 때는 파일 캐싱 방지, 디버그를 위한 상세한 에러 메시지 보이기 등 개발에 도움을 줄 수 있는 환경으로 설정을 해줍니다. 하지만 직접 이 값을 알아 내고 싶을 때가 있는데요. 이럴 때는 Express 에서 전체 앱을 총괄하는 역할을 맡고 있는 root 디렉토리의 app.js 에서 첫 줄에 process.env.NODE_ENV = ( pro..
XSS (Cross-Site Scripting 크로스 사이트 스크립팅) 은 사용자가 입력할 수 있는 폼이나 URL의 파라미터 값을 통해 악의적인 코드를 삽입하여 쿠키를 갈취하거나 악성 코드를 실행하는 것을 말합니다. 기본적으로 이는 태그, 특히 스크립트 태그를 통해 삽입되어 지는데요. 태그를 여는 를 > 로 표현함으로써 브라우저가 진짜 태그가 아닌 문자 형태의 로 인식하게 할 수 있습니다. 이 방법으로 XSS 필터링을 해줄 수 있습니다. var XSSfilter = function(content) { return content.replace(//g, ">"); }; Node.js 의 장점이 Front-end와 Back-end 언어가 같다는 점을 생각하면 이 코드는 HTML +..
클라이언트 사이드 (웹브라우저)에서 전역 객체에 접근하고 싶다면 window 객체를 통해 접근 할 수 있습니다. 예를 들어 example 이라는 변수를 전역 변수로 만들고 싶다면. window.example = null; 이렇게 하면 example 이라는 전역 변수에 null 값을 할당하게 됩니다. 서버 사이드 (Node.js)에서 전역 객체에 접근하고 싶다면 global 객체를 통해 접근 할 수 있습니다. 위와 동일하게 example 이라는 변수를 전역 변수로 만들고 싶다면. global.example = null; 이렇게 하면 example 이라는 전역 변수에 null 값을 할당하게 됩니다. 가급적이면 전역 변수를 쓰지 않는게 좋지만 전역 변수를 꼭 써야만 하는 상황이 있을 수 있으니 클라이언트 사이..
Node.js 에서 require('경로'); 를 활용하면 그 .js 파일 기준으로 상대 경로에 위치한 js 파일을 가져와 쓸 수 있습니다. 여러 함수를 라우팅 페이지와 함께 다같이 몰아 넣는게 아니라 HTTP 요청을 라우팅 할 때 함수들을 의미 별로 파일로 나누어서 관련 함수들을 모아놓고 사용하면 아주 유용하죠. 문제는 저 상대 경로 입니다. 나름 절대 경로 비슷하게 자체적으로 root directory 가 있다면 그걸 기준으로 폴더나 파일을 정리해서 require를 사용하면 참 좋을텐데요. 이럴 때는 process.cwd() 를 활용하시면 해결됩니다. 예를들어 웹 프레임워크가 app.js 로 실행된다고 할 때 node app.js 로 실행을 하게 됩니다. 이 때 이 경로가 process.cwd가 됩니..
CSS를 이용하여 가운데 정렬할 일이 많은데요. 생각보다 쉽지 않습니다. 예를 들어 이렇게 DIV 안에 DIV 한 개가 있다고 가정해봅시다. HTML CSS #container { width:300px; height:300px; background-color:#191970; } #block { width:50px; height:50px; background-color:#ffd700; } 예제 보기 이 상태에서 먼저 Horizontal(가로)로 정렬을 먼저 해볼까요? 이렇게 하면 스타일시트(CSS)가 완전히 분리가 되지 않겠죠? CSS #container { width:300px; height:300px; background-color:#191970; } #block { width:50px; height..
jQuery를 사용하면서 여러가지 애니메이션이나 동작을 수행할 때 순차적으로 일을 하게 하고 싶은데 1 2 3 $("#one").fadeOut(); $("#two").fadeOut(); $("#three").fadeOut(); 이렇게 하게 되면 이 세 DIV 가 동시에 서서히 사라지는 애니메이션이 적용됩니다. 예제보기 하지만 만약 1, 2, 3이 순차적으로 애니메이션을 적용하고 싶다면 .queue() 를 활용하면 됩니다. $("#one").fadeOut().queue(function() { $("#two").fadeOut().queue(function() { $("#three").fadeOut(); }); }); 예제보기 이렇게 queue를 활용하면 필요에 따라 반드시 선행되어야 할 액션 이후에 다른..