본문 바로가기

전체 글163

[Next.js]supabase Realtime을 이용한 채팅 기능 supabase Realtime이 프로젝트 진행 중 필요해졌다. 아무도 아는 이가 없어, 한번 파보고 시도해보고자 포스팅을 작성하게 되었다. -- 포스팅 작성 진행 중 2024. 10. 24.
[Next.js]Supabase CLI로 각 테이블에 맞는 타입 생성 feat. More simple 저번 시간에는 Supabase에서 TypeScript에 적용할 수 있는 타입을 추출할 수 있도록 cli로 supabase cli를 설치 및 로그인 후 데이터베이스와 관련된 타입을 파일로 얻어오는 것을 확인했다.해당 사항 진행 중에 더 다른 쉬운 방법도 알게되어, 공유하고자 포스팅을 작성합니다. 1. Supabase Dashboard로 들어와서 위와 같은 경로를 따라, Generate and download types를 눌러준다.2. 해당 Action은 cli환경에서 굳이 설정하지 않아도, supabase web에서 데이터베이스의 type을 typescript에서 만들 수 있도록 도와준다. 3. 전 글과 같이 Import하여 사용하면 된다. 2024. 10. 23.
[Next.js]Supabase CLI로 각 테이블에 맞는 타입 생성 프로젝트를 진행하는 도중 supabase의 type을 쉽게 꺼내는 방법이 있다고 팀원분께서 말씀해주셔서 해당 사항을 토대로 포스팅을 작성해보도록 한다. 해당 사항은 Supabase Docs에서도 확인이 가능한 사항이다. [Generating TypeScript Types]https://supabase.com/docs/guides/api/rest/generating-types1. yarn add supabase --dev-supabase cli를 프로젝트에 설치2. yarn supabase login-supabase cli를 통해 supabase 계정에 로그인하는 과정 3. project의 아이디가 필요하다. project 아이디는 supabase 프로젝트를 생성했을 때 대쉬보드에 접근하면 url에서 얻을.. 2024. 10. 23.
Test Code에 관하여. 1. Frontend 관점에서의 Test의 목적과 이점1-1 안정성과 신뢰성 확보 : 정기적인 테스트를 통해 개발된 애플리케이션이 안정적으로 작동하며,예상치 못한 사용자의 액션에도 견딜 수 있고 정상적으로 동작하는지를 확인 1-2 코드 동작의 테스트 : 코드가 로직대로 정상적으로 제대로 동작하는지에 대한 검증1-3 상호 작용 테스트 : 사용자와의 상호작용, 클릭, 스크롤, 입력 등이 정상적으로 동작하는지를 검증 1-4 성능 평가 : 애플리케이션의 로딩시간, 반응속도 등 성능 지표를 평가, 더 좋은 사용자 경험을 위하여 개선점을 식별할 수 있는 것1-5 크로스 브라우징 호환성 : 다양한 웹 브라우저와 디바이스에서 애플리케이션이 일관된 방식으로 작동하는지를 테스트 1-6 인터페이스 검증 : 프론트엔드 테스트.. 2024. 10. 11.
[Next.js]Next.js의 Caching next.js는 상당히 복잡한 캐싱 전략을 가지고 있다. next.js에서는 대부분의 영역에서 fetch 함수를 기반으로 캐싱을 한다.-> next.js에서의 fetch는 우리가 흔히 아는 브라우저의 fetch와는 비슷하면서도 다르다.-> 브라우저의 fetch api를 기반으로 nxt.js에서 확장하여 만든 새로운 next.js만의 fetch api이기 때문 1. Full Route Cache 빌드 시점에 페이지를 렌더링하고 그 결과를 캐싱(저장)이를 통해 서버는 매 요청마다 페이지를 다시 렌더링 할 필요없이, 미리 생성된 html과데이터에 빠르게 접근할 수 있기에 -> 페이지 로딩 속도 향상 이 과정에서 next.js는 react api를 활용하여 렌더링 작업을 수행.1-1 React Server Co.. 2024. 10. 7.
[Server Problem Solve]서버가 아주 맛탱이가 가버렸다. 최근들어 혼자 운영중인 개인서버의 오류가 급증한다. 어떤 오류인지 로그도 확인하고, 디스크 용량도 확인하고 , mapper가 잘못되었는지, 아니면 서비스 내부 로그도 다 확인했는데 문제는 각 problem들이 각각 다른 원인을 가리키고 있다. 원인이 다양할 수도 있고, 몇가지 원인이 추측이 될 뿐.. 2024. 10. 3.

티스토리툴바