개발자로 전향중

문제 설명 문제 풀이function solution(n) { // n을 문자열로 변환하여 각 자릿수를 배열로 만들기 const digits = n.toString().split(''); // 각 자릿수를 카운트하기 위한 배열 (0~9) const count = new Array(10).fill(0); // 각 자릿수의 개수 세기 for (let digit of digits) { count[Number(digit)]++; } // 결과를 저장할 배열 let answer = ''; // 큰 수부터 작은 수로 구성 for (let i = 9; i >= 0; i--) { while (count[i] > 0) { ..

문제설명   문제풀이function solution(n) { var answer = 0; const arr = n.toString().split("") for (let i = 0; i  리팩토링function solution(n) { var answer = 0; while (n > 0) { answer += n % 10; // n의 마지막 자릿수를 answer에 더함 n = Math.floor(n / 10); // n에서 마지막 자릿수를 제거 } return answer; // 최종 자릿수 합 반환}console.log(solution(123)); // 출력: 6  추가적인 배열이나 데이터 구조를 사용하지 않아 공간복잡도를 O(1)로 줄일 수 있..

1. child 컴포넌트는 인자를 2개를 사용한다. 2. parent 컴포넌트는 인자 1개만 부른다. 3. 의문은 인자를 2개를 자식에서 전달해도 부모에서 한개만 받아도 에러가 안난다. 이유는?구조적 타이핑의 유연성 chat gpt 물어본 결과타입스크립트에서 함수 타입의 호환성을 다룰 때, 특정 상황에서는 부모 함수(콜백 함수)를 자식 함수에 전달할 때 에러가 발생하지 않을 수 있습니다. 이는 타입스크립트가 구조적 타이핑(Structural Typing)을 사용하기 때문입니다. 구조적 타이핑은 타입의 이름이 아니라 실제 구조에 따라 타입을 판단합니다. 따라서, 함수의 매개변수와 반환 타입이 부분적으로 호환될 경우 타입 불일치 에러가 발생하지 않을 수 있습니다.자세히 살펴보면, 타입스크립트는 함수 타입의 ..

배포를 했는데 이런 창을 만났다. 빌드는 잘됐지만 검색해보니 원인여러가지 많은 자료를 찾아본 결과, Vercel은 플랫폼을 사용할 때 몇 가지 제한을 적용하는 걸 알았고 Serverless Functions의 실행 시간이 hobby plan인 경우 5초로 pro plan은 15초로 줄었다고 한다.그래서 시간이 초과가 되면 에러가 발생한거 였고, 해결하기 위해서는 vercel을 pro로 업그레이드 하고 Serverless Functions시간을 늘려야 했다.참조:https://velog.io/@uuuuooii/Next.js-Vercel-504-GATEWAYTIMEOUT-%EC%97%90%EB%9F%AC%ED%95%B4%EA%B2%B0 [Next.js] Vercel 504: GATEWAY_TIMEOUT 에러..

Error fetching courses info: n [Error]: Dynamic server usage: Page couldn't be rendered statically because it used `cookies`. 라는 에러를 만났다. stackoverflow를 찾아봤더니export const dynamic = 'force-dynamic' 로 root page에 지정하면 된다고 나와있다.그렇다면 export const dynamic = 'force-dynamic' 가 뭘까? https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config File Conventions: Route Segment Config | Nex..

구글 확장 프로그램 light house을 통해 분석 첫 분석 시 1. 첫번째 이미지! Next Image를 사용하여 Swiper image 해결 20점 상승! 2. https://maybe-b50.tistory.com/67 windowing 라이브러리 애플리케이션에서 긴 목록을 렌더링 하는 경우 ' Windowing' 이라는 기법을 사용하는 것을 추천합니다. 이 기법은 주어진 시간에 목록의 부분 목록만 렌더링 하며, 컴포넌트를 다시 렌더링하는 데 maybe-b50.tistory.com 사용해 봤으나 긴 목록이 아니었고 사용하더라도 성능이 오히려 떨어졌음..? Next hydrate가 더 효과적 나중에 많은 리스트를 렌더링할때 시도해보면 좋을 것 같다 3. 이부분을 해결해야하는데 기존에 page.js과 ..

.parent { display: flex; flex-direction: column; height: 100%; /* 부모 컴포넌트의 높이를 100%로 설정 */ } .header { /* 헤더 스타일 */ } .footer { /* 푸터 스타일 */ } .content { flex: 1; /* 헤더와 푸터를 제외한 모든 공간을 사용 */ overflow-y: auto; /* 내용이 넘치는 경우 수직 스크롤바 생성 */ } 가 기본 원칙 Body에 flex flex-col h-full 넣으면 3단분리 page.ts에 다시 flex flex-col h0full 넣으면 거기서 또 안에서 분리 원하는 content에 flex-1 추가하면 분리되고 분리된 나머지를 채울 수 있다 ㅅㅂ 존나 이거하는데 2시간 걸린..

파일이 캐싱이 되어 같은 파일일 경우 통신은 되지만 서버 전달은 안됨으로 주의! const App = () => { useEffect(() => { const uppy = new Uppy({ debug: true, autoProceed: true, }) const onUploadSuccess = (el: string) => (file: File, response: any) => { const li = document.createElement('li') const a = document.createElement('a') a.href = response.uploadURL a.target = '_blank' a.appendChild(document.createTextNode(file.name)) li.appe..