본문 바로가기

Others

(103)
Express] 템플릿 엔진 (Jade) 템플릿엔진은 독립적으로 주제가 떨어질만큼 규모가 있으며, Nodejs-express의 맥락에서 뿐만 아니라 다른 곳에서도 중요한 맥락이 된다. 1. 템플릿 엔진의 문법에 따라 만든 문서 작성하기. (index.jade) Left-Line 7 : - 는 스크립트를 작성할 때, jade와 약속한 것.Left-Line 9 : time이라고 되어있는 부분이 앞에 있는 특수한 기호(=)와 결합해서 우측 이미지의 Line13을 의미.템플릿코드 바깥쪽에서 템플릿코드를 실행할 때, time이라는 변수를 만들어서 주입시켜 준 것이다. 템플릿코드 안에서 변수를 쓸 수 있다는 것을 의미함. 템플릿엔진 사용하기 1.템플릿엔진을 설치하기 : jade라는 모듈을 설치하라는 뜻 템플린 엔진이라고 하는 것은 어떤 특정한 상품을 의미..
Express-웹페이지를 표현하는 방법 웹페이지를 사용자에게 서비스 하는 방법1. 정적인 파일 전달하는 방법 (이전 게시글 복습)2. 동적인 파일을 전달하는 방법 (다음 게시글 템플릿 예습) 정적으로 한다? 한번만들어진 것은 언제나 똑같은 모습의 html을 만들려고 하는 것.public이라는 디렉토리에 html 파일을 놓는다.app.use(express,static('public'); 로 인해 public 디렉토리 안에서 그 html 파일을 찾게 된다. Line 10 : 정적인 파일은 수정된 내용을 바로 적용시킬 수 있다. (node app.js를 하지 않아도 된다는 뜻.)하지만 요청이 들어올 때마다 노드가 알아서 잡아서 던져준다. 그래서 정적인 페이지를 서비스하는 것이 코드를 짜는데 편리하다고 할 수 있다. Line 14 : app.get(..
Express] 정적파일을 서비스하는 법 정적파일을 어떻게 사용자에게 제공할 수 있는가?정적파일?- 동적이지 않은 것- 프로그래밍적으로 만들어진 웹페이지는 동적이라고 표현함.- 그렇지 않고 사람이 만든 것을 언제나 똑같이 보이면 그것은 정적이라고 한다. express 홈페이지 메뉴얼에서 정적으로 파일을 작성하고 싶을 때를 참고해보자. app.use(express.static('public')); middleware를 알고 있어야 위 코드를 모두 해석할 수 있다.모른다면 패턴화해서 익히면 되니 걱정하지 말자. app.js 코드에 추가해보자. Line 4 : 정적인 파일이 위치할 디렉토리를 지정하는 기능.그 디렉토리명을 static() 안에 명시한다.= public이라는 디렉토리를 정적인 파일이 위치하는 디렉토리로 하겠다.(동작 전, public이..
Express 설치 및 기본코드분석 (복습)nodejs에서 웹서버 만들기 코드를 다시 한번 해석해보자 (축약형) (기본형) Line 1 : 웹서버가 되기 위해서는 Nodejs의 http 모듈을 사용한다. 그 모듈을 (const) http 변수에 담았다. Line 6 : http 변수에 담겨있는 http 객체가 가지고 있는 createServer라는 함수를 호출.createServer에 의해 만들어진 서버를 제어할 수 있는 객체(const server)를 return 한다. Line 12 : 이 서버거 어떻게 들어온 사용자에 응답을 받을 것인지 바라보게 하는 것 ( 리슨하게 하는 것 )Listen 작업은 시간이 여러가지 이유로 인해 시간이 걸릴 수도 있다. 그래서 콜백으로 비동기적으로 적용시킨다. Line 7-9 : 실제로 사용자가 line..
동기와 비동기 동기 ; Synchronous ; 싱크비동기 ; Asynchronous ; 어싱크 동기&비동기 비유로 접근하기 ( nodejs에서와 의미가 정확하게 일치하지는 않으나 느낌만 전달 받자 ) 1) 실생활 일처리 동기 : 여러가지일이 있는데, 하나의 일을 완전히 마친 후에 또 다른 일을 하고, 하나씩 순서대로 진행하는 것비동기 : 여러가지 일을 각 전문가에게 동시에 맡긴다. 맡기는 것은 짧은 시간이면 됨. 뭐가 먼저 될지 알 수 없다는 단점, 순서가 중요하지 않다면 이렇게 처리하면 된다. 2) 기술적 측면 예) 이메일 발송 시스템 동기 : 발송 버튼을 누른 후, 100명의 수신자에게 한명씩 메일을 보낸다. 한명당 1초가 걸린다고 하면 수행완료까지 100초...비동기 : 발송 버튼을 누른 후, 사용자에게 메세지..
모듈과 NPM ▣ 모듈? - 일종의 부품- 부품을 가져다 쓸 때는 require 함수 사용.- (웹 서버를 처음부터 끝까지 만드는 것은 굉장히 어렵다) Nodejs에서는 이 어려움을 알기 때문에 기본적인 웹 서버(모듈)를 잘 만들어 놓고 사용할 수 있도록 해 놓았다. (어떻게 사용할까? NPM) Line1 : require 함수, 그 함수 이하 애플리케이션(코드)가 구동되기 위해서는 Nodejs에서 제공하는 http라는 모듈(부품)이 필요하다(요구된다). require 함수가 실행되면 http라는 이름을 가진 부품을 가져와서 로드하고. 이의 리턴 값을 const http에 담는다.= http라는 변수에 http라는 모듈(부품)을 담음.여기서 변수는 정확히 상수. (상수란 항상 그 값을 가지고 있기 때문에 값이 바뀌지 ..
웹 애플리케이션 만들기 ▣ nodejs.org > about 기본 예제 코드로 살펴보는 중요내용. ▣ 위 코드의 역할 1. 웹서버를 만드는 코드2. 만들어진 웹 애플리케이션은 나타난 주소로 접근해서 요청이 들어오기를 기다리게 됨.3. (코드 해석) 웹 브라우저로부터 통해서 요청한 내용을 받아서 hello world 라는 텍스트를 출력하게 된 것. 이 개념을 이해하기 위해서인터넷, 도메인 네임, IP, PORT를 공부하면 좋다. ▣ 인터넷의 동작방법 1. 서버2. 클라이언트3. IP4. PORT 인터넷?- 1960 인터넷 등장으로 더 이상 컴퓨터 간에 독립되지 않고 서로 연결되어 협력적인 작업을 시작할 수 있게 됨. 클라이언트 & 서버- 웹브라우저가 설치 된 곳- 어떤 주소를 가진 컴퓨터(서버: 요청에 응답해서 정보를 제공)에 ..
서버 측 자바스크립트 - nodejs 소개 자바스크립트를 이용해서 서버쪽에서 동작하는 웹애플리케이션을 만들 수 있다. 자바스크립트?▣ HISTORY 1990 : 팀버너스리에 의해 웹 탄생1994 : 마크 안드레슨 네스케이브라는 웹브라우저 탄생 // 동시에 인터넷과 웹 폭풍성장1995 : 브렌던 이크 자바스크립트 등장! = 1990년대에는 정적이었던 페이지가 동적으로 변경 2004 :- 자바스크립트는 최초에는 웹에서만 동작 (웹에 갖혀 있었음)- 구글에의해 GMAIL : html, css , js 순수 웹 기술로 만들어짐 / GMAP : 순수 웹 기술로 개발, but 고기능성 웹애플리케이션->구글에 의해 자바스크립트의 효용성에 크게 놀라는 계기가 됨 순수 웹 기술(PURE WEB)에 대한 장점 -> 자바스크립트를 배워야겠다!1. 한번 개발하면 모든..