tree 외주 개발이 막바지에 이르렀을 때 인수인계 문서를 작성해 문서화를 해야 합니다. 그런데 만들어둔 파일과 디렉토리가 많다 보니 이걸 하나하나 다 찾아서 문서에 작성하는 게 보통 일이 아닌지라 방법을 찾다 보니 tree라는 패키지를 찾게 되었고 이 패키지는 터미널이 바라보고 있는 디렉토리 기준으로 하위 디렉토리를 전부 출력해 줍니다. Insta...

객체에서 선언되지 않은 속성이나 메서드에 접근하려고 할 때 발생하는 에러로 즉, TypeScript 컴파일러가 해당 속성이나 메서드를 찾을 수 없어서 발생합니다. 에러 메시지 error TS2339: Property 'main' does not exist on type 'Images'. 해결 방법 제가 TS로 개발하던중 오타로 인...

React + TypeScript로 외주 개발 도중 발생한 에러로 에러 메시지 TS2307: Cannot find module 'react-js-pagination' or its corresponding type declarations. 해결 방법 react-js-pagination은 설치했지만 모듈의 타입이 정의된 @types/...

React + TypeScript로 개발하던 도중에 아래같은 에러가 뜨는데 에러 메시지 cannot be compiled under '--isolatedModules' because it is considered a global script file. Add an import, export, or an empty 'export {}' s...

props란? React의 props는 컴포넌트 간에 데이터를 전달하는 데 사용되는 객체입니다. 부모 컴포넌트에서 자식 컴포넌트로 정보를 전달하기 위해 사용되며, 이를 통해 컴포넌트 간의 상호작용 및 재사용성을 증가시킵니다. props는 컴포넌트에 전달되는 속성과 값의 집합으로, 자식 컴포넌트에서 읽기 전용으로 사용되며 React의 데이터 흐름...

API를 모듈화 하는 이유 API 관련 코드를 모듈화 하는것은 API관리를 위한 행위로 이렇게 나누는 이유는 프로젝트의 구조를 좀더 깔끔하게 만들고 코드의 유지보수와 재사용성을 향상시키며 가독성을 높이는데 도움이 됩니다. Axios Install 시작하기에 앞서 먼저 React에서 api를 요청할때 가장 많이 사용하는 Axios를 설치합...

새로운 프로젝트 생성 // npm npx create-next-app@latest {Project-Name} --ts // yarn yarn create next-app {Project-Name} --typescript 기존에 생성된 프로젝트에 TS설치 TypeScript설치 // npm npm install --sav...

Project 에 서버용 디렉토리 추가 my-project/graphql-server(GraphQL 디렉토리) 티미널로 폴더이동 cd my-project/graphql-server graphql-server디렉토리에 package.json추가 npm init -y g...

디렉토리 경로 My-Project/graphql-server My-Project/graphql-server/index.js const { ApolloServer, gql } = require('apollo-server'); const { readFileSync, writeFileSync...

.gitignore 란? .gitignore 는 원격서버에 프로젝트 파일을 을 올릴 때 불필요한 파일들을 업데이트 하지 않도록 제외할 파일들의 목록을 만드는 파일 .gitignore을 왜 사용 하는가? 프로젝트를 하다보면 프로젝트 내부의 더미 파일이나 API Key등 외부에 공개하면 안되는 파일들이 있습니다 그런경우에 .gitigno...

에러 메시지 TS2322: Type 'Element | Element[]' is not assignable to type 'ReactNode'. Type 'Element' is not assignable to type 'ReactNode'. Type 'Element' is missing the following properties from type ...

스코프(Scope) 스코프는 변수나 매개변수에 접근할 수 있는 범위를 결정합니다. JS의 스코프는 함수 스코프와 블록 스코프로 나눌 수 잇습니다. 함수나 블록의 선언 위치에 다라 중첩된 스코프가 정의될 수 있습니다. 함수 스코프와 블록 스코프 함수 스코프 함수 스코프는 이름 그대로 함수안에서 선언된 변수나 ...

올림( Math.ceil() ) 정수, 음수 올림 // 올림 const ceil = Math.ceil(1); // 1 const ceil = Math.ceil(1.3); // 2 // null const ceil = Math.ceil(null); // 0 ...

호이스팅(Hoisting) 호이스팅은 선언문이 스코프 내부의 가장 최상단으로 끌어 올려지는 것을 의미합니다. // 1. console.log(a); // Undefined var a = 1; // 위 코드는 호이스팅으로 인해 아래처럼 동작합니다. // 2. var a; console.log(a); a = 1; 여기서 중요한건 1번 코드에서...

HTML <div>Hello World</div> CSS div { width:70px; padding:0 5px; background:gray; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } 결과