몽땅뚝딱 개발자

Ant Design에서 , 를 같이 적용하려는데 생긴 이슈... 인터페이스를 까봐도 잘 읽혀지지 않아서 타입스크립트 공부가 필요하다고 생각했다. 우선 데이터를 이렇게 선언했고 type MenuItem = Required['items'][number] function getItem(label: React.ReactNode, key: React.Key, children?: MenuItem[]): MenuItem { return { label, key, children, } as MenuItem } // Sider 메뉴 const items: MenuItem[] = [ getItem('A', 'A', [ getItem(a 메뉴, 'key-a'), getItem(b 메뉴, 'key-b'), ]), getItem..

Intellij 프로젝트 폴더가 보이지 않아요.. intellij를 사용하다가 .gitignore에 .idea 폴더를 추가하는 과정에서 잘못하여 idea 폴더를 삭제 해버렸다... velog.io

use client 어쩌구 에러.. 이게 같은 구조로 보이는 페이지인데도 해당 에러가 뜰 때도 있고 아닐 때도 있다. 이렇게 상단에 'use client'를 넣어주면 해결된다. ('use strict'같은 느낌) 예상으론 서버 컴포넌트와 관계가 있는 것 같은데.. 내가 공식문서를 아직 제대로 읽어보지 않아서 생긴 문제인 것 같다. (🤦🏻‍♀️) 근데 그런 컴포넌트마다 매번 이렇게 달아줘야한다고??? Next는 emotion 쓰는 것도 구구절절 주석 추가해야 가능하더니 컴포넌트에도 이렇게 하나하나 달아줘야 하는걸까? 하지만 분명 더 편한 점도 있다는 것을 알아... 개선할 방법도 찾으면 나온다는 것을 알아.. 언젠가 Next를 좋아하게 될 것을 알아... ㅡ Next.js 2일차 쪼렙 ㅡ [참고하면 좋을 ..

Vue3로 만들어진 프로젝트의 버그를 고치던 중 props로 넘긴 값을 할당하던 ref 변수의 값이 바뀌지 않는 현상을 발견했다. 동료에게 조언을 구하여 해결한 결과, 결론은 뿌려진 컴포넌트의 key값을 index로 설정해놨기 때문에 페이징하면서 넘어온 리스트는 다르지만 컴포넌트의 key가 동일하여 동일한 컴포넌트로 인식했기 때문이었다. 그래서 새로 create되는 것이 아니라 해당 컴포넌트에서 props 값만 바뀌었고 리렌더링 되지않기때문에 이미 할당된 값은 바뀌지 않았다....🤦🏻‍♀️ 어쩐지 리렌더링이 안되더라니....

배포하면서 npm i 를 실행할 때 문제가 발생했다. 버전 문제 같아서 동료에게 조언을 구하여 해결했다. (감사합니다..🙇🏻‍♀️) 📄 buildspec.yml // before phases: install: commands: - npm i npm@latest -g // after phases: install: commands: - npm i npm@8.19.4 -g 개인적으로 공부한 내용을 정리하는 블로그로 잘못된 개념을 게시하지않도록 주의하고 있으나 오류가 있을 수 있습니다.

에러 Compiled with problems: ERROR [eslint] ESLint configuration in .eslintrc.js is invalid: - Property "parser" is the wrong type (expected string/null but got `["@typescript-eslint","import"]`). 원인 나는 이렇게 설정했었다. module.exports = { parser: [ '@typescript-eslint', // @typescript-eslint/parser 'import', // eslint-plugin-import ], } array를 못받는 모양.. 아래처럼 수정해주었다. 제발... 알고쓰자.........!!!!!!!!!!!!! 😭 mod..

에러 Property 'size' does not exist on type 'ThemeProps'. Property 'size' does not exist on type 'ThemeProps'. 원인 const sizeStyles = css` ${({ size }) => css` padding: ${sizes[size].padding} font-size: ${sizes[size].fontSize} `} ` 타입을 모조리 지정해주었다. type Size = { [key: string]: { padding: string fontSize: string } } const sizes: Size = { large: { padding: '10px 15px', fontSize: '15px', }, medium: { p..

오랜만에 백엔드 프로젝트를 실행하면서 문제가 생겼다 ^_ ^ 간단히 해결돼서 다행이다. 에러 Driver net.sf.log4jdbc.sql.jdbcapi.DriverSpy claims to not accept jdbcUrl Driver net.sf.log4jdbc.sql.jdbcapi.DriverSpy claims to not accept jdbcUrl 원인 주소고 포트고 아무것도 바뀐게 없는데 어제까지만해도 run 잘 됐는데... 아침에 갑자기 해당 에러를 출력하며 실행되지 않았다. 바로 구글링해보니 Gradle 새로고침을 하면 된다고 한다. 잘 실행된다! 출처 Spring MySql 연동시 Driver net.sf.log4jdbc.sql.jdbcapi.DriverSpy claims to not ac..

에러 로 받은 file 변수에 forEach not a function 스크립트 에러가 발생했다. 타입이 Array가 맞고 length까지 찍어봤지만 동일한 문제가 생겼다. 해결 [전] handleUploadImage(e) { let inputFile = e.target.files let targetFile // 여기서 에러 발생..! inputFile.forEach((image) => { targetFile.push(image) }) } [후] 1. let → const 변경 2. 파일을 전개연산자로 받았다. handleUploadImage(e) { const inputFile = [...e.target.files] let targetFile inputFile.forEach((image) => { ta..

에러 Warning: Each child in a list should have a unique "key" prop. 원인 key를 할당하지 않았다. [전] {charList.map((obj, idx) => ( {obj} ))} [후] {charList.map((obj, idx) => ( {obj} ))} 개인적으로 공부한 내용을 정리하는 블로그로 잘못된 개념을 게시하지않도록 주의하고 있으나 오류가 있을 수 있습니다.