반응형 개발 Study49 [Error] NextJS 에러 처리 - Parsing error : Cannot find module 'Next/babel' NextJS 프로젝트 생성 시 'Next/babel' 에러 처리 NomadCoder의 강의를 들으면서 NextJS 프로젝트를 만들었는데 실행은 잘 되지만 js의 모듈 임포트 부분 마다 아래와 같은 에러가 뜨는게 너무 거슬렸다. Parsing error : Cannot find module 'Next/babel' 그래서 찾아보니 다음과 같은 방법으로 없앨 수 있었다. NextJS 프로젝트 폴더의 루트에 .eslintrc.json 파일을 열어 아래와 같이 수정하면 없앨 수 있다. extends에 next/babel을 추가시키면 Parsing error가 사라진 것을 확인할 수 있다. 2022. 9. 1. [Typescript] 타입스크립트로 블록체인 만들기-(1)Typescript 기초 배우기 노마드 코더 [Typescript] 기초 - 블록체인 만들기 코딩쟁이들이라면 들어봤을 법한 유튜버 '노마드 코더'의 Typescript 무료 강의로 아래 사이트에 들어가면 볼 수 있다. https://nomadcoders.co/typescript-for-beginners 타입스크립트로 블록체인 만들기 – 노마드 코더 Nomad Coders Typescript for Beginners nomadcoders.co Javascript에 Types를 선언해 추적이 안되던 error나 type들에 대해 쉽게 알 수 있고, javascript의 superset이기 때문에 다른 라이브러리들에 적용해도 쉽게 사용이 가능하다. Javascript를 객체지향적으로 사용하고 싶을 때 용이하며 나 같은 윈도우 개발자 (C++.. 2022. 8. 29. [SocketIO/WebRTC] 줌 클론 코딩(2) - WebRTC로 카메라 연결하기 노마드 코더 [Javascript] 기초 - 줌 클론 코딩 코딩쟁이들이라면 들어봤을 법한 유튜버 '노마드 코더'의 Javascript 무료 강의로 아래 사이트에 들어가면 볼 수 있다. https://nomadcoders.co/noom 줌 클론코딩 – 노마드 코더 Nomad Coders WebSockets, SocketIO, WebRTC nomadcoders.co 지난 번 socket.io를 이용하여 채팅까지 완성한 후, 이후 내용은 WebRTC를 이용하여 실제로 웹캠을 연결하여 화상 채팅을 구현하는 것이다. 1. WebRTC란? Peer-to-Peer 방식으로 브라우저나 단말 간에 데이터를 주고받는 기술의 웹 표준을 말한다. WebRTC (Web Real-Time Communication)은 웹 애플리케.. 2022. 8. 23. [SocketIO/WebRTC] 줌 클론 코딩(1) - Socket.io로 채팅 만들기 노마드 코더 [Javascript] 기초 - 줌 클론 코딩 코딩쟁이들이라면 들어봤을 법한 유튜버 '노마드 코더'의 Javascript 무료 강의로 아래 사이트에 들어가면 볼 수 있다. https://nomadcoders.co/noom 줌 클론코딩 – 노마드 코더 Nomad Coders WebSockets, SocketIO, WebRTC nomadcoders.co 코로나로 인해 비대면 미팅이 늘어난 시점에 Zoom 은 샛별같이 등장하여 화상 채팅 시장을 장악했다. Socket.io를 이용하여 실시간 채팅 및 스트리밍 영상을 주고받을 수 있는 화상 채팅 서비스를 만들어보는 강의다. 전에 하다가 중단한 실시간 채팅 구현하기에서 이미 Socket.io를 이용하여 구현했지만 제대로 강의를 듣고 기초부터 다시 다져.. 2022. 8. 22. [Error] npm i @socket.io/admin-ui 설치 에러 해결 npm i @socket.io/admin-ui 에러 처리 socket.io 관련 모든 페이지를 뒤졌지만 아래처럼 입력해서 설치하라고만 나오고 에러에 대한 설명이라던가 에러가 났다고 나오는 글들이 없어 이렇게 남김. 자꾸 '@' 표시를 연산자로 인식해서 저런 에러가 나는데 이 글 저 글 찾아보다가 결국 찾아낸 해결 방법은 $npm i "@socket.io/admin-ui" 위와 같이 "" 큰 따옴표 안에 넣어주고 입력하는 방식이다. 다음에 똑같은 에러가 났을 경우 참고할 것!!! ㅎㅎ 2022. 8. 19. [Javascript] Vanilla JS로 크롬 앱 만들기 - Review(2) 노마드 코더 [Javascript] 기초 - Vanilla JS 100% 다 듣고 작성하는 수강 리뷰.. 사실 98%찍히지만 다 들었는데도 왜 98%인지 모르겠다. 이전 글로부터 이어진다. 2022.08.11 - [개발 Study/Node, js, react] - [Javascript] Vanilla JS로 크롬 앱 만들기 - Review(1) [Javascript] Vanilla JS로 크롬 앱 만들기 - Review(1) 노마드 코더 [Javascript] 기초 - Vanilla JS 코딩쟁이들이라면 들어봤을 법한 유튜버 '노마드 코더'의 Javascript 무료 강의로 아래 사이트에 들어가면 볼 수 있다. https://nomadcoders.co/javascript-for-begin.. chuun9.. 2022. 8. 12. [Javascript] Vanilla JS로 크롬 앱 만들기 - Review(1) 노마드 코더 [Javascript] 기초 - Vanilla JS 코딩쟁이들이라면 들어봤을 법한 유튜버 '노마드 코더'의 Javascript 무료 강의로 아래 사이트에 들어가면 볼 수 있다. https://nomadcoders.co/javascript-for-beginners 바닐라 JS로 크롬 앱 만들기 – 노마드 코더 Nomad Coders Javascript for Beginners nomadcoders.co 크롬 앱으로 날씨/시간/Todo List 등을 볼 수 있는 MomentumApp을 순수 자바스크립트인 Vanilla JS로 만들어보는 강의다. React를 바로 공부하다보니 JS를 이해하지 못하고 들어가서인지 쉽게 가져다 쓸 수있는 함수를 어렵게 쓰는 기분이 들어서 한번 쭉 들어보는게 좋겠다 싶.. 2022. 8. 11. [React/Redux] Redux-persist 사용법 - (새로고침 후 상태 유지) 이전에 리덕스 관련 글은 아래를 참조하자. 2022.08.04 - [개발 Study/Node, js, react] - [React/Redux] Redux 사용법 (1) -State/Action/Reducer/Store [React/Redux] Redux 사용법 (1) -State/Action/Reducer/Store Redux란? 상태 관리 라이브러리로 Component별로 props/state를 바꿔주는 복잡한 관계를 redux 하나로 외부에서 state들을 공용으로 관리하여 가져다 쓸 수 있다. 1. State(상태) State란 React Component 내에.. chuun92.tistory.com 2022.08.05 - [개발 Study/Node, js, react] - [React/Redux].. 2022. 8. 8. [React/Redux] Redux 사용법 (2) - UseDispatch/UseSelector 2022.08.04 - [개발 Study/Node, js, react] - [React/Redux] Redux 사용법 (1) -State/Action/Reducer/Store [React/Redux] Redux 사용법 (1) -State/Action/Reducer/Store Redux란? 상태 관리 라이브러리로 Component별로 props/state를 바꿔주는 복잡한 관계를 redux 하나로 외부에서 state들을 공용으로 관리하여 가져다 쓸 수 있다. 1. State(상태) State란 React Component 내에.. chuun92.tistory.com 로그인 페이지에서 지난번에 작성했던 UserReducer의 LOGIN 액션을 실행시키고 User State를 변경하여 Main 페이지에서 Us.. 2022. 8. 5. 이전 1 2 3 4 5 6 다음 반응형