프로젝트 시작시 도움을 줄 수 있는 Cookiecutter

소개

: pip 라이브러리로 cookiecutter라는게 있다.

(cookiecutter에 대한 내용 https://github.com/audreyr/cookiecutter)

django와 vue로 초기 설정을 할 때, 해당 라이브러리(https://github.com/vchaptsev/cookiecutter-django-vue)를 이용하여 설정을 해보려고 한다.

(해당 라이브러리는 cookiecutter를 base로하여 django와 vue를 사용할 수 있도록 설정하는 라이브러리다.)

순서

1. cookiecutter를 설치한다. (pip install cookiecutter)
2. cookiecutter url을 이용하여 원하는 라이브러리를 불러온다.
   1. ex) cookiecutter gh:vchaptsev/cookiecutter-django-vue
3. 아래와 같이 기본적인 설정(프로젝트 이름, 설명 등...)을 할 수 있다.
   
4. 위의 라이브러리는 기본 베이스가 docker-compose로 되어있다.
5. docker-compose up 을 하면 기본적인 3가지의 이미지(nginx, vue, django)가 다운받아지고 3개의 컨테이너가 생긴다.
6. 컨테이너가 생성되면서 각각의 컨테이너는 해당되는 command를 실행하고 다음과 같은 화면이 생긴다.
   
7. 최종적으로 다음과 같은 화면이 뜨면 완료.
   

배포:

아키텍처:

S3로 Static 서버 서비스 하기

: https://docs.aws.amazon.com/ko_kr/AmazonS3/latest/dev/HostingWebsiteOnS3Setup.html

S3에 업로드 하는 방법

1. npm 이 설치된 폴더로 가서 npm run build를 한다.
   
2. 빌드된 파일들이 dist 폴더에 생긴다.
   
3. 해당 파일들을 S3로 업로드한다.
   1. 많은 방법들이 있겠지만 AWS CLI를 사용하는걸 추천한다. (https://docs.aws.amazon.com/cli/index.html#lang/ko_kr)
      ex) aws s3 sync [localPath] [S3Uri]
      
4. 다음과 같은 url에 접속(http://bucket-name.s3-website-region.amazonaws.com)하면 위와 동일한 화면을 볼 수 있다.
   (아래의 화면은 cloudfront로 연결한 화면)