{"data":{"site":{"siteMetadata":{"title":"lastrites2018","author":"lastrites2018","siteUrl":"https://lastrites2018.netlify.com","comment":{"disqusShortName":"","utterances":"lastrites2018/gatsby-first-blog"},"sponsor":{"buyMeACoffeeId":""}}},"markdownRemark":{"id":"e3382c90-0350-51bc-b2f6-4eb31c7cb7c5","excerpt":"Server and Node Node 치면 들어갈 수 없음. console.log 가능. ctrl + c 두 번 누르면 나갈 수 있음. import export -> es6 문법 commonJS 문법이라고 하는 commonjs module system에서 따온   and  404 - not found( 클라이언트) 500 대는 서버문제 127.0.0.1 = localhost 란 뜻(내 컴퓨터를 의미) -express 하면 구글검색시 그 내용들은 제외되고 출력 채터박스 server…","html":"<h2 id=\"server-and-node\"><a href=\"#server-and-node\" aria-label=\"server and node permalink\" class=\"anchor\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Server and Node</h2>\n<p>Node 치면 들어갈 수 없음. console.log 가능.</p>\n<p>ctrl + c 두 번 누르면 나갈 수 있음.</p>\n<p>import export -> es6 문법</p>\n<p>commonJS 문법이라고 하는 commonjs module system에서 따온 <code class=\"language-text\">export</code> and <code class=\"language-text\">require</code></p>\n<p>404 - not found( 클라이언트)</p>\n<p>500 대는 서버문제</p>\n<p>127.0.0.1 = localhost 란 뜻(내 컴퓨터를 의미)</p>\n<p>-express 하면 구글검색시 그 내용들은 제외되고 출력</p>\n<p>채터박스 server 먼저 따라해보기</p>\n<p><code class=\"language-text\">require</code> 노드 모듈을 요청하는 것</p>\n<p>서버가 띄워진 상태에서 새 탭을 열어서 npm test 를 돌려야 함</p>\n<p>포트 닫기, 어떻게 포트를 강제로 열고 닫는지 알아보기.</p>\n<h2 id=\"노드-키워드\"><a href=\"#%EB%85%B8%EB%93%9C-%ED%82%A4%EC%9B%8C%EB%93%9C\" aria-label=\"노드 키워드 permalink\" class=\"anchor\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>노드 키워드</h2>\n<p>JS 인터프리터</p>\n<p>이벤트 루트란 개념?</p>\n<p>논블럭킹 I/O?</p>\n<p>REPL(Read, Eval, Print, Loop)</p>\n<p>오늘 할려는게 REST API 서버</p>\n<p>웹소켓은 실시간으로 통신 가능</p>\n<p>LIVE-SERVER(recast에서 자동 리프레쉬 되었던)</p>\n<h2 id=\"커먼-js-패턴-중요\"><a href=\"#%EC%BB%A4%EB%A8%BC-js-%ED%8C%A8%ED%84%B4-%EC%A4%91%EC%9A%94\" aria-label=\"커먼 js 패턴 중요 permalink\" class=\"anchor\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>커먼 JS 패턴 (중요)</h2>\n<h2 id=\"모듈-추출-예제\"><a href=\"#%EB%AA%A8%EB%93%88-%EC%B6%94%EC%B6%9C-%EC%98%88%EC%A0%9C\" aria-label=\"모듈 추출 예제 permalink\" class=\"anchor\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>모듈 추출 예제</h2>\n<ul>\n<li>\n<p>모듈(<a href=\"https://jongmin92.github.io/2016/08/25/Node/module-exports_exports/\">https://jongmin92.github.io/2016/08/25/Node/module-exports_exports/</a>)</p>\n<p>관련된 코드들을 하나의 코드로 캡슐화하는 것을 말함.</p>\n</li>\n<li>\n<p>모듈 추출하기(exporting)</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\"><span class=\"token operator\">/</span> greetings<span class=\"token punctuation\">.</span>js\n<span class=\"token function-variable function\">sayHelloInEnglish</span> <span class=\"token operator\">=</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n  <span class=\"token keyword\">return</span> <span class=\"token string\">\"Hello\"</span><span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token function-variable function\">sayHelloInSpanish</span> <span class=\"token operator\">=</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n<span class=\"token keyword\">return</span> <span class=\"token string\">\"Hola\"</span><span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span></code></pre></div>\n</li>\n</ul>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">모듈 추출의 <span class=\"token number\">3</span>가지 방법\n<span class=\"token number\">1.</span> greeting<span class=\"token punctuation\">.</span>js 첫 부분에 다음과 같은 코드 추가\n<span class=\"token keyword\">var</span> exports <span class=\"token operator\">=</span> module<span class=\"token punctuation\">.</span>exports <span class=\"token operator\">=</span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span>\n\n<span class=\"token number\">2.</span> 다른 파일에서 exports 객체 사용을 원할 때<span class=\"token punctuation\">,</span>\n    exports<span class=\"token punctuation\">.</span><span class=\"token function-variable function\">sayHelloInEnglish</span> <span class=\"token operator\">=</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n    <span class=\"token keyword\">return</span> <span class=\"token string\">\"HELLO\"</span><span class=\"token punctuation\">;</span>\n    <span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span>\n    exports<span class=\"token punctuation\">.</span><span class=\"token function-variable function\">sayHelloInSpanish</span> <span class=\"token operator\">=</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n        <span class=\"token keyword\">return</span> <span class=\"token string\">\"Hola\"</span><span class=\"token punctuation\">;</span>\n    <span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token number\">3.</span> 아래와 같이 대체할 수도 있음<span class=\"token punctuation\">.</span> 왜냐하면 exports와 module<span class=\"token punctuation\">.</span>exports는 같은 객체를 참조하기 때문<span class=\"token punctuation\">.</span>\n\tmodule<span class=\"token punctuation\">.</span>exports <span class=\"token operator\">=</span> <span class=\"token punctuation\">{</span>\n        sayHelloInEnglish<span class=\"token punctuation\">:</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n            <span class=\"token keyword\">return</span> <span class=\"token string\">\"HELLO\"</span><span class=\"token punctuation\">;</span>\n        <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n\n        sayHelloInSpanish<span class=\"token punctuation\">:</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n            <span class=\"token keyword\">return</span> <span class=\"token string\">\"Hola\"</span><span class=\"token punctuation\">;</span>\n        <span class=\"token punctuation\">}</span>\n\t<span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span></code></pre></div>\n<ul>\n<li>\n<p>모듈 사용하기</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">require <span class=\"token operator\">-</span><span class=\"token operator\">></span> node<span class=\"token punctuation\">.</span>js에서 module을 <span class=\"token keyword\">import</span><span class=\"token punctuation\">(</span>추가<span class=\"token punctuation\">)</span>해주기 위해 사용\n<span class=\"token comment\">//require는 다음과 같이 정의</span>\n<span class=\"token keyword\">var</span> <span class=\"token function-variable function\">require</span> <span class=\"token operator\">=</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span>path<span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n  <span class=\"token keyword\">return</span> module<span class=\"token punctuation\">.</span>exports<span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span>\n\nmain<span class=\"token punctuation\">.</span>js에서 greetings<span class=\"token punctuation\">.</span>js를 require 합니다<span class=\"token punctuation\">.</span>\n\n<span class=\"token comment\">// main.js</span>\n<span class=\"token keyword\">var</span> greetings <span class=\"token operator\">=</span> <span class=\"token function\">require</span><span class=\"token punctuation\">(</span><span class=\"token string\">\"./greetings.js\"</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\">// 위 코드는 아래 코드와 동일한 코드다.</span>\n\n<span class=\"token comment\">// main.js</span>\n<span class=\"token keyword\">var</span> greetings <span class=\"token operator\">=</span> <span class=\"token punctuation\">{</span>\n  sayHelloInEnglish<span class=\"token punctuation\">:</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n      <span class=\"token keyword\">return</span> <span class=\"token string\">\"HELLO\"</span><span class=\"token punctuation\">;</span>\n  <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n\n  sayHelloInSpanish<span class=\"token punctuation\">:</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n      <span class=\"token keyword\">return</span> <span class=\"token string\">\"Hola\"</span><span class=\"token punctuation\">;</span>\n  <span class=\"token punctuation\">}</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\">// main.js 에서 greeting.js 의 값과 메소드에 접근할 수 있습니다.</span>\n<span class=\"token comment\">// main.js</span>\n<span class=\"token keyword\">var</span> greetings <span class=\"token operator\">=</span> <span class=\"token function\">require</span><span class=\"token punctuation\">(</span><span class=\"token string\">\"./greetings.js\"</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\">// \"Hello\"</span>\ngreetings<span class=\"token punctuation\">.</span><span class=\"token function\">sayHelloInEnglish</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\">// \"Hola\"</span>\ngreetings<span class=\"token punctuation\">.</span><span class=\"token function\">sayHelloInSpanish</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span></code></pre></div>\n<ul>\n<li>핵심 포인트</li>\n</ul>\n<p>require 키워드는 <code class=\"language-text\">object</code>를 반환. module.exports와 export는 call by reference로 동일한 객체를 바라보고 있고, 리턴되는 값은 항상 module.exports 이다. 모듈은 기본적으로 객체이고, 이 객체를 module.exports, exports 모두 바라보고 있는데, 최종적으로 return 되는 것은 무조건 module.exports 라는 것입니다.</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\"><span class=\"token keyword\">var</span> express <span class=\"token operator\">=</span> <span class=\"token function\">require</span><span class=\"token punctuation\">(</span><span class=\"token string\">'express'</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token keyword\">var</span> router <span class=\"token operator\">=</span> express<span class=\"token punctuation\">.</span><span class=\"token function\">Router</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\">/* GET home page. */</span>\nrouter<span class=\"token punctuation\">.</span><span class=\"token keyword\">get</span><span class=\"token punctuation\">(</span><span class=\"token string\">'/'</span><span class=\"token punctuation\">,</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span>req<span class=\"token punctuation\">,</span> res<span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n  res<span class=\"token punctuation\">.</span><span class=\"token function\">render</span><span class=\"token punctuation\">(</span><span class=\"token string\">'index'</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">{</span> title<span class=\"token punctuation\">:</span> <span class=\"token string\">'Express'</span> <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\nmodule<span class=\"token punctuation\">.</span>exports <span class=\"token operator\">=</span> router<span class=\"token punctuation\">;</span>\n<span class=\"token operator\">--</span><span class=\"token operator\">-</span>\n위의 소스는 다음과 같이 해석할 수 있습니다<span class=\"token punctuation\">.</span>\nexpress<span class=\"token punctuation\">.</span><span class=\"token function\">Router</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> 가 리턴한 <span class=\"token string\">\"객체\"</span>에 일부 프로퍼티를 수정한 뒤<span class=\"token punctuation\">,</span> 이\n객체 자체를 모듈로 리턴한 것입니다<span class=\"token punctuation\">.</span></code></pre></div>\n</li>\n</ul>\n<p>require()</p>\n<p>module.exports 내가 이걸 다른데서 쓰겠다고 정의</p>\n<p>노드는 커먼 js 문법을 사용중</p>\n<p>import, export 바벨로 변환하면 이렇게 됨</p>\n<p>비구조 할당 연습해서 익숙해질 것!</p>\n<p>./ = current directory</p>\n<p>require(‘underscore’) -> 이 경우는 디펜던시들을 node_modules에서 받아옴. 이름만 써졍씨는 경우.</p>\n<p><code class=\"language-text\">npm install underscore</code> 이 방식으로 인스톨함</p>\n<blockquote>\n<p>공식 API 문서를 보는 습관을 들일 것. 익숙해져야 함. nodejs.org</p>\n</blockquote>\n<p>package.json에서 모듈 빌드하는 거 알아보기</p>\n<p>npm run (원랜 npm run test 인데, start, test, build는 npm run을 생략할 수 있음)</p>\n<p>npm start</p>\n<p>요새는 npm install</p>\n<p>npm i 만 해도 save가 자동으로 됨</p>\n<p>npm unstall 하면 package.json에서 없어짐</p>\n<p>yarn</p>\n<p>sudo</p>\n<p>패키지가 module.export를 잘 안 한 경우, modluel import가 안 됨</p>\n<p><strong>디버깅 노드</strong> 중요!!</p>\n<p>node server/basic-sever.js === npm start</p>\n<h2 id=\"inspect-옵션-걸어서-크롬-디버깅툴에서-보기\"><a href=\"#inspect-%EC%98%B5%EC%85%98-%EA%B1%B8%EC%96%B4%EC%84%9C-%ED%81%AC%EB%A1%AC-%EB%94%94%EB%B2%84%EA%B9%85%ED%88%B4%EC%97%90%EC%84%9C-%EB%B3%B4%EA%B8%B0\" aria-label=\"inspect 옵션 걸어서 크롬 디버깅툴에서 보기 permalink\" class=\"anchor\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>inspect 옵션 걸어서 크롬 디버깅툴에서 보기</h2>\n<p>node — inspect server/basic-sever.js === npm start 크롬 브라우저에서 볼 수 있음</p>\n<p><code class=\"language-text\">chrome://inspect/#devices</code></p>\n<p>CORS가 무슨 의미인지?</p>\n<p><a href=\"http://127.0.0.1:3000/classes/messages?\">http://127.0.0.1:3000/classes/messages?</a></p>\n<p>file을 써서 특정 json을 써서 저장하게?</p>\n<hr>\n<p>git commit —no-verify</p>\n<h2 id=\"asynchronous-call\"><a href=\"#asynchronous-call\" aria-label=\"asynchronous call permalink\" class=\"anchor\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>ASYNCHRONOUS CALL</h2>\n<p>싱글 스레드는 하나의 콜스택을 가진다는 이야기</p>\n<h2 id=\"event-loop\"><a href=\"#event-loop\" aria-label=\"event loop permalink\" class=\"anchor\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>event loop</h2>\n<ul>\n<li>\n<p>web APIs</p>\n<ul>\n<li>setTimeout</li>\n</ul>\n</li>\n</ul>\n<p>에러 찍힐때 콜스택 순서에 따라 나옴.</p>\n<h2 id=\"postman\"><a href=\"#postman\" aria-label=\"postman permalink\" class=\"anchor\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>POSTMAN</h2>\n<p>은 클라이언트인 척 할 수 있다. client 측 문제일 가능성을 봉쇄해버리고, 서버 문제만 해결 하기 좋다.</p>\n<p>전제는 내 서버가 켜져있을때 데이터를 날릴 수 있다.</p>\n<h2 id=\"레퍼런스-리뷰\"><a href=\"#%EB%A0%88%ED%8D%BC%EB%9F%B0%EC%8A%A4-%EB%A6%AC%EB%B7%B0\" aria-label=\"레퍼런스 리뷰 permalink\" class=\"anchor\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>레퍼런스 리뷰</h2>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">router를 만들어서 <span class=\"token constant\">API</span>를 핸들링 하는 애들을 늘려갈 수 있다<span class=\"token punctuation\">.</span> express를 쓰면 더 편리하게 할 수 있다<span class=\"token punctuation\">.</span>\n\nexports로 <span class=\"token number\">3</span>개의 함수를 내보내고 있다<span class=\"token punctuation\">.</span>\n<span class=\"token constant\">JSON</span><span class=\"token punctuation\">.</span><span class=\"token function\">stringfy</span><span class=\"token punctuation\">(</span>data<span class=\"token punctuation\">)</span> <span class=\"token operator\">-</span><span class=\"token operator\">></span> data가 없으면 <span class=\"token keyword\">null</span>\n\n<span class=\"token comment\">// vs에서 커맨드 + 함수명을 누르면 코드로 넘어갈 수 있음</span>\n\nrequest<span class=\"token punctuation\">.</span>url<span class=\"token punctuation\">.</span>includes로 체크할 것<span class=\"token punctuation\">.</span> <span class=\"token function\">왜냐하면</span> <span class=\"token punctuation\">(</span>messages<span class=\"token operator\">/</span>는 먹히지 않아버린다<span class=\"token operator\">!</span><span class=\"token punctuation\">)</span> 작은 오차도\n\n<span class=\"token punctuation\">{</span> message <span class=\"token punctuation\">:</span> messages <span class=\"token punctuation\">}</span> <span class=\"token operator\">&lt;</span><span class=\"token operator\">-</span> stringfy 시켰기 때문에 갈 수 있다<span class=\"token operator\">!</span>\n\n<span class=\"token comment\">// preFlighted 브라우저가 먼저 날려봄.</span>\n<span class=\"token comment\">// status에서 200번대는 다 ok의 종류다.</span>\n<span class=\"token comment\">// request를 날리기 전에 options를 먼저 보내서, POST를 보낼 수 있는지, 어떤지 중재를 할 수 있다.</span></code></pre></div>\n<ul>\n<li>모듈화 하는 이유 두 가지 : 두 번 이상, 패턴이 반복 된다. 맨날 써주다가는 실수를 할 수 있으니, 아예 함수를 만들자! 반복이 되는 것은 그냥 묶어서 함수를 만들어주자.</li>\n</ul>\n<h2 id=\"이번-스프린트에서-헷갈렸던-부분들\"><a href=\"#%EC%9D%B4%EB%B2%88-%EC%8A%A4%ED%94%84%EB%A6%B0%ED%8A%B8%EC%97%90%EC%84%9C-%ED%97%B7%EA%B0%88%EB%A0%B8%EB%8D%98-%EB%B6%80%EB%B6%84%EB%93%A4\" aria-label=\"이번 스프린트에서 헷갈렸던 부분들 permalink\" class=\"anchor\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>이번 스프린트에서 헷갈렸던 부분들</h2>\n<p>module.export parts 부분.</p>\n<p>json.stringify의 정의와 parse. 언제 json을 하고 언제 parse를 해야 할지 정리해주자.</p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre class=\"language-text\"><code class=\"language-text\">module.exports.requesthandler = requesthandler;</code></pre></div>","frontmatter":{"title":"Immersive Sprint - NODE.js","date":"October 11, 2018"}}},"pageContext":{"isCreatedByStatefulCreatePages":false,"slug":"/til/20181010-20181011 IM08D17-18 NODE JS/","previous":{"fields":{"slug":"/til/20181008-20181009 IM08D15-16 REDUX/"},"frontmatter":{"title":"Immersive Sprint - REDUX","category":"TIL"}},"next":{"fields":{"slug":"/til/20181012-20181013 IM08D19-20 web historian/"},"frontmatter":{"title":"Immersive Sprint - web historian","category":"TIL"}}}}