모바일 디자인 pc 디자인 패스트캠퍼스 100가지 시나리오로 학습하는 프론트엔드 강의 랜딩페이지에서 사용 중 ![](https://velog.velcdn.com/i

useEffect에서 처리를 했으나 useEffect는 렌더링 후 실행되기 때문에 페이지가 잠깐 나타났다 리다이렉트 되면서 사라지게된다. 이 때 깜빡임이 발생next.js 에서 제공하는 getServerSideProps(SSR) 함수 사용해서 서버 사이드에서 리다이렉트

첫 번째 글에서 경쟁력이 없어 보여 프로젝트를 엎기로 했다고 적었다. 그땐 그랬다.사실 팔리지 안 팔릴지는 시장에 내놓아봐야 알 수 있는 건데 그땐 자신이 없었나 보다. 서버를 만들고 있던 중이긴 했다. 그것도 중단됐었지만.첩첩산중인 느낌이었다. 자신이 없는데 할 일은

청첩장에 계좌번호를 복사하는 버튼이 있는데 해당 기능이 동작하지 않는 이슈가 있었다.안드로이드 카카오톡 인앱 브라우저에서만 발생하는 이슈였다.카카오톡 데브톡 사이트에도 해당 이슈가 언급되어있다.안드로이드 카톡 인앱브라우저에서 복사하기 버튼이 동작하지 않는 문제아래 참고

청첩장 고객님께 문의가 들어왔다. 일부 지인들의 핸드폰에서는 사이트가 뜨지 않는다는 것이다. 그러면서 화면을 캡처해서 보여주셨는데 이런 문구가 있었다. Next.js에서 띄운 메시지인데 클라이언트 측 오류로 브라우저 콘솔을 확인하라는 것이다. 하지만 모바일에서는 브라

문제 위 gif를 보면 새로고침해서 로딩중에 왼쪽 위에 나타나는 버튼이 있다. 이는 아래쪽에 있는 파란색 챗봇 버튼이다. 아주아주 UX적으로 마음에 안드니까 수정해야한다. 이유 새로고침하면 저렇게 나타나는 이유는 SSR을 사용하고 있기 때문이다. next.js는

탭스페이스 사이트는 vercel에서 배포했다. 굉장히 배포하기 쉽게 되어있었고 ci/cd까지 기본으로 제공해서 개발할 때 되게 편리했다. 이 글은 프로젝트 기간이 끝나고 버그를 수정하며 진행하던 개발 사이클에서 문제가 느껴져 개선한 이야기이다. 문제 이번 프로젝트

탭스페이스 프로젝트를 구현할 때 시간에 치여 어떻게든 발표날까지 구현해야 한다!!!!!라는 생각으로 하다 보니 문제가 있음에도 일단 구현한 부분들을 하나씩 개선해보는 중이다.탭스페이스 사이트는 홍보용 랜딩페이지가 있기 때문에 seo가 중요함에도 seo를 위해 next.

프로세스가 컴퓨터에서 동작하는 방식에 영향을 미치는 동적인 값들의 모임다양한 환경에 한 프로젝트를 배포하게 되는데 어느 환경에 배포하느냐에 따라서 다르게 설정되어야하는 값들이 있다. 이런 값들은 운영 체제 수준에서 환경 변수를 통해 관리하게 된다.또 데이터베이스의 비밀

node.js의 패키지 관리자이다. 개발자들이 만든 패키지를 npm 저장소에 올리면 패키지 관리자를 통해 설치, 삭제, 패키지 버전 관리, 의존성 관리가 가능하다.페이스북이 만든 패키지 관리자이다. npm 저장소를 동일하게 사용하지만 npm보다 속도나 안정성 측면이 향

인스턴스 생성하는 방법은 구글에 많으니 생략루트 계정은 우리가 흔히 아는 그 최상위 계정을 말한다. 이 계정이 해킹 당하면 아주아주 큰일 나니까 쓰지 않는 것을 AWS도 공식적으로 추천한다.AWS Identity and Access Mansgement그래서 제어된 권한

공식문서에서 state의 비동기 참고자료 리액트의 setState()제대로 사용하기

코드스쿼드를 수료했다.2022 코드스쿼드 마스터즈 2달 회고2022 코드스쿼드 프론트엔드 과정 수료 후 회고멘탈이 바스러지는 시기를 겪었다.난 지난 3개월 동안 뭘 했는가씬쿵 프로젝트가 중단되려 할 때쯤 유데미 부트캠프(인턴)에 프론트가 떠서 지원했다. 유데미를 지원할

API > API란 무엇인가요? API는 정의 및 프로토콜 집합을 사용하여 두 소프트웨어 구성 요소가 서로 통신할 수 있게 하는 메커니즘입니다. 예를 들어, 기상청의 소프트웨어 시스템에는 일일 기상 데이터가 들어 있습니다. 휴대폰의 날씨 앱은 API를 통해 이 시스템과

브라우저의 렌더링 언젠이 HTML문서를 파싱해서 브라우저가 이해할 수 있는 자료구조\[자바스크립트 딥 다이브]문서 객체 모델(The Document Object Model, 이하 DOM) 은 HTML, XML 문서의 프로그래밍 interface 이다.\[MDN - DO

영화 목록을 보여주는 페이지가 있고, 목록 중 하나를 클릭하면 해당 영화의 디테일 페이지를 보여주는 사이트영화 목록 컴포넌트 : MovieList영화 목록 아이템 컴포넌트 : Movie영화 디테일 페이지 컴포넌트 : MovieDetail라우터를 만드는 게 목표니까 Ro

typeof NaN === 'number'not a number 라서 number 타입임