[node.js 따라배우기 01] Webapp을 만들어 봅시다! : 노드패드(Nodepad) 첫 번째 따라배우기를 시작합니다.
아마, 익숙하지 않은 분들은 많은 것들이 낯 설게 느껴지실 겁니다. 하지만 당황하지 마시고, 우선은 그런가 보다 하고 넘어가시는 것도 괜찮습니다. 그리고 번역은 크게 오해가 안생기는 수준에서 빠르게 진행할 예정이라 다소 어색할 수 있습니다. 매끄럽지 못하더라도 양해해 주세요. (댓글로 지적해 주시는 부분은 수정할게요~ ^^) 자 그럼 part 01은 비교적 편한 마음으로 쉽게 읽으시면 되겠습니다. 원본 파트1, "웹앱(Webapp)을 만들어 봅시다! " 우리가 만들 앱은 Nodepad(노드패드)라 불리는 웹 노트패드입니다. 프레임워크와 도구 선택하기 현대의 웹 애플리케이션들은 몇몇 컴포넌트들에 의존합니다. - 스토리지: 관계형 데이터베이스, NoSQL - 저장라이브러리: 단순형, ORM - 웹 서버 - 패키지 매니저 - 서버-사이드 프레임워크 - 클라이언트-사이드 프레임워크 - 테스팅 라이브러리 - 버전 컨트롤. [node.js 따라배우기 02] 설치와 애플리케이션 뼈대 만들기 (Installation and Skeleton App) 이번부터는 조금 난이도가 올라갑니다.
번역 이외로 주석이나 박스 설명으로 원문에 없는 내용들을 많이 추가했습니다만, 그래도 처음 접하시는 분들은 다양한 기술이 나와서 혼란스러우실 수 있습니다. 하지만 본문에도 적었듯이, 모르는 내용이 나온다고 당황하지 마세요. 차차 알게 되실겁니다. node.js의 정체도 아직 본 스터디에서는 직접 언급하지 않았잖아요? :D (그런 내용은 오프라인 모임때 다룰 예정입니다.) 그리고 그냥 읽기만 하면 좀 더 어렵습니다. 자! Part 01. Part 01에서는 본 시리즈를 소개하고 Node 프로젝트에서 쓸 적당한 라이브러리를 선택에 대해 다뤘습니다. 준비물(Requirements) 본 프로젝트는 다음과 같은 라이브러리/제품이 필요합니다. - 동작하는 Node( node.js 인스톨) - MongoDB - npm 왜 이런 기술을 선택했는지는 마찬가지로 Part 01을 참고해주세요. Node 설치 Node.js가 설치되어 있지 않으면 다운로드(nodejs.org) 받아서 압축을 푸세요.
압축 푼 다음 해당 디렉터리에서 아래와 같이 실행 MacOS. [node.js 따라배우기 03] RESTful 메소드와 테스팅. - Part 1: 소개 (Introduction) - Part 2: 설치와 애플리케이션 뼈대 만들기(Installation and Skeleton App) 이번 파트에서는 지난 강좌의 뼈대만 있는 앱을 완성시켜볼 예정입니다.
간단한 Document 모델을 추가했었습니다. 이제 살을 조금 붙어봅시다. 이번 따라하기는 git 저장소에서 코드를 체크아웃 해서 진행합니다. (옮긴이 주)전체 실습의 단계별 코드들을 보고 싶으시면 다음 주소를 이용하시면 됩니다. 로깅(Logging) 자, 로깅을 추가해 봅시다. 환경에 따라서 로깅설정을 조금 고치는 게 좋습니다. CRUD((Create, Read, Update, Delete)기반의 RESTful API를 사용해서 HTTP 프로토콜로 문서(document) 접근 방식을 모델링 할 수 있습니다. - GET /documents <--문서 목록을 보여주는 인덱스(index) 메소드 - POST /documents/ <--새로운 문서 생성 - GET /documents/:id <--특정 문서 리턴 - PUT /documents/:id <--문서 업데이트 - DELETE /documents/:id <-- 문서 삭제 HTTP 메소드들은 중요합니다. HTTP 메소드가 중요합니다. 만약 이런 방식에 익숙하지 않다면, "HTTP 메소드(GET, POST, PUT…)가 중요하다"는 점만 기억해 주세요. 만약 동일한 URL로 POST 호출을 하는 폼(form)을 만들어 데이터를 보낸다면, Express는 에러를 뿌릴겁니다. 또한, 지난 번에 우리가 설정 옵션에 express.methodOverride를 추가했던걸 떠올려봅시다.
이런 식의 RESTful API사용 접근은 우아하지 못한 듯 보일 수 있지만, 이런 관례적 처리방식은 많은 웹 애플리케이션에서 장점을 가집니다. CRUD 스텁 참조 (CRUD Stub Reference) Express는 DELETE대신에 del을 사용하는 걸 눈여겨 봐주세요. 패턴: "/user/:id" URL 대상: /user/12 결론. [node.js 따라배우기 04] 템플릿, 파셜, 그리고 문서 생성과 수정. [node.js 따라배우기 05] 인증과 세션, 접근제어 미들웨어. 휴우~ 이번엔 조금 텀이 길었죠?
그래도 중간중간 많은 일들이 있었답니다. : ) 번역도 스터디 맴버분들과 함께 하기 시작했고요, 이런저런 도움도 많이 받고 있습니다. 그리고 꽤 기대해도 좋으실 자료가 곧 공개될 예정입니다. (두둥!) 참! 여러가지로 기대해 주세요! "Webapp을 만들어 봅시다! [node.js 따라배우기 06] 인터페이스 기본 (Interface Basics) Part 1: 소개 (Introduction) Part 2: 설치와 애플리케이션 뼈대 만들기 (Installation and Skeleton App) Part 3: RESTful 메소드와 테스트 (RESTful Methods and Testing) Part 4: 템플릿, 파셜, 그리고 문서 생성과 수정(Templates, Partials, Creating and Editing Documents) Part 5: 인증과 세션, 접근제어 미들웨어 (Authentication, Sessions, Access Control Middleware) 컴퓨터 시작 시 mongo 데몬이 자동으로 실행되는 것이 아니라면 이 튜터리얼을 시작하기 전에 실행시키기 바랍니다.
우리는 이전 파트에서 인증과 세션에 대해서 살펴봤습니다. 인터페이스 디자인 저는 앱을 개발하기 전 인터페이스를 설계할 때 보통은 개략적인 아이디어로 계획을 세웁니다. 저는 모눈종이와 샤프펜슬 그리고 좋은 지우개를 가지고 인터페이스에 대해 스케치하는 것을 좋아합니다. 간략히 스케치한 Nodepad는 다음 사항들을 제시하고 있습니다. 인터페이스는 마치 데스크탑의 어플리케이션처럼 두 개의 패널이 있고 하나는 노트의 목록을, 다른 하나는 노트의 내용을 위해서 사용됩니다.저장 버튼이 하단에 있긴 하지만 자동-저장 기능이 더 좋을 것입니다.노트를 한번 클릭하면 내용을 읽어오고, 더블-클릭하면 제목을 수정할 수 있게 합니다.이메일과 비밀번호를 변경하기 위해서 계정설정(account setting)이 필요합니다.우리는 이미 JSON을 지원하기 때문에 편집할 때 XMLHttpRequest를 사용할 수 있습니다. 속임수(Cheating) 인터페이스를 설계할 때 가장 중요한 것 중 하나는 가능한 많이 속이는 것입니다. 요즘은 CSS 프레임워크부터 Cappuccino 같은 무거운 GUI 프로젝트까지 사용 가능한 많은 솔루션들이 있습니다.
테마로는 Aristo (demo)를 사용하기로 결정했습니다. Aristo와 jQuery UI를 포함시키기 페이지 구조. [node.js 따라배우기 07] 노드 라이브러리 버전들, 제이드 트릭, 에러페이지 (Node Library Versions, Jade Tricks, Error Pages)