brunch

You can make anything
by writing

C.S.Lewis

by 코드아키택트 May 10. 2024

R3F + Next.js

D+41

React Three Fiber를 시작하며 나의 콘텐츠는 생존기에 가까워졌다. 아무래도 기초가 부족한 상태에서 크게 무언갈 한 번에 하기란 힘든 법이다. 그럼에도 도전한다. 왜냐면 그래야 좀 더 높이 올라갈 수 있으니까


스타터팩으로 문제를 해결하다

모두 다 인정하고 싶지 않은 부분들이 있다. "내가 n연차인데 아직도 이걸 못한다고?". 이런 감정이 자신을 지배하기 시작하면 기형적인 행위들을 하게 된다. 남들의 공적을 깎아 내린다거나, 모르는 것을 아는 것처럼 한다거나. 그런 하나하나가 모여 조직을 병들게 한다. 나도 내가 무언갈 못한다는 걸 인정하는 게 쉬운 일은 아니다. 그러나 병의 치료는 병을 받아들인 후인 것처럼, 내가 못하는 사실은 받아들여야 한다. 받아들인 후에는 개선의 여지가 생긴다. 나는 오늘 일단 나의 실력으로 next.js와 r3f를 해결할 수 없다는 걸 받아들이기로 했다.

세상엔 수많은 개발자가 있다. 그리고 그들은 무료로 해결방법을 찾아준다. 자신의 결과물을 꽁꽁 숨기는 건축업계의 그것과는 다르게 개발자 세상은 남들을 도와주는 것을 좋아한다. 어느 테드 강의에서 말하길 GPS 정보의 공개와 기술의 발전 속도를 언급하며 오픈소스를 설명하기도 했다. 아무튼 그들의 도움이 있기에 나도 쉽게 문제를 해결할 수 있었다. 구글링을 하면 대부분 찾아볼 수 있다. 내가 찾은 링크는 아래 링크이다

https://github.com/pmndrs/react-three-next

읽는 독자의 프로그래밍 수준에 따라 이것만 가져오는 것도 어려울 수도 있다. 예전의 나도 그랬으니까. 그럼 어떻게 할 수 있는지 아주 간략하게 이야기하는 게 나의 도리요


Node.js를 설치한다. 그래야 NPM을 쓸 수 있다.

언제 한번 Node.js가 무엇인지 제대로 한번 공부해야겠다. 아무튼 짝퉁 개발자인 나에게 Node.js는 npm을 쓰기 위한 도구다. npm은 javascript 라이브러리를 공유하는 온라인 리포지토리라고 생각하면 된다. python의 conda를 써봤다면, 콘다 패키지가 저장되어 있는 저장소와 같은 기능을 한다고 생각하면 된다. 이후 방법은 yarn을 쓸지 npm커맨드를 쓸지에 따라 달려있다. 나는 어디서 주워들은 것으로 yarn이 더 좋다 하여 yarn을 썼다.

yarn을 설치하기 위해서는 npm을 써야 한다. 관련 링크는 아래 있다.

https://classic.yarnpkg.com/lang/en/docs/install/#mac-stable

yarn 설치의 핵심은 npm install --global yarn 이 커멘드다. 


yarn을 통해 clone 하기

yarn을 통해 특정 리포들을 가져온 후 필요한 패키지를 설치할 수 있다. 문서정리를 잘해준 리포를 만나면 아주 쉽게 할 수 있다.


최근 typescript를 조금씩 써보고 있기 때문에 호기롭게 Typescript를 선택했다. 

내가 설명을 너무 불친절하게 했지만, yarn만 잘 설치되었다면 별문제 없이 되었을 것이다. 자 이제 다시 열심히 해보자

이전 11화 R3F 지옥에 입문
brunch book
$magazine.title

현재 글은 이 브런치북에
소속되어 있습니다.

작품 선택

키워드 선택 0 / 3 0

댓글여부

afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari