작년부터 자바스크립트를 조금씩 배워보고있는데 요즘 많이들 쓴다는 Next.js도 한번 배워놓아보려고 한다. Next.js는 React 기반이라 React에서 활용하던 문법을 사용할 수 있고, 풀스택 프레임워크라 프론트엔드와 백엔드를 하나의 프레임워크를 사용해서 짤 수 있는게 장점이다. 그리고 SSR(어디서 보기로는 CSR으로도 구현할 수 있다고 듣긴했는데 대부분 SSR로 활용하는 듯 하다)이기 때문에 초기 로딩 속도나 검색 노출(SEO 최적화)에 있어서 유리한 부분들이 있어 지금 회사에서도 FE의 프레임워크는 Next.js 기반으로 가져가려고 하는 듯 하다.  각설하고 Next.js를 사용하기 위한 설치 과정과 개발환경 세팅 방법을 간단하게 정리해두려고 한다. 1. Next.js 설치 방법Next.js를..

Terraform으로 AWS 인프라 배포 코드를 작성하는데 디렉토리별로 환경변수를 세팅할 수 있는 direnv라는 편리한 도구를 알게 되어서 간단히 사용법을 정리해두려 한다.  먼저 direnv를 설치한다. MacOS의 경우 brew를 통해 설치하면 된다. brew를 아직 설치하지 않은 경우는 이 링크를 참조하여 설치한 후 다음 명령어를 실행하면 된다.brew install direnv   direnv version을 실행하여 잘 설치되었는지 확인한다.$ direnv version2.35.0  direnv를 설치하고 나면, 환경변수를 설정하고 싶은 디렉토리로 이동한 후, .envrc 파일을 생성한 후 저장한다.vi .envrcexport   파일을 저장하면 다음과 같은 메시지가 터미널에 표시된다.dire..

1. 배경 상황회사 컴퓨터에서 VSCode가 갑자기 안열려서 급한대로 IntelliJ로 프로젝트를 편집하려고 했는데 아래처럼 처음보는 .idea라는 폴더가 추가되어있었다. 무지성 .gitignore에 추가하기 전에 무슨 역할을 하는지 찾아보고 정리해보았다.2. .idea 폴더란?.idea 폴더는 IntelliJ의 프로젝트별 세팅 파일을 보관하는 폴더로(JetBrain 공식 설명 참조), 해당 폴더 안의 파일이 없어도 프로젝트 코드는 정상 동작하고, 해당 설정값은 작업자 환경에 맞춰서 변경되기 때문에 git 리포지토리에 소스코드를 커밋할 때에는 해당 폴더는 제외하고 커밋을 하는 것이 좋다. 3. .idea를 git 저장소에 제외하는 방법(.gitignore).idea 폴더를 git commit에서 제외하기..

이전에 자바스크립트 강의 들으면서 code 명령어로 해당 경로 기준으로 VSCode를 열 수 있도록 세팅을 해놨었는데, 세팅 안된 PC에서 설정하려니 기억이 안나서 메모차 기록해두려고 한다. 초기 세팅 방법은 언제나 그렇듯 공식문서(https://code.visualstudio.com/docs/setup/mac)를 잘 찾아보면 나와있는데, VScode를 실행한 후, Cmd+Shift+P 단축키를 눌러 커맨드 팔레트를 연 후 아래처럼 shell command를 서치바에 검색하여 Shell Command: Install 'code' command in PATH 를 선택하면 자동으로 추가된다. 그리고 신규 $PATH 값이 저장될 수 있도록 터미널을 재기동한 후, 원하는 경로에서 아래 명령어를 실행하면 VSCo..