[Vercel] Vercel로 Next.js 14 프로젝트를 배포해 보자 🎉
·
개발/Vercel
1. 개요구름톤 파이널 프로젝트를 진행하다 중간 발표를 위해 프론트엔드 배포를 진행해야 하는 상황이었다. 아직 기능 연결이 된 건 없지만 적어도 진행 상황을 알려 줄 수 있는 화면 정도는 필요했기 때문에 급하게 next.js와 친화적인 vercel로 배포를 결정했다. 2. Vercel1. GitHub Repository 선택 (개인 Repository로 Fork)vercel을 가입하고 마주하는 첫 화면은 GitHub Repository를 불러오라는 화면일 텐데, 여기에서 배포하고자 하는 Repository를 선택해 주면 된다. 단, 조직의 경우에는 pro plan을 사용해야 하므로 무료로 이용하고 싶다면 조직 내의 repository를 개인 repository로 fork해서 배포해야 한다. 1-1. 개인..
[컴포노트] Tanstack query 쿼리 자동 실행 막기 (useInfiniteQuery)
·
개발/Tanstack Query
1. 개요사건의 전말은 이렇다. 2차 데모 데이까지 5일도 남지 않은 상태에서 겨우 모든 컴포넌트 구현을 끝내고 기능 구현에 들어갔다. 프론트엔드 개발자 두 명이서 당장 MVP 기능 API 연결을 모두 완료해야 하는 상황이었는데, 시간이 시간이다보니 깔끔하고 좋은 코드를 작성할 여유조차 없었다. 그렇게 데모 데이 날이 되고, 스터디에 계신 모든 직군 분들이 우리 서비스를 테스트해 보시는데 아래와 같은 에러가 반복해서 표시됐다.사실 간절하게 바란 건 아무도 개발자 도구를 켜 보지 않는 것이었는데, 예리하신 개발자 분들이 처음 서비스를 들어가실 때부터 개발자 도구를 켜고 들어가시더라. (당연함나였어도그랬을거니까) 성능 및 UI/UX 이슈도 당연히 있었지만 당장 문제가 가장 커 보이는 것은 바로 검색 기능이었..
[Nginx] Nginx 설치 오류 - A high performance web server and a reverse proxy server
·
개발/Nginx
1. 개요NCP 서버에 접속해 배포를 마치고, 포트포워딩을 진행하는 과정에서 nginx를 설치하다 아래와 같은 오류가 발생했다. A high performance web server and a reverse proxy server를 검색해도 에러 종류가 여러 가지라 에러 로그를 필수적으로 확인해야 했다. 🥲> sudo apt install nginx2. 원인 파악에러 로그를 확인하기 위해 error.log 파일의 위치를 추적했다. 로그 파일을 읽어 보니 IPv6을 지원하지 않는 우분투 서버에서 IPv6 address인 [::]:80 사용을 시도하고 있어서 발생한 에러였다. 😱 설치 직전부터 이러는 이유는 nginx 설치 시 기본적으로 작성되는 /etc/nginx/sites-available/defau..