전체 글66 [React Error] Parsing error: Cannot find module 'next/babel' 문제 같은 워크스페이스 내에 다른 프로젝트에서 타입스크립트와 codegen을 깔고 나서 또 다른 프로젝트에서 갑자기 Parsing error: Cannot find module 'next/babel' 이런 에러가 나면서 import가 안받아지면서 코드가 작동이 되지 않았다. 같은 워크스페이스 내에서 또 다른 프로젝트를 새로 만들어도 다른 워크스페이스를 파서 새로 해봐도 같은 에러가 나면서 에러가 떴다. 해결 에러가 나는 프로젝트에 eslint 깔고 .eslintrc.json파일의 extends 에 next/babel을 추가하였다. { "extends": ["next/babel", "next/core-web-vitals"] } .eslintrc.json 파일 조언 받았던 추가 해결 방법들) 1. 프로젝트의.. 2022. 1. 24. [TIL] 2주차 - 4. TypeScript - 이걸 쓰면 더 안전하다 TypeScript? (JavaScript Superset) JavaScript의 타입을 강제시키는 언어 TypeScript는 마이크로소프트에서 구현한 JavaScript의 슈퍼셋(Superset) 프로그래밍 언어입니다. TypeScript = JavaScript + Type 문법 JavaScript와 완전히 다른 언어는 아니고 JavaScript의 문법을 이용하는데 자바스크립트의 타입을 강제 시켜 줍니다. 확장자로는 .ts를 사용하며, 컴파일의 결과물로 JavaScript 코드를 출력합니다. 최종적으로 런타임에서는 이렇게 출력된 JavaScript 코드를 구동시키게 됩니다. let aaa = "안녕하세요" aaa = 123 JavaScript는 위와 같은 코드에서 에러가 발생하지 않습니다. 하지만 Ty.. 2022. 1. 20. [TIL] 2주차 - 3. 컴포넌트 재사용성 (feat.게시물 수정하기) 컴포넌트 재사용성 입사하게 되면 회사에서는 1.컴포넌트 분리 2.로그인 인증(회사에서 주는 과제) 3.배포 이렇게 3가지를 봅니다. 특히 컴포넌트 분리에서 컴포넌트 재사용성이 중요한 부분인데요. 협업하기 좋은 코드이기 때문입니다. 흔히 좋은 코드라 함은 중복되는 코드 수를 줄이고 재사용성을 높여 코드 간의 결합도를 낮추고 생산성을 높인 것이라고 합니다. 유사하거나 똑같은 코드들이 여러개 있다면 클라이언트가 방대해져서 로딩 속도가 느려집니다. 나중에 수정해야 될 때도 시간 소모가 크겠죠. 그래서 중복되는 코드수를 줄이고 코드의 재사용성을 높이는 것이 실무에서 좋은 코드라고 할 수 있겠습니다. 컴포넌트 역시 마찬가지입니다. 공통적으로 사용되는 기능은 따로 한 컴포넌트로 빼두어 기능이 필요한 곳(페이지)에서 .. 2022. 1. 19. [TIL] 2주차 - 2. 실무 전용 반복문 - map/filter 1. 배열 함수 Map() 1-1. 문자열 배열 const classmates = ["철수","영희","훈이"] classmates의 각 요소마다 뒤에 "어린이"를 붙이고 싶다. 배열 함수 map()을 사용하면 classmaates의 모든 요소 하나하나에 동일한 로직을 실행할 수 있다. classmates.map((el) => (el+"어린이")) 기존 배열 classmates에서 map()함수를 사용해 순서대로 하나씩 요소에 접근해 가져온다. 가져온 값을 el에 넣은 후 (el + "어린이")를 통해 원하던 대로 "누구누구어린이" 가 되게 수정해준뒤 값을 반환하여 다시 원래 자리로 요소를 넣어준다. 원하던 대로 요소마다 뒤에 "어린이"가 잘 붙었다. 이 때, 소괄호 생략 가능하다. 1-2. 객체 배열 .. 2022. 1. 18. 이전 1 ··· 11 12 13 14 15 16 17 다음
