Save 블로그

npm install js-cookiepackage.json에도 잘 들어간 것을 확인했고npm ls를 통해 js-cookie 상태도 잘 되어 있는 것을 확인했는데도import 해서 불러오면 모듈을 찾을 수 없다고 한다 에러표시가 된 곳에 마우스를 올려보면 친절하게 방법이 나와있다 빨간 에러 문구만 확인하지말고추가적인 설명도 확인해보는 습관을 들이자 ㅠ

'Resolverunknown; career: unknown; profileImage?: string | undefined; }, any, { name: string; birthDate: string; gender: string | null; phoneNumber: string; position: string[]; career: string; profileImage?: string | undefined; }>' 형식은'Resolver' 형식에 할당할 수 없습니다. RHF의 useForm을 사용하면서 zod 스키마의 타입추론이 엉뚱한 unknown으로 나오는 문제가 생겼다해당 값들 공통적으로 z.preprocess로 묶어준 상태라는 점이다 devLanguage: preprocessArrayFormField..

Type error: Type 'UserInfoPageProps' does not satisfy the constraint 'PageProps'. Types of property 'params' are incompatible. Type '{ userid: string; }' is missing the following properties from type 'Promise': then, catch, finally, [Symbol.toStringTag]build를 하면서 app/.../page.tsx 에서 타입에러가 난다 interface UserInfoPageProps { params: { userid: string };}export default async function UserInfoPa..

Error: EISDIR: illegal operation on a directory, readlink 'E:\vscode\html_files\fixlog\node_modules\next\dist\pages\_app.js' npm run build를 하던 중 발생한 에러해당 경로의 파일이 문제가 된다고 하는데... 1. 재설치 ❌vscode를 닫은 후node_modules, package-lock, .next 등의 폴더들을 싹 삭제하고npm i 를 통해 다시 설치해봤지만 안됨 2. 관리자 권한 실행 ❌vscode를 일반 실행이 아닌 관리자 권한으로 실행해봤지만 안됨 3. npm 캐시 삭제 ❌npm cache clean --force 를 통해 캐시를 제거해봤지만 이것도 안됨 4. 드라이브 변경 ✅D..

부모 컴포넌트에 있는 state를 props받아서 호출했다가 문제가 생겼다컴포넌트 렌더링 중 state를 호출하지 말라고 하는데... 때문에 컴포넌트 렌더링이 끝나고서 호출되는 useEffect나 이벤트 핸들러에서만props된 state를 안전하게 호출할 수 있다고 한다 useEffect(() => { if (watch(id) === false) setValue(id, [] as PathValue>);}, [id, watch, setValue]);그래서 useEffect로 감싸줬다 잘 된다!

처음엔 localStorage에 로그인상태(게스트,회원)를 담아 헤더의 UI를 변경하려고 했다하지만 내부의 상태로만 동적으로 화면을 그리는 react의 특정상새로고침이 생기기 전까진 브라우저의 localStorage만으로는 화면을 바꿀 수 없었다...const [isLoggedIn, setIsLoggedIn] = useState(false)때문에 로그인 상태를 담은 useState를 만들어서 서로 연결시켜주는 방법이 있다이 방법은 localStorage가 아닌 전역이나 props로 react 내부에서 처리하는 것이기 때문에localStorage를 쓰고 싶은 내 의도와는 달랐다 그래서 로그인 후 메인페이지로 이동해서 새로고침되게끔 했다localStorage.setItem('userStatus', 'use..

한창 zod로 유효성 검사 로직을 작성하고서테스트로 한 번 싹 체크하다가 문제를 발견했다스키마에 적용시켜놨던 superRfine 부분이 적용되지 않고 있다는 것이다// feature/.../schema/step1.tsimport z from 'zod';export const schema = z .object({ email: z.string().nonempty('이메일을 입력해주세요').email('이메일 형식이 아닙니다'), isEmailVerified: z.boolean(), password: z .string() .nonempty('비밀번호를 입력해주세요') .min(8, '8자 이상, 16자 이하여야 합니다') .max(16, '8자 이상, 16..

협업에서 기획이 끝난 후 개발에 들어가기 전GitHub와 branch, 배포환경 등의 초기 세팅을 하고 들어가게 된다   GitHub제일 기본적인 github의 레포지토리를 생성하고 연결해준다이 후 git branch 전략을 통해 develop를 추가해주는 등의 설정을 한다  · git branch 전략? 브랜치 생성에 규칙을 만들어 개발자들간의 혼란을 방지하는 방식 main → 사용자들에게 배포한 최종 상태develop → 배포하기 전 최종 개발 상태feature → 개발자들 각자의 개발 공간 위는 제일 심플하고 기본적인 규칙이다더 큰 회사에서는 좀 더 복잡한 branch 규칙을 정하는 등의 예시가 있다   · feature 생성 개발하기 위해 feature branch를 생성할 때도 규칙이 존재한다g..

I AM, 사용자 생성 (외부보안키)콘솔창에서 "IAM" 검색 후 이동* I AM: 외부에서 AWS 접근 허용을 위한 인증   사용자로 이동 후 사용자 생성   사용자 이름은 하고자 하는 임의의 이름으로 하면 된다   권한 설정에서 "직접 권한 연결"을 클릭하면권한 정책 설정이 추가로 열린다S3full, CloudFront 각각 검색하여 FullAccess 체크 후 생성   이제 생성한 사용자를 클릭하여"보안 자격 증명" 탭으로 이동 후 액세스 키 만들기   액세스 키 사용 사례를 "외부 실행 애플리케이션" 체크만 하고나머지는 스킵하여 액세스 키 만들기   만들면 위처럼 액세스 키와 비밀 액세스 키를 보여주는데이 값들은 해당 창을 나가면 다시 볼 수 없다 (까먹으면 재생성 해줘야한다)액세스 키이기 때문에..

도메인 발급검색창에 "내 도메인" 검색 후 내도메인한국으로 이동https://xn--220b31d95hq8o.xn--3e0b707e/ 내도메인.한국 - 한글 무료 도메인 등록센터한글 무료 도메인 내도메인.한국, 웹포워딩, DNS 등 무료 도메인 기능 제공xn--220b31d95hq8o.xn--3e0b707e   하고자 하는 도메인 입력 후 "등록하기" 클릭   CNAME 체크 CloudFront 도메인 입력 (앞에 http:// 지워줘야한다)보안코드 입력 후 "수정하기" 기본적으로 A, CNAME을 설정하는데현재로썬 CloudFront의 도메인밖에 모르기때문에 CNAME만 설정A: 숫자로 이루어진 IP 주소 입력CNAME: 문자로 이루어진 도메인 주소 입력   인증서 (SSL)AWS - CloudFron..