아카이브: 2019

React에서 Font Awesome 사용하기

Font Awesome 이란?Font Awesome은 웹페이지에서 소개된 바와 같이 인기있는 아이콘 세트 및 툴킷이라고 합니다. svg로 된 아이콘을 무료로 제공하여 사용 할 수 있습니다. react-fontawesome패키지를 이용하겠습니다. 설정방법1npm i --save @fortawesome/fontawesome-svg-core @fortawes

create-react-app에서 Typescript로 개발하기

create-react-app이란?React앱을 간편하게 만들 수 있도록 자동으로 빌드해주는 모듈입니다.이 패키지 모듈을 이용하면 Webpack이나 Babel을 설치하고 셋팅하는 복잡한 과정을 생략 할 수 있습니다.Typescript를 이용한 create-react-app 설정방법에 대해 설명드리도록 하겠습니다. Typescript란?설정 방법 이전에

Docker Hub와 Github 연결하기

Docker Hub와 Githubdocker에는 docker Hub라는 저장소가 있습니다. Github처럼 원격저장소로 사용 할 수 있는 저장소입니다. Github로 코드를 푸쉬하게 되면 docker에서 컨테이너를 생성이 가능합니다. 컨테이너를 푸쉬와 동시에 생성을 하기 위해선 Github와의 연동이 필요합니다. 연동 방법Docker-Hub사이트에서 로그인

AWS Certificate Manager

AWS Certificate Manager를 이용하여 무료 인증서 발급기존에 저는 letsencrypt를 사용했는데 사용 할 때 가장 큰 문제점이 3개월마다 갱신을 해줘야 했습니다. 3개월 주기로 갱신을 해주면 상관없지만 갱신을 못 하게 되면 인증이 풀리는 경우가 생겼습니다. 인증서 만료가 되면 사이트 접속 시 빨간글씨로 이 사이트는 안전하지 않습니다.라는

javascript 빈 객체 체크 (check empty object)

javascript check empty object자바스크립트에서 빈 객체를 체크하려는 경우 null로 체크 할 수 없습니다. 따라서 별도의 함수를 생성하여 체크하는 방법을 설명드리겠습니다. 함수 생성 방법1234567const obj = {};const arr = [];function isEmpty(param) { retur

Webstorm에 console.log shortcut 추가하기

javascript언어를 사용하는 개발자들은 console.log()를 매우 자주 사용 합니다. webstorm기본 단축어가 있긴 하지만 안타깝게도 console.log()는 없어서 추가하는 방법을 공유하겠습니다. 추가 방법webstorm실행 후 Preferences로 이동합니다. command + ,로 간단히 설정창을 열 수 있습니다.Editor >

Comparison Operator (비교 연산자)

비교연산자란?비교연산자란 좌항과 우항의 값을 비교하여 Boolean값 즉, true, false를 반환합니다. javascript는 엄격한 비교(===)와 형변환 비교(==)와 같이 두가지의 비교 연산자를 갖고 있습니다. 동등 연산자 (==)동등 연산자는 좌항과 우항을 비교 할 때 서로 타입이 다르면 같은 타입을 일치시키고 같은 값인지 비교합니다. 따라서

Error: Fatal: in unpopulated submodule .deploy_git

Error: Fatal: in unpopulated submodule .deploy_git저는 블로그 소스파일을 깃 private 레포지토리에 올려놓습니다. 오랜만에 블로그 글을 게시하기 위해 레포지토리에서 내려받고 배포하려는데 에러가 발생하였습니다. 따라서 에러 해결방법에 대해 포스팅하겠습니다. 해결 방법1rm -rf .deploy_git 배포하려는 폴더

hexo utterances 댓글 추가

utterances를 이용하여 댓글 기능 추가페이스북 댓글 기능을 사용하였는데 댓글이 달려도 알람이 오지 않아 답변을 남기기 힘들었습니다. 따라서 댓글 알림기능을 찾다가 utterances라는 오픈소스에 대해 알게되었고 이 기능을 추가하면서 추가하는 방법에 대해 설명해보려고 합니다. utterances는 깃 레포지토리에 이슈 생성하고 댓글로 보여주는 기능입

s3와 lambda를 이용하여 이미지 리사이징 서버 만들기

aws lambda를 이용하여 이미지 리사이징 서버 만들기aws에 Lambda라는 서버리스 기능을 이용하여 이미지 리사이징 서버를 만들어보겠습니다. S3에 이미지 원본과 썸네일을 한번에 저장하게 되면 저장소 용량을 많이 사용하게 됩니다. 따라서 원본만 S3에 저장하고 나머지 썸네일 이미지는 Lambda와 CloudFront, Lambda@Edge를 이용하여