y.developer

2024.01.11 목 Supabase 트리거 Supabase의 auth의 user 테이블은 직접 수정을 할 수 없어서 명령어로만 가능하다. 어쩌면 SQL로 작성하는게 더 쉬울 수도 있다. auth의 user 테이블에 값이 들어오면 자동으로 내가 만든 public의 users에 넣도록 만든다. -- 트리거 함수 생성 CREATE OR REPLACE FUNCTION public.handle_new_auth_user() RETURNS TRIGGER AS $$ BEGIN -- public.users 테이블에 새로운 행 추가 INSERT INTO public.users (id, created_at) VALUES (NEW.id, now()); RETURN NEW; END; $$ LANGUAGE plpgsql se..

2024.01.10 수 Input Type input calue에 바로 register 지정시 null값 해당 안됨. → 타입을 string | undefined으로 변경 / 초기 상태를 undefined 일때 경고 뜸 → 그냥 name state 만들고 넣기로 → 다시 타입을 타입을 string | null / state는 string으로 받고 input type만 type="number”로 줘서 스트링 입력을 막으면 된다. 데이터 값을 setRegister에 넣을 때 Number로 변환 로딩중 화면이 뜸 NextUI Button과 Link의 충돌 // 로딩이 걸려버림 (주소창에 직접 치고 접속하듯) 시작하기 // 정상작동 그러나 시작하기 글자만 Link 적용 시작하기 // 일반 button은 정상작동..

2024.01.09 화 - 데이터들마다 관계를 형성하는 foreign key를 꼭 사용해야 할까요? SQL의 경우 관계가 있을 때 foreign key를 설정합니다. 관계된 데이터가 삭제되어 에러가 발생할 위험을 줄이기 때문입니다. - foreign key 설정해야 하는 이유 1. 데이터의 무결성 보장 ⇒ 중복 없앰 2. 관계를 명확히 정의 ⇒ 어떤 데이터가 연결되어 있는지 바로 파악 가능 3. 잘못된 데이터 입력을 방지 ⇒ 오타 방지 다만 성능 및 특별한 이유를 위해 데이터 중복을 허용하는 경우는 foreign key를 설정하지 않는 경우도 있습니다. - 구글은 소셜로그인 데이터 들어올때 새로고침 안되나요? 계속 새로고침 되는데.. preventdefault해도 안되네요 데이터는 들어오는데 새로고침이 ..

2024.01.08 월 지난 포스팅에서 최종 프로젝트 기술 스택을 선정한 바 있다. 이번 프로젝트에서 리더를 맡았기 때문에 최초 세팅을 내가 진행하게 되었다. Next.js를 제대로 세팅하려니 명령어들이 기억나지 않아서 찾아보게 되며 시간이 소요되었다. 그래서 이번 기회에 다음에도 볼 수 있게 초기 세팅의 A부터 Z까지 정리하여 기록하려고 한다. PC에 프로젝트 폴더 생성 Code로 vscode를 열어준다 (해당 설정이 나오지 않는다면 vscode를 설치할 때 옵션을 해제한 것이다. 이럴 경우 vscode에서 직접 열거나 Open Git Bash here에 code.을 입력해서 열어준다.) Next.js 설치 yarn create next-app 빈화면을 Next.js로 채워주자 입력하면 여러 옵션들을 ..

2024.01.05 금 Recoil 중요 개념 Recoil은 React 어플리케이션의 상태 관리를 도와주는 라이브러리입니다. 이를 이해하기 위해 몇 가지 중요한 개념을 알아보겠습니다. atom (원자): Recoil에서의 기본적인 상태 단위입니다. atom은 전역 상태를 나타내며, 여러 컴포넌트 간에 공유됩니다. 예를 들어, 로그인 상태를 저장하는 atom을 만들 수 있습니다. selector (셀렉터): selector는 atom에서 파생된 데이터를 계산하고 반환하는 함수입니다. 이를 통해 더 복잡한 데이터 변환 및 가공을 할 수 있습니다. 예를 들어, 로그인 상태에 따라 다른 멤버 정보를 가져오는 selector를 만들 수 있습니다. useRecoilState와 useRecoilValue: useRe..

2024.01.04 목 Service Architecture 프레임워크 : Next.js 14ver React vs Next.js Next.js를 채택한 이유 - SEO를 위한 SSR을 가능하게 함 Next.js 없이 SSR을 구현할 수 없을까? React에서도 SSR페이지를 만들 수 있긴 하다. react-helmet등의 라이브러리로 SEO에 대응할 수 있다. 하지만 이미 진행된 React 프로젝트에서 갑자기 프레임워크를 도입하는 것이 리팩토링 등 꽤 비용이 드는 작업이기 때문에 다른 방법을 사용하는 편이다. 만약 프로젝트 시작 전 프레임워크를 도입할지 고민을 하고있다거나, 시간적 여유가 있다면 SSR을 처리하는 부분에 있어서는 바로 Next를 선택하는 것이 더 좋아 보인다. Page vs App Ro..

심화 프로젝트 (2023.12.26 ~ 01.03) B반 10조 - 코딩촉진제 텐텐 KPT 회고 프로젝트를 마치고 회고하는 과정으로 Keep, Problem, Try 부분으로 나누어 진행한다. Keep : 잘하고 있는 점, 계속 이어갔으면 하는 부분 Problem : 개선이 필요하다고 생각되는 부분, 아쉬웠던 부분 Try : 앞으로 시도해 보면 좋을 방법 및 문제 해결책 KPT 회고 진행 진행 내용 정리 Keep 잘하고 있는 점, 계속 이어갔으면 하는 부분 와이어프레임을 구체적으로 잡고 프로젝트에 들어간 것 활용하려는 API에 대해서 충분히 정보검색하고 공부하여 원하는 기능을 적재적소에 작성한 것 팀이름(텐텐촉진제)과 프로젝트 이름(DailyC)가 진행하려는 프로젝트와 컨셉이 맞아떨어진 것 확장성 넓은 ..

2024.01.02 화 filter] 밖의 값을 변형 (배열 개수(index) 변화) 조건에 맞는 값만 가져오거나, 삭제 원하는 값만 추출할 때 map] 안의 값을 변형 (배열 개수(index) 유지) 조건에 해당하는 값을 변경 내부의 원하는 값을 변경할 때 ♠API (Application Programming Interface) 소프트웨어가 다른 소프트웨어로부터 지정된 형식으로 요청, 명령을 받을 수 있는 수단 ♠Reatful URI HTTP 요청을 보낼 때 어떤 URI에 어떤 메소드를 사용할지 개발자들 사이에 널리 지켜지는 약속 형식이기 때문에 기술에 구애받지 않는다. 어떤 언어로 어떤 것을 써서 만들든 소프트웨어간 HTTP로 정보를 주고받는 부분이 있다면 이 규칙들을 준수해서 Restful한 서비스..