profile
디자인하는 프론트개발자
post-thumbnail

Nuxt.js vs Vue.js - SSR 시작하기

Nuxt.js는 Vue를 바탕으로 서버사이드 렌더링 어플리케이션을 만들기 위한 라이브러리입니다. Vue 프로젝트의 구조를 바탕으로 Nuxt.js를 사용해 보기 위해 기존 코드와의 차이점을 비교하며 정리 해 봅니다.

2020년 4월 28일
·
3개의 댓글
post-thumbnail

Vue.js Mixin: 기능 캡슐화하기

Vue.js의 Mixin을 이용해서 좀 더 멋진 코드를 만드는 방법을 알아 봅시다!

2020년 4월 23일
·
0개의 댓글
post-thumbnail

JetBrain Reformatter와 ESLint 맞추기

WebStorm, PyCharm 등 JetBrain사의 IDE 세팅을 커스텀해서 Auto Reformatter와 ESLint가 싸우지 않도록 만들어 봅시다.

2020년 4월 20일
·
0개의 댓글
post-thumbnail

Vue.js에 Google Analytics 붙이기

Vue.js를 이용해 만든 소중한 프로젝트에 GA를 붙여 누가 들어오는지 트래킹 해 봅시다 🥰 최근 4개월 정도 진행해 마무리한 작은 프로젝트를 배포하게 되면서, 마케터들의 요청을 받아 Google Analytics를 붙이고 있습니다. 처음에는 빌드된 파일에 정적인

2020년 4월 20일
·
0개의 댓글
post-thumbnail

Github Actions으로 배포 자동화하기

본 포스트는 Github Action을 이용해서 특정 브랜치를 실시간으로 감시하고, 변동이 생겼을 때 자동으로 AWS에 푸시할 수 있는 파이프라인을 구축하는 글입니다. AWS IAM의 간단한 개념과 S3를 통해 정적인 배포를 할 줄 아시는 분에게 적합합니다.

2020년 4월 6일
·
4개의 댓글
post-thumbnail

S3, ACM, CloudFront, Route53으로 서버리스 페이지 https 배포하기 [4/4]

여기까지 오셨다면 CloudFront를 통해서 SSL 인증서가 붙은 S3 버킷 정적 호스팅의 배포 설정이 준비된 상태입니다. 마지막으로 도메인을 배포 설정에 연결해 주면 목표를 이룰 수 있습니다. 마지막은 쉬워요!Route53으로 대시보드에서 사용할 도메인 이름을 눌러

2020년 3월 31일
·
2개의 댓글
post-thumbnail

S3, ACM, CloudFront, Route53으로 서버리스 페이지 https 배포하기 [3/4]

이제 S3에서 정적 호스팅하고 있는 페이지를 CloudFront를 통해 뿌려줄 차례입니다. 지역에 상관없이 원활하게 컨텐츠를 제공하고, ACM에서 만든 SSL 인증서를 붙이기 위해서 하는 작업이랍니다.CloudFront는 AWS에서 제공하는 CDN(Contents De

2020년 3월 31일
·
0개의 댓글
post-thumbnail

S3, ACM, CloudFront, Route53으로 서버리스 페이지 https 배포하기 [2/4]

이제 우리의 소중한🥰 프로젝트에 맘에 드는 도메인을 연결하기 위해, 구매해 둔 도메인을 ACM(Amazon Certification Manager)를 통해 AWS에서 사용할 수 있도록 셋업 할 차례에요!연결하고 싶은 도메인이 있다면 해당 도메인을 구매하여야 합니다.

2020년 3월 31일
·
0개의 댓글
post-thumbnail

S3, ACM, CloudFront, Route53으로 서버리스 페이지 https 배포하기 [1/4]

프로젝트 구현 및 배포용 빌드본인이 배포하고 싶은 프로젝트를 준비합니다. 프로젝트 자체의 구현은 본 글에서 다루는 내용이 아니므로 배포를 위한 빌드가 완료되었다고 가정하고 넘어가겠습니다.처음 배포해 보는 뷰린이를 위한 사족!프로젝트 루트에서 yarn build나 npm

2020년 3월 31일
·
2개의 댓글
post-thumbnail

S3, ACM, CloudFront, Route53으로 서버리스 페이지 https 배포하기 [Intro]

아직 AWS에 익숙하지 않은 프론트엔드 개발자가처음부터 차근차근 따라해서자신이 소유한 도메인에 https를 붙여 배포하는과정을 상세히 작성한 시리즈입니다.

2020년 3월 31일
·
0개의 댓글
post-thumbnail

Anime.js 사용하기

Vue.js 프로젝트에서 애니메이션의 손쉬운 구현을 위해 Pure JavaScript Library인 Anime.js 라이브러리를 사용하는 방법에 대해서 알아봅니다. 다양한 기능이 있지만 단일 DOM 객체를 움직이는 기능을 중점적으로 서술하였습니다.

2020년 3월 19일
·
0개의 댓글
post-thumbnail

Vue 3 변경점 정리: 무엇이 바뀌나요?

해당 글은 레퍼런스에 작성된 몇 개의 원문에서 중요한 내용들을 바탕으로 작성한 글입니다. Vue3 의 베타버전으로 어플리케이션을 제작해 보고 싶은 경우, 튜토리얼에 소개된 셋업을 따라 시작해볼 수 있습니다.

2020년 3월 19일
·
8개의 댓글