개인 공부 시간(2)
캔버스 라이브러리
원래 오늘 점심 이후부터 구현을 하고자했다.
그런데 기본적인 개념공부가 아닌 구현을 위한 공부를 해야했다.
우리 서비스에 그림판이 필요하기에 여러 캔버스 라이브러리를 찾아보았다.
대표적인것은 아래 2개가 있다.
1. fabric.js
2. pixi.js
그중에 fabric.js가 한획 한획을 하나의 객체로 저장하기때문에 우리 서비스에 좀 더 적합하다고 생각했다.
그래서 fabric.js로 간단한 그림판을 구현해보았다.
실시간 통신
우리 서비스는 실시간 통신을 해야했기에 WebRTC와 socket.io등의 정보가 중요했다. 그래서 직접 구현을 하면서 배울수있는 강의를 선택해 계속해서 들었다.
웹 소켓은 양방향 통신(Full-Duplex)에 유리하고
클라이언트와 서버가 서로에게 원할 때 데이터를 주고 받을 수 있다.
또한 실시간 네트워킹(Real Time-Networking)으로 웹 환경에서 연속된 데이터를 빠르게 노출한다.
에러 해결
오늘 깃 에러부터 서버 에러까지 여러 에러가 나를 반겨주었다.
오늘 발생했던 에러를 한번 적어보자면
-
이미 깃 초기화가 되어있는 폴더 안의 폴더에서 깃 초기화(
git init)을 하여 제대로 깃이 작동하지 않는 오류 -
npm run dev 안되는 오류
먼저 1번의 경우에는 나는 git init을 취소하는 작업을 진행했다. 이는 rm -rf .git을 하면 내부 폴더의 수정 추적이 취소된다.
하지만 나는 깃이 꼬여있었어서 아예 새로 레파지토리를 만들어 작업을 했다. 🤪
2번의 경우에는 결과적으로 필요한 패키지를 설치하지 않고 run을 하여서 생긴 오류였다.
여기서 얻은 교훈은 "에러 메시지를 제일 먼저 보자"이다.
에러를 무시하고 코드에서 무엇이 잘못되었는지 보지말고 먼저 에러 메지시를 잘 보고 해결하도록 해야겠다.
