본문 바로가기

반응형

분류 전체보기

(399)
[postgres] 외래키 제약 조건에 대한 정리 postgres 데이터베이스를 활용해서 테이블을 구성하고, 회원탈퇴 기능을 구현하려고 하는 와중에 삭제 요청을 하니 외래키 참조가 지정된 상위 테이블이 존재하여 삭제가 불가능하다는 에러 문구가 떴었다. 이러한 삭제가 불가능한 이유에 대해서 알아보니 관계형 데이터베이스에서 참조 무결성을 유지하여 상위 테이블과 하위 테이블 간의 관계가 유효한지 확인하는 것이 외래키 제약 조건이 존재하는 이유라는 것을 확인할 수 있었다. 따라서, 만일 회원탈퇴 처리를 할 때 해당 유저가 작성한 글이나 북마크 목록 등의 개인 정보를 연쇄적으로 삭제하기 위해서는 기본적으로 설정되어 있는 제약 조건을 수정할 필요성을 알게 되었고, 이 포스트는 해당 기능 구현을 위해 찾아본 내용을 간략하게 정리하여 향후 참고하기 위한 목적으로 작성..
[React] useId | 고유한 id 값을 생성해주는 리액트 훅 useId() useId() 훅을 사용하면 컴포넌트가 렌더링될 때 마다 고유한 id 를 생성하여 반환해준다. 따라서, 이를 활용한다면, 같은 컴포넌트를 동일한 부모 컴포넌트에서 재사용하는 경우 서로 id 값이 같아서 충돌이 날 수 있는 문제를 사전에 예방할 수 있다. 예를 들어 유저의 이메일을 입력 받은 동일한 컴포넌트를 하나의 부모 컴포넌트에서 여러 번 재사용하는 경우를 가정해보자. // 이메일을 입력받는 자식 컴포넌트 import { useState } from 'react'; function EmailInput({ onChange }) { const [email, setEmail] = useState(''); const handleInputChange = (e) => { const { value }..
[pg] postgres 에서 autoincrement 가 적용된 primary key 의 seq를 초기화하는 쿼리 seq 초기화 쿼리문법 다음과 같은 형식으로 입력하면 테이블명에 해당하는 컬럼의 자동증가 시퀸스의 값이 1로 초기화된다. ALTER SEQUENCE 테이블명_컬럼명_seq RESTART WITH 1; 예시 예를 들어, ALTER SEQUENCE quotes_quote_id_seq RESTART WITH 1; 이라고 지정한다면, quotes 라는 테이블의 quote_id 의 seq 에 입력된 값이 1로 재시작 되면서, 테이블에 값을 추가하면 초기화된 1 부터 다시 증가하는 것을 확인할 수 있다. 설명에서 누락된 점이 있다면, 기존에 존재했던 테이블의 이미지가 없다는 점인데, 부연 설명하자면, 원래는 quote_id 가 650 이후로 시작되고 있었다. 하지만, 위 쿼리를 통해 시퀸스를 초기화하고 나서 다시 ..
[Next.JS] Application error: a client-side exception has occurred (see the brows 클라이언트 측에서 예외처리를 제대로 안 해서 생기는 에러 Application error: a client-side exception has occurred (see the browser console for more information). vercel 에 배포 시 위 에러가 뜬다면, 90% 이상은 서버로 부터 클라이언트 측 렌더링에 필요한 데이터를 제대로 받아오지 못해서 생기는 문제이다. 그리고 해당 에러가 뜨는 근본적인 이유는 클라이언트 측에서 예외 처리를 제대로 안 해서 생긴다. 따라서 위 문제를 해결하기 위해서는 해당 데이터를 사용하는 로직을 찾은 후 데이터가 정상적으로 서버로 부터 받아온 직후에 데이터를 사용할 수 있도록 if(!data) return 데이터를 조회중입니다.. 와 같은 이른 반..
[자료구조] 단일 연결 리스트 | search 구현하기.sub | Index 를 사용하여 노드 찾기 [자료구조] 단일 연결 리스트 | Add 구현하기(2). sub | 뒤로 노드 추가하기 [ 자료구조] 단일 연결 리스트 - Add 구현하기[1]. sub | 노드를 앞으로 추가하기 단일 연결 리스트란? 단일 연결 리스트는 리스트의 각 요소가 다음 요소를 가리키는 연결 리스트의 한 유형이다. 리 duklook.tistory.com 단일 연결 리스트에서 search 단일 연결 리스트에서 타겟이 되는 노드를 찾는 search 메소드를 구현하는 방법은 다양하다. 실제 head 에 저장된 데이터(data)와 사용자가 입력한 값(target)이 일치하는 경우 true 혹은 false 를 반환하거나 해당 노드의 인덱스를 반환하게 할 수 있고, 아니면 오늘 구현해볼 방법인 인덱스를 기반으로 해당하는 인덱스에 위치한 요..
[SQLite3] AUTOINCREMENT 를 초기화하는 방법 AUTOINCREMENT 로 설정된 값을 저장하는 테이블과 접근방법(초기화 방법) SQLite3 는 경량화된 데이터베이스라서 그런지, 기본적으로 자동증가된 기본키를 초기화시키는 명령어가 별도로 존재하지 않는다. 따라서, SQLite 에서 이를 초기화하려면, 해당 값을 저장하고 있는 테이블에 직접 접근하여 제거해줄 수 밖에 없다. SQLite3 에서 SQLite 스튜디오와 같은 프로그램을 사용하여 AUTOINCREMENT 를 기본키(Primary Key) 에 적용했다면, 해당 자동증가된 값은 "sqlite_sequence" 이라는 별도의 테이블에 저장되는데 이 때, 저장되는 테이블 구조를 간략하게 표현해보면 다음과 같다. name seq 테이블이름 시퀸스번호 즉, 위 테이블에서 name 과 일치하는 seq..
[NextJS] 메타데이터의 개념과 중요성, NextJS에서의 기초 사용법 이번 시간에는 메타데이터에 대해 정리해본다. 메타데이터란? 메타데이터는 사용자가 방문하는 웹 사이트나 페이지를 세부적으로 설명해주는 정보라고 할 수 있다. 예를 들어, 사용자가 사진을 편집할 수 있는 사이트를 방문하기 위해 해당 웹 사이트를 구글 등을 통해 검색했다면, 사용자는 현재 방문하고자 하는 사이트의 대략적인 정보나 해당 페이지에서 제공하는 주요 콘텐츠의 제목이나 설명 등을 링크를 클릭하기 전에 확인할 수 있다. 개인이 생각하는 메타데이터의 중요성? 메타데이터를 잘 작성해둔다면, 각 브라우저의 검색엔진이나 크롤링 봇이 해당 웹사이트를 보다 더 잘 이해할 수 있기 때문에 사이트맵(sitemap) 못지 않게 SEO에 중요한 영향을 미친다(애초에 사이트맵 자체가 메타데이터와 유기적인 관계를 가진다). ..
[NextJS] next.js 개발중 권장 사항 Next.JS 에서는 애플리케이션을 구축할 때 최고의 성능과 사용자 경험을 보장하기 위해 다음과 같은 기능을 사용하는 것을 권장하고 있다. 라우팅 및 렌더링 - Layouts: 페이지 간에 UI를 공유하고 탐색 시 일부 렌더링을 활성화하기 위해 레이아웃을 사용하기 - 컴포넌트: 클라이언트 측 탐색 및 프리페치에 컴포넌트를 사용하기 - 에러 처리: production 환경에서 catch-all 에러와 404 에러를 수용하려면 사용자 정의 에러 페이지를 만들어서 유연하게 처리하기 - 합성 패턴: 서버 및 클라이언트 컴포넌트에 대한 권장 합성 패턴을 따르고 "use client" 경계의 배치를 확인하여 불필요하게 클라이언트 측 JavaScript 번들 크기를 증가시키지 않도록 주의하자. - 동적 함수: coo..

반응형