Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Meteor Korea DEV School 2nd day 
특별한 Meteor 의 디렉토리
발표자 소개 
- 박승현 
- ppillip@gmail.com 
- http://digveloper.ppillip.com
특별한 Meteor 의 디렉토리 
1. 프로젝트 생성 
2. 폴더구조 
3. 로딩 
4. 추천하는 폴더구조
특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 
1. 설치합니다. 
- 서버로 부터 화일들을 다운로드 받아 설치 됩니다. 
- 우리는 따로 node 나 mongodb 를 설치 하지 않습니다.
특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 
2. 프로젝트를 생성합니다. 
- 프로젝트명(myProject)의 폴더가 자동생성됩니다. 
- 생성후 간단한 안내 메세지가 표시됩니다.
특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 
3. 프로젝트 폴더로 이동후 실행합니다.
특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 
4. 브라우저로 접속해봅니다 - http://localhost:3000/
특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 
5. 몽고디비에도 접속해봅니다.
특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 
5. 몽고디비에도 접속해봅니다. (robomongo)
특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 
5. 몽고디비에도 접속해봅니다. (robomongo)
특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 
5. 몽고디비에도 접속해봅니다.
특별한 Meteor 의 디렉토리 
1. 프로젝트 생성 
2. 폴더구조 
3. 로딩 
4. 추천하는 폴더구조
특별한 Meteor 의 디렉토리 – 2. 폴더구조 
1. 기본 폴더 및 화일은 그림과 같습니다.
특별한 Meteor 의 디렉토리 – 2. 폴더구조 
2. 다음과 같이 폴더를 생성합니다. 
- client(브라우저) 상에서 구동될 소스가 위치할 곳입니다. 
미티어가 오로지 클라이언트 소스로 인식합니다 
- html ...
특별한 Meteor 의 디렉토리 – 2. 폴더구조 
2. 다음과 같이 폴더를 생성합니다. 
- 클라이언트와 서버쪽 모두 동작할 화일들을 위치합니다. 
예) 각종 유틸, collection 정의된 화일, 공통 method...
특별한 Meteor 의 디렉토리 – 2. 폴더구조 
2. 다음과 같이 폴더를 생성합니다. 
- 서버쪽에서만 사용될 리소스들을 넣어 둘수 있습니다. 
- Assets API 를 통해서 접근 할수 있습니다.
특별한 Meteor 의 디렉토리 – 2. 폴더구조 
2. 다음과 같이 폴더를 생성합니다. 
- public 폴더는 url 에서 “/” 로 서비스 합니다. 
- favicon.ico, robots.txt 화일들을 저장하기...
특별한 Meteor 의 디렉토리 – 2. 폴더구조 
2. 다음과 같이 폴더를 생성합니다. 
- server 측 프로그램들이 위치합니다 
- publish 가 선언된 서버측 화일을 위치합니다. 
- 서버측 mehod 가 ...
특별한 Meteor 의 디렉토리 
1. 프로젝트 생성 
2. 폴더구조 
3. 로딩 
4. 추천하는 폴더구조
특별한 Meteor 의 디렉토리 - 로딩 
- 개발시에 순서에 민감한 코드들은 packages 폴더를 
이용하거나 Meteor.startup(서버,클라이언트 모두)를 
사용하여 코드를 작성할 것을 추천합니다. 
그러면 ...
특별한 Meteor 의 디렉토리 - 로딩 
1. 하위 디렉토리의 파일을 먼저 로딩합니다. (루트는 마지막) 
2. 같은 위치의 파일과 폴더는 alphabetical order 를 따릅니다. 
3. alphabetical...
특별한 Meteor 의 디렉토리 
1. 프로젝트 생성 
2. 폴더구조 
3. 로딩 
4. 추천하는 폴더구조
특별한 Meteor 의 디렉토리 - 추천하는 폴더구조 
1. 루트레벨폴더 
customer/lib/ # 사용자 관련 
customer/client/ 
customer/server/ 
posts/lib/ # 포스트 관련 ...
특별한 Meteor 의 디렉토리 - 추천하는 폴더구조 
4. 저요? 
/server – method.js , method4angular.js , router.js , publish.js 
/client – 매뉴별로 폴더...
- 질 문 
- 실 습
Upcoming SlideShare
Loading in …5
×

1. 미티어의 폴더구조

7,499 views

Published on

미티어 폴더의 구조에 대한 설명입니다.

Published in: Technology
  • Be the first to comment

1. 미티어의 폴더구조

  1. 1. Meteor Korea DEV School 2nd day 특별한 Meteor 의 디렉토리
  2. 2. 발표자 소개 - 박승현 - ppillip@gmail.com - http://digveloper.ppillip.com
  3. 3. 특별한 Meteor 의 디렉토리 1. 프로젝트 생성 2. 폴더구조 3. 로딩 4. 추천하는 폴더구조
  4. 4. 특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 1. 설치합니다. - 서버로 부터 화일들을 다운로드 받아 설치 됩니다. - 우리는 따로 node 나 mongodb 를 설치 하지 않습니다.
  5. 5. 특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 2. 프로젝트를 생성합니다. - 프로젝트명(myProject)의 폴더가 자동생성됩니다. - 생성후 간단한 안내 메세지가 표시됩니다.
  6. 6. 특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 3. 프로젝트 폴더로 이동후 실행합니다.
  7. 7. 특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 4. 브라우저로 접속해봅니다 - http://localhost:3000/
  8. 8. 특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 5. 몽고디비에도 접속해봅니다.
  9. 9. 특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 5. 몽고디비에도 접속해봅니다. (robomongo)
  10. 10. 특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 5. 몽고디비에도 접속해봅니다. (robomongo)
  11. 11. 특별한 Meteor 의 디렉토리 – 1. 프로젝트 생성 5. 몽고디비에도 접속해봅니다.
  12. 12. 특별한 Meteor 의 디렉토리 1. 프로젝트 생성 2. 폴더구조 3. 로딩 4. 추천하는 폴더구조
  13. 13. 특별한 Meteor 의 디렉토리 – 2. 폴더구조 1. 기본 폴더 및 화일은 그림과 같습니다.
  14. 14. 특별한 Meteor 의 디렉토리 – 2. 폴더구조 2. 다음과 같이 폴더를 생성합니다. - client(브라우저) 상에서 구동될 소스가 위치할 곳입니다. 미티어가 오로지 클라이언트 소스로 인식합니다 - html , css , javascript 화일들이 위치합니다. - if (Meteor.isClient) { ... } 과 같이 동작합니다.
  15. 15. 특별한 Meteor 의 디렉토리 – 2. 폴더구조 2. 다음과 같이 폴더를 생성합니다. - 클라이언트와 서버쪽 모두 동작할 화일들을 위치합니다. 예) 각종 유틸, collection 정의된 화일, 공통 method 들 ** model 이란 폴더는 임의로 정한 폴더임 Meteor.isClient 와 Meteor.isServer 모두 사용가능함
  16. 16. 특별한 Meteor 의 디렉토리 – 2. 폴더구조 2. 다음과 같이 폴더를 생성합니다. - 서버쪽에서만 사용될 리소스들을 넣어 둘수 있습니다. - Assets API 를 통해서 접근 할수 있습니다.
  17. 17. 특별한 Meteor 의 디렉토리 – 2. 폴더구조 2. 다음과 같이 폴더를 생성합니다. - public 폴더는 url 에서 “/” 로 서비스 합니다. - favicon.ico, robots.txt 화일들을 저장하기에 적합합니다. - meteor 이전에 client 사이드 화일을 재활용할수 있습니다. 예) rest 처리하던 jQuery 사이트 , angularjs 사이트
  18. 18. 특별한 Meteor 의 디렉토리 – 2. 폴더구조 2. 다음과 같이 폴더를 생성합니다. - server 측 프로그램들이 위치합니다 - publish 가 선언된 서버측 화일을 위치합니다. - 서버측 mehod 가 구현된 파일을 저장합니다. - if (Meteor.isServer) { ... } 과 같이 동작합니다.
  19. 19. 특별한 Meteor 의 디렉토리 1. 프로젝트 생성 2. 폴더구조 3. 로딩 4. 추천하는 폴더구조
  20. 20. 특별한 Meteor 의 디렉토리 - 로딩 - 개발시에 순서에 민감한 코드들은 packages 폴더를 이용하거나 Meteor.startup(서버,클라이언트 모두)를 사용하여 코드를 작성할 것을 추천합니다. 그러면 meteor 가 의존성 및 민감성을 관리 해줍니다 :) - grunt.js 같은 의존성 관리를 app 개발자가 직접 하지 않습니다. :) - 부득이하게 로딩 순서가 중요할 경우에만 참조합니다.:) (그런경우가 거의 없음!) (다음)
  21. 21. 특별한 Meteor 의 디렉토리 - 로딩 1. 하위 디렉토리의 파일을 먼저 로딩합니다. (루트는 마지막) 2. 같은 위치의 파일과 폴더는 alphabetical order 를 따릅니다. 3. alphabetical order 로딩후에 lib 디렉토리를 로딩합니다. 4. main.* 화일은 제일 마지막에 로딩됩니다. ** 일반적인 경우는 1~4까지를 고민할 일이 없습니다. # 결론 : “미티어는 빌드 할때 나름 rule 을 가지고 있구나” 를 알게 되었다 !
  22. 22. 특별한 Meteor 의 디렉토리 1. 프로젝트 생성 2. 폴더구조 3. 로딩 4. 추천하는 폴더구조
  23. 23. 특별한 Meteor 의 디렉토리 - 추천하는 폴더구조 1. 루트레벨폴더 customer/lib/ # 사용자 관련 customer/client/ customer/server/ posts/lib/ # 포스트 관련 posts/client/ posts/server/ 2. 폴더안에 서버 클라이언트 구분 lib/customer/ lib/posts/ client/customer/ client/posts/ server/customer/ server/posts/ 3. 패키지로 관리 하기 # 결론 # 미티어는 프로젝트 중간에 파일명, 폴더명 변경가능 자신에 맞는 폴더로 추후에 정리 가능 :)
  24. 24. 특별한 Meteor 의 디렉토리 - 추천하는 폴더구조 4. 저요? /server – method.js , method4angular.js , router.js , publish.js /client – 매뉴별로 폴더를 정하고 폴더안에 a.html,a.js 로 한쌍씩 넣었습니다. /public – angularjs 소스 파일 (meteor 로 넘어 바꾸기전 소스들) /model - 기본 collection api만을 사용한 코드. asser.js , schema.js , util.js 등등
  25. 25. - 질 문 - 실 습

×