Javascript/Node.js (15) 썸네일형 리스트형 D3.js 사용법을 알기 위한 튜토리얼 예제 분석(D3공식홈페이지 example과 실시간 Line 그래프 예제 분석) D3.js 기본 문법 정리 D3.js는 Data-Driven Documents의 약어로 데이터를 렌더링할 수 있는(그릴 수 있는, 다룰수 있는) 웹 기반 문서 라이브러리다.좀 더 간단 명료하게 설명하면 데이터 시각화 라이브러리다. (실시간 데이터 차트 및 다양한 그래프)D3 공식홈페이지에 가보면 엄청나게 다양한 그래프들이 있고 거기서 원하는 것을 골라서 소스를 얻어갈 수 있다.라이센스도 BSD로 영리든 비영리든 마음대로 사용, 수정해도 된다.D3.js의 기본 문법(사용법)을 숙지하고 예제코드를 분석할 것이다.- D3 작업 순서 1. 데이터를 불러온다.2. 작업할 공간을 선택한다.3. 공간에 불러온 데이터를 연결(바인딩)한다.4. 각각 연결한 것을 원하는대로 그린다.1234567var dataset = [.. Node MVC패턴 웹 애플리케이션 만들기 Node MVC패턴 웹 애플리케이션 만들기 Node.js 기본기를 다시 잡으면서 MVC패턴을 적용해서 웹 애플리케이션을 만들어 본다.(도서 Node.js 6.x 블루프린트 Chapter1 예제) Express generator (Express 프레임워크 구조화 및 관리) Express Generator Node.js 에서 Express 프레임워크를 사용하면서 지금까지는 단순하게 npm init으로 package.json을 만들고 dependency를 설정하고, npm install로 모듈 설치하고, app.js파일 만들고, 라우트할꺼 라우트하고, 뷰 엔진은 뭐를 쓸 것이며 그 뷰 파일들은 어디에 있고 기타등등... 의 일을 해왔다.일종의 설정이었다.프로젝트 디렉토리가 어떤 구조를 가지며 Express에서 어떤 미들웨어, 모듈들을 사용할 것인지 등에 대한 설정.이러한 설정을 편리하게 일반적인 구조로 만들어주는 것이 바로 Express Generator다.이용 방법은 굉장히 간단하다.1. 명령프롬프트에 "npm install express-generator -g" 한 줄을 .. 웹 개발하면서 처리해야할 보안, 최소한의 방어, 정보보안 웹 애플리케이션 보안 처리, 해결책 웹 애플리케이션을 개발하면서 대부분 요구사항에 맞는 주요 기능을 개발하는데 열을 올린다.주요 기능을 개발하는 것도 중요하지만 그것 못지 않게 아니면 더 중요한 것이 보안이다.해커가 공격하는 루트는 엄청나게 많지만 개발을 공부하는 입장에서 최소한의 방어를 가진 애플리케이션을 개발해야 한다.간단한 케이스 별로 정리를 해두겠다.1. 버그 없는 코드 유지- 대부분의 버그는 나쁜 것이며 버그가 보안 취약점을 일으킬 수 있다.버그를 최소화 하는 법1) 테스트 하기. 단위테스트부터 꼼꼼한 테스트는 버그를 줄일 수 있다.2) 코드 검토하기. 코드를 많은 사람들과 본다.3) 신뢰할만한 라이브러리 사용. 누군가 라이브러리를 만들었다면 잘 테스트되고 신뢰할만 한지 확인할 것.4) 좋은 코.. mongoose로 Mongodb 사용하기 (+passport 로그인 인증, 보안) Mongoose 미들웨어 Mongoose는 Node.js에서 MongoDB를 조금 더 간편하게 다룰 수 있게 해주는 미들웨어다.Mongoose가 MongoDB에 연결하고 모델을 만들 수 있으며 다양하게 사용가능하다.몽구스를 이용하면서 passport 미들웨어를 통한 로그인을 구현하는 프로필 애플리케이션을 만든다.(feat. cookie-parser, bcrypt-nodejs, connect-flash, express-session ...)* bcrypt-nodejs는 bcrypt 대신 사용함. 이유는 bcrypt가 C코드를 사용해서 C코드 컴파일러 설정이 잘되어 있어야 사용가능한데 예제에서 문제를 일으키기 싫어서 대체. 속도가 느려진다면 나중에 bcrypt로 사용해야함. 프로필 애플리케이션 만들기 & 분.. MongoDB 설치 방법, 환경설정, 몽고 디비 구조 MongoDB 몽고디비는 기존 관계형데이터베이스에서 사용하는 SQL 쿼리 대신 자바스크립트를 이용하는 NoSQL 데이터베이스다.몽고디비를 사용하려면 몽고디비가 설치되어있어야 하고 몽고디비를 실행시켜놔야한다.- 몽고디비 설치(Window)1. https://www.mongodb.com/download-center?jmp=homepage#community여기에 들어가서 Windows Server 2008 R2 64-bit and later, with SSL surpport x64를 설치2. C:\Program Files\MongoDB\Server\3.4\bin 에 몽고디비가 설치되었을텐데,이 3.4디렉토리를 C:\ 밑으로 복사하고 이름을 mongoDB로 바꿔준다.(이제 C:\mongodb\bin이 있는 것이.. Pug 문법 정리 요약 (템플릿 엔진) Node.js 템플릿 엔진 Node.js 에서 사용하는 템플릿 엔진은 굉장히 많이 있다. (pug(jade), ejs, handlebars, mustache 등) 그 중에 자주 사용되는 pug 문법을 정리한다. https://pugjs.org/api/getting-started.html 여기서 language reference를 보면 pug 문법을 더 명확하게 이해할 수 있다. * pug를 사용하는 이유 - 사실 어떤 템플릿 엔진을 사용해도 상관없다. 예를들어 ejs는 html 태그에 부분적인 입력,수정을 하기 때문에 html문법에 이미 적응한 사람이 보기에 쉬울 것이다. 하지만 pug는 코드를 간소화시켰고, 컴파일한 후에 html문서를 렌더링하는 형식이라 생산성이 높아지기 때문에 새로 문법을 익히는데 .. Node.js API 구축 방법 기초 기본 JSON API API는 한 코드 조각이 또 다른 코드 조각과 통신하는 방식이다.API는 HTTP 요청을 받아서 JSON 데이터로 응답한다. (주로 JSON을 많이 사용한다.)- 기본 원리 요청을 받아서 요청을 분석하고 JSON 개체와 HTTP 상태 코드로 응답한다. 끝.초간단하게 이해하기 위해서 억지스럽지만 임의의 정수를 반환하는 API를 만든다.123456789101112131415161718var express = require("express");var app = express();app.get("/random/:min/:max",function(req, res){ var min = parseInt(req.params.min); var max = parseInt(req.params.max);.. 이전 1 2 다음
