javascript

변경된 사항을 보고 있다가 어떤 변경이 일어났을 때 Supervisor라는 것이 자동으로 node를 껐다 켜서 실행을 시킨다.이를 watch 기능이라고 한다. https://www.npmjs.com/package/supervisor Supervisor에 대한 메뉴얼과 예제들이 있으니 참고하면 될 것 같다.   npm install supervisor -g-g : global의 약자로 컴퓨터 전역으로 사용할 수 있도록 설치   서버 코드를 app.js라고 가정할 때, 터미널에서 node app.js 대신 supervisor app.js 를 실행하면 코드에서 변경이 감지될 때마다 자동으로 app.js를 새로 실행시켜줘서 우리가 서버를 재시작할 필요가 없어진다.

어떠한 정보에 대한 주소를 나타낼 때에는 url상에 모든 정보를 포함시켜야한다.하지만 문제가 되는 케이스가 있다. 바로 아이디와 비밀번호를 입력할 때, 아이디와 비밀번호는 url상에 노출되면 안되기 때문이다.이 경우, url에 정보가 표시되지 않는 방식인 POST 방식을 사용하게 된다. 또한 이 전의 글과 같이 텍스트박스에 만약 매우 긴 문자열들이 들어간다고 가정하면 url의 규격을 위반하기 때문에 post 방식을 사용한다.   (query string 을 사용한) GET 방식 : 하나의 router가 GET방식을 통해 전송된 쿼리 스트링의 데이터에 따라 다른 결과를 보여줄 수 있다. Express 디폴트 값은 GET 방식이다.POST 방식 : url에 데이터가 포함되지 않고 조용히 데이터가 암시적으로 ..

doctype htmlhtml head meta(charset='utf-8') body form(action='/form_receiver' method='post') p input(type='text' name='title') p textarea(name='description') p input(type='submit')app.post('/form_receiver', function (req, res) { res.send('Hello, POST');});이와 같이 작성하면 Hello, POST가 출력되는 것을 확인할 수 있다...

웹브라우저가 상호작용하는 과정에서 2가지 방법이 있다.GET 방식과 POST 방식이 있다.GET 방식은 지금까지 사용했던 것 (웹브라우저에서 웹서버로 정보를 요청할 때 사용. 디폴트가 GET)POST를 알게 됨으로써 GET을 더 잘 이해할 수 있게 된다. 애플리케이션을 이용하기 위해 애플리케이션에 접속하면,애플리케이션은 사용자의 접속(사용자의 요청)에 따라 어떠한 정보를 응답한다.사용자는 그 정보를 가져온다.이 방식이 GET이다. http://a.com/topic?id=1 같은 경우 GET 방식이다. (query string이 없이 /topic 만으로 접속했을 때에도 GET 방식이다.)어떤 정보를 서버에 요청해서 가져오는 방식은 GET 방식이다. 한 마디로 정리하자면 아래와 같다.GET : 사용자가 서버..

http://localhost:3000/topic?id=2 와 같은 url을 사용할 수도 있지만,http://localhost:3000/topic/2 처럼 조금 더 깔끔한 url을 사용할 수도 있다.이러한 방식의 url 체계를 'Semantic URL' 이라고 표현한다.이를 한국어로 번역하면 'Semantic : 의미론적인, 즉, 조금 더 의미에 부합되는 url 체계'라고 한다.우리는 이를 query 방식에서 path 방식으로 바꿔볼 것이다.사실 query 방식이 더 중요하다.최근에는 시멘틱 url도 많이 사용하기 때문에 알아둬서 나쁠 건 없다고 생각한다. 바로 http://localhost:3000/topic/1 에 접속하면Cannot GET /topic/1 라는 오류가 뜰 것이다. 이는 /topic/..

웹페이지들의 url들을 보게 되면http://testing.com/topic?id=1http://testing.com/topic?id=2http://testing.com/topic?id=3과 같이 ?로 이루어진 url을 본적이 있을 것이다.이를 이용해 하나의 라우터를 갖고 여러개의 url을 생성할 수 있다.그럼 방법을 알아보자.   app.get('/topic', function (req, res) { res.send('Hello');});우선 기본적인 라우터의 형식이다.이는 topic?id=1을 작성하든 topic?id=2를 작성하든 모두 똑같이 Hello 라는 문구가 출력된다.그렇다면 어떻게 id값에 따라 웹페이지를 다르게 할당할까?사용자가 위와 같이 입력해서 들어왔다면 이는 request일 것..

npm install pugexpress 자체는 템플릿 엔진의 기능을 갖고 있지 않기 때문에 설치를 따로 해야한다.   app.set('view engine', 'pug');사용할 템플릿 엔진을 express에게 알려주는 명령이다.   app.set('views', './views')템플릿이 있는 디렉토리를 express에게 알려주는 코드이다.보통 views라는 이름으로 많이 사용한다.사실 이 부분의 코드는 생략해도 views라는 디렉토리를 찾도록 default로 설정되어있다.   app.get('/template', function (req, res) { res.render('temp', {time: Date(), title: 'Pug'});});render : 렌더링하다의 render이다./te..

앞전에 Express의 정적 파일 제공에 대해 살펴보았다면 이번에는 동적 파일 제공에 대해 살펴볼 것이다. public 폴더 안에 static.html 파일을 만든다.Hello, Static이렇게 만들었다면 localhost:3000/static.html 을 통해 해당 html파일을 열 수 있다.여기서 포인트는 static.html 파일을 수정한다하더라도 서버를 굳이 재시작을 안해도 된다는 것이다.정적인 파일은 내용을 수정하면 바뀐 내용을 바로 반영시킬 수 있기 때문이다.하지만 서버의 js파일을 수정한다면 그 경우는 재시작을 해줘야한다.재시작을 안해도 되는 방법이 있다고 하지만 아직 배우지 않은 관계로.. 패스   app.get('/dynamic', function (req, res) { var o..

정적인 파일을 제공하기 위해서는 다음과 같은 코드가 필요하다.app.use(express.static('public'));이는 정적인 파일이 위치할 디렉토리를 지정한다.즉, 해당 프로젝트 내에 public 폴더 내에 정적인 파일이 있다는 의미이다.보통 public을 많이 쓴다.   app.get('/test', function(req, res){ res.send('Test, ')})정적 파일의 디렉토리를 설정해주었다면 이제 사용하면된다.localhost:3000/test 로 들어가면 Test 문자열과 함께 public 경로안에 있는 test.jpg 사진이 출력될 것이다.   앞서 설명하였던app.get('/', function (req, res) { res.send('Hello home pag..

npm install express시작하기에 앞서 Express모듈이 없다면 터미널에서 설치를 해야한다.   var express = require('express');설치가 완료되었다면 express라는 모듈을 프로젝트에 로드한다.   var app = express();express 모듈은 함수이기 때문에 app 변수에 저장한다.   app.listen(3000, function () { console.log('Connected 3000 port!');})app에는 listen이라는 메서드가 있다.메서드에 인자로 포트번호를 지정해주면 해당 포트를 listening할 수 있게 된다.listening에 성공한다면 funtion()이라는 콜백함수가 실행되면서 'Connected 3000 port!'가..