Develop
AWS Route 53 Adress Record 생성
저는 외부 도메인을 구매하여 이용하였습니다. https://www.hosting.kr/ 호스팅케이알(HK) KISA 고객만족도 최다 선정, 도메인 최저가 제공, 기업/공공도메인, 도메인연결/웹호스팅 무료, 서버, 아마존클라우드(AWS), G Suite, 홈페이지제작 1644-7378 www.hosting.kr aws DNS가 좀 더 가격이 나가서 해당 사이트 DNS를 구입하였습니다. 1. 호스팅 생성 그럼 AWS Route 53 에 접속해봅시다. 호스팅 영역에 들어가 생성을 눌러줍시다. 도메인 이름에 DNS를 입력 후 생성해줍시다. 2. 네임서버 주소 변경 NS 유형에 4개의 주소 값이 생성되었습니다. 해당 주소는 도메인을 등록한 서비스에 접속하여 네임서버를 위에 ..
AWS Load Balancer (ELB) 생성
Load Balancing? 하나의 인터넷 서비스가 발생하는 트래픽이 많을 때 여러 대의 서버가 분산처리하여 서버의 로드율 증가, 부하량, 속도저하 등을 고려하여 적절히 분산처리하여 해결해주는 서비스입니다. EC2 서버를 구축할 때 Auto Scailing 서비스 만을 이용했었는데 최근 외주를 하면서 로드 밸런서 이야기가 나와 사용하였습니다. AWS 내에 Load Balancer 서비스가 존재합니다. 아래 사이트에서 AWS Load Balancer 서비스 내용을 확인하실 수 있습니다. https://docs.aws.amazon.com/elasticloadbalancing/latest/userguide/what-is-load-balancing.html https://docs.aws.amazon.co..
AWS EC2에 AWS RDS를 연동해보자
AWS RDS를 이용하여 MySQL 데이터베이스를 연결해보겠습니다. RDS내의 MySQL 장점을 찾아본다면 · Storage & IOPS 쉽게 확장이 가능합니다. · 백업을 신경 쓸 필요가 없습니다. (스냅샷으로 백업이 가능합니다.) · Auto Failover 가능합니다. · Multi AZ (DB 인스턴스를 다중 AZ 배포로 실행할 수 있습니다.)가 가능합니다. 1. AWS EC2 내의 DB보안 그룹 설정하기 자신의 AWS EC2 내의 VPC ID를 확인합니다. 현재 저의 인스턴스 보안 그룹은 launch-wizard-2 입니다. 인스턴스 보안 그룹을 선택 후 [보안 그룹 생성]을 눌러 생성합니다. 보안 그룹 이름과 설명을 입력한 후, 인바운드 유형을 MySQL을 선택하면 자동적으로 포..
Vue 애플리케이션 구현 심화편
이전 글에서 삭제할 때 List.vue와 Footer.vue가 연결되지 않아 삭제할 때 List Data가 삭제되지 않았습니다. 같은 데이터 속성을 사용하기 위해 최상위 컴포넌트인 App 컴포넌트에 Data를 정의하고, 하위 컴포넌트에 props로 전달하면 됩니다. props와 이벤트 전달 최상위 컴포넌트에 이전 글에 선언했던 Data를 구성해야합니다. ... export default { data() { return { ItemLists: [] } } ... } App.vue에 data() 속성을 선언 후, 이전 List.vue에는 props로 전달해야 합니다. List 컴포넌트의 propsdata 속성에 props로 전달하였습니다. export default { props: ['propsd..
Vue 애플리케이션 만들기
프로젝트 초기 설정 반응형 웹 디자인 태그를 설정해봅시다. 반응형 웹 디자인은 하나의 웹 사이트로 다양한 기기에서 깨지지 않고 자연스럽게 레이아웃을 제공해줍니다. //index.html File width=device-width 속성은 기기 너비만큼 웹 페이지의 너비를 지정하는 의미입니다. 아이콘과 폰트 파비콘 등 head 라인에서 추가할 수 있습니다. 저는 구그 폰트와 어썸 아이콘, 파비콘을 아래와 같이 추가하였습니다. 컴포넌트 생성 src 폴더 내의 components 폴더에 vue파일을 만들어줍니다. 저는 Header.vue, Input.vue, List.Vue, Footer.vue를 생성하였습니다. 컴포넌튼는 src/components 폴더에서 관리합니다. 또한 해당 폴더 내의 여러..
Vue 프로젝트 구성
싱글 파일 컴포넌트 체계 .vue 파일로 프로젝트 구조를 구성하는 방식입니다. 그럼 vue 파일을 작성해봅시다. {{ message }} 보시면 template, script, style 구조로 되어있습니다. https://blog.naver.com/rile1036/221690277816 mac 맥에서 Vue.js 설치해보자 최근에 장고 공부하면서 글을 올리다가 vuex 관련 공부를 해보고 싶어 정리겸 올리게 되었습니다.Vue.js... blog.naver.com 만약 nvm 부터 설치를 원하시면 제가 이전 네이버 블로그에 설치법을 작성하였습니다. 위의 사이트를 클릭하셔서 차례대로 진행하시면 됩니다. Vue CLI 위의 싱글 파일 컴포넌트를 일용하기 위해서는 .vue파일을 인식할 수 있도록 ..