[NodeJs] Ajax를 이용한 화면 업데이트

Ajax란 무엇이도냐 (Asynchronous JavaScript and XML) 브라우저가 -request->서버에 전송하는 방법은 1. Form 2. Link () 3. 주소창에 입력 Web이라는 환경 안에서는 browser가 서버에 request를 보내는 방법이 없었습니다. (url로 요청을 해야겠지요?) request를 보내면, response를 받아서 browser가 refresh를 합니다. (그러면 기존에 있는 화면을 전체 변경 하겠지요) 4. XMLHttpRequest라는게 새롭게 추가되었지요. (programming으로 변경 javascript로) javascript로 request를 발생시킬 수 있는... 왜 XML이 붙어있을까? request를 보낼때 url이라고 보내는데 (parame..

• format_list_bulleted JavaScript BackEnd/Node.js, Express
• · 2021. 4. 30.
• textsms

[NodeJs] Express 프로젝트 시작하기 (MVC Pattern / ejs)

프로젝트를 만들기 위해서는 New > Node.js Express Project 여기서는 ejs의 template engine을 사용하기 때문에 ejs로 변경시켜준다. MVC Patterm으로 프로젝트가 생성되었다. app.js의 코드를 보면 아래와 같다. 자동적으로 모든 환경설정을 자동으로 생성해주는 것을 볼수 있다. 이제 MVC에 맞도록 코딩을 하면 끝... 이렇게 쉽다니... 출처 : ourcstory.tistory.com/14?category=664896

• format_list_bulleted JavaScript BackEnd/Node.js, Express
• · 2021. 4. 30.
• textsms

[NodeJs] 외부모듈활용 - Express를 활용해 간단한 Framework 만들기. (그 외 유용한 모듈) (3/3)

기존에는 var reqHandler = function(req, res) { res.writeHead(200, {"Content-Type":"text/html"}); res.end("Welcome to Server."); }; var server = http.createServer(reqHandler); server.listen(8080, function() { console.log('running on 8080...'); }); 로 사용을 했지만. reqHandler를 만들지 않고, express()를 사용했다. express를 사용하면 var app = express(); app.use(function(req, res) { res.send("Welcome to Server."); }); http 모듈..

• format_list_bulleted JavaScript BackEnd/Node.js, Express
• · 2021. 4. 30.
• textsms

[NodeJs] 외부모듈활용 - Express를 활용해 간단한 Framework 만들기. (Router/GET/POST) (2/3)

router 미들웨어 (길잡이를 해주기 때문에 이름이 router입니다.) - 요청 메서드와 url에 따른 분기 - 개별 함수를 통한 1:1 작업 분화 - app.use()라는 것을 app.get()처럼 표현.. ? - router.get()이 많이 나온다구...? - use에서 if 문으로 분기를 나눠서 처리하는게 너무 많은거야.. 그래서 router로 만들어보자. use함수 제조기를 router라고 만들자. - 필요에 의해 새로운 router 생성 - 별도의 context 생성의 의미 var router = new Router(); router.get('/plus', function() {}); router.get('/minus', function() {}); app.use(router); 있었는데,..

• format_list_bulleted JavaScript BackEnd/Node.js, Express
• · 2021. 4. 30.
• textsms

[NodeJs] 외부모듈활용 - Express를 활용해 간단한 Framework 만들기. (1/3)

express 모듈 사용하기. expressjs.com 1. 설치하기 npm install express --save (--save는 나중에 배포하기 쉽게 하기 위해서 옵션을 넣습니다.) http의 모듈의 불편함을 개선하고자 request와 response 객체에 추가된 기능 다양한 미들웨어를 제공 - use() 함수 - request 이벤트 리스너를 연결 - 연쇄적, 구간별 작업 처리 (waterfall의 callback과 유사한 작업 처리) minimal하고 flexible node.js web application framework입니다. web과 mobile application 2. Express란 Request 이벤트를 핸들하기 위한 Framework입니다. [참고] http://express..

• format_list_bulleted JavaScript BackEnd/Node.js, Express
• · 2021. 4. 30.
• textsms

[NodeJs] 외부모듈활용 - Aync

Async Module 콜백함수의 문제를 해결하기 위해서 사용해요. 1. 설치하기 npm install async - waterfall([fn, fn, ...], fn) : 배열의 함수를 한단계씩 실행, 파라미터를 다음 콜백에게 전달 - series([fn, fn, ...], fn) : 배열의 함수를 실행, 각각의 파라미터를 마지막 함수에게 전달. 예제 ) var async = require('async'); async.parallel([ function(callback) { console.log('1st '); setTimeout(function() { callback(null, 'one'); }, 3000); }, function(callback) { console.log('2nd '); setTim..

• format_list_bulleted JavaScript BackEnd/Node.js, Express
• · 2021. 4. 30.
• textsms

[NodeJs] 외부모듈사용하기 - EJS 모듈

EJS (Embedded JavaScript (http://embeddedjs.com) Template Engine 1. 설치하기 npm install ejs 2. 사용하기 EJS 특수태그 3. 예제 코드 ejstest.js var http = require('http'); var fs = require('fs'); var ejs = require('ejs'); var server = http.createServer(function(req, res) { data = {name: 'lee', age:27}; fs.readFile('./test.ejs.html', 'utf-8', function(err,file) { console.log(file); var html = ejs.render(file,data)..

• format_list_bulleted JavaScript BackEnd/Node.js, Express
• · 2021. 4. 29.
• textsms

npm과 lite-server로 HTML, CSS 실습관경 만들기

| NPM 사용해보기 다음과 같이 html 파일을 만듭니다. . └── index.html This is first npm usage npm is the greatest tool in javascript ecosystem 다음과 같은 명령어를 치면 npm을 이용하여 현재 node.js의 프로젝트의 의존성과 프로젝트 정보를 관리하는 package.json 파일을 손쉽게 생성할 수 있습니다. 원래는 index.js를 진입점으로 보통 정하지만 여기서는 html 파일을 진입점으로 정하겠습니다. npm init name: (bootstrap-coursera) version: (1.0.0) description: entry point: (index.js) index.html test command: git repo..

• format_list_bulleted JavaScript BackEnd/Node.js, Express
• · 2021. 3. 29.
• textsms

Node.js 및 NPM(Node Package Manager) 개요

| Node.js V8 JavaScript 엔진 기반 위에 동작하는 자바스크립트 런타임 프레임워크 비동기식 입출력(non-blocking I/O), 이벤트-기반(Event-driven) 처리 싱글 스레드 아키텍처 주로 서버 사이드 자바스크립트 웹 어플리케이션을 제작할 때 주로 쓰임 | Node.js 아키텍처 | NPM(Node Package Manager) Node.js의 모듈 및 패키지 환경을 관리하는 매니징 툴 NPM이 관리하는 패키지에는 자바스크립트 파일들과 package.json이라는 메니페스트 파일(패키지의 메타데이터: 버전, 의존성 등을 나타내는 파일)이 포함됨 Node.js로 만들어진 모듈을 웹 상에서 관리하므로 기존에 공개된 모듈들을 쉽게 설치하고 활용 가능 ( python의 pip, Ja..

• format_list_bulleted JavaScript BackEnd/Node.js, Express
• · 2021. 3. 29.
• textsms

nodejs 테스트 도구와 방법론 (테스트의 중요성, 전략, mocha, chai, sinon, istanbul, 유용한 팁)

1. 테스트를 왜 해야하는가? 테스트를 안하는 개발자는 없다. 코드 작성 후 서버를 뛰워서 api url을 호출해서 응답값을 확인해보고, UI에서 버튼을 눌러보고 하는 것도 모두 테스트이다. 그러나 여기서 다루는 테스트의 정의는 '개발자가 작성한 테스트 코드에 의한 테스트'이다. 이것은 코드로 작성되었으므로 테스트 자동화가 가능해지며(CI연동 등), 다른 개발자도 이것을 통해 동일하게 반복적으로 테스트할 수 있어진다. 1-1. 테스트 코드의 중요성 반복적인 행위를 줄여준다. (비용감소) 테스트코드 없이 테스트를 하려면 계속 서버를 on/off하며 수동으로 동작시켜 줘야 할 것이다. (주로 nodemon 활용) 궁극적으로 애플리케이션이 복잡해진다면 테스트역시 복잡해진다. 빠른 오류&버그 확인과 수정, 리팩..

• format_list_bulleted JavaScript BackEnd/Node.js, Express
• · 2021. 3. 18.
• textsms