TESIGN
์ €์žฅํ•œ ๊ฒƒ

KO ยท EN

์ž๋™ ์ƒ์„ฑ โ€” ํŽธ์ง‘ ์ „ ยท ์ˆซ์ž๋งŒ ํ™•์ธ๋œ ํŽ˜์ด์ง€์ž…๋‹ˆ๋‹ค

  1. TESIGN / RADAR
  2. ์ €์žฅ์†Œ ์นด๋“œ
  3. pmndrs/react-three-fiber

pmndrs/react-three-fiber

๐Ÿ‡จ๐Ÿ‡ญ A React renderer for Three.js

โ˜… 32.3kโ–ฒ +2 / 7d์ตœ๊ทผ 14์ผ์˜ ์ผ๋ณ„ ๋ณ„ ์ฆ๊ฐ€. ๋นˆ ๋ง‰๋Œ€๋Š” ๊ด€์ธก ์—†์Œ. ๋งˆ์ง€๋ง‰ ๋‚ ์€ ์ผ๋ถ€์ผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.2026-09-03 +22026-09-04 +92026-09-05 +52026-09-06 +22026-09-07 +22026-09-08 ๊ด€์ธก ์—†์Œ2026-09-09 ๊ด€์ธก ์—†์Œ2026-09-10 ๊ด€์ธก ์—†์Œ2026-09-11 ๊ด€์ธก ์—†์Œ2026-09-12 +22026-09-13 ๊ด€์ธก ์—†์Œ2026-09-14 ๊ด€์ธก ์—†์Œ2026-09-15 ๊ด€์ธก ์—†์Œ2026-09-16 ๊ด€์ธก ์—†์Œ14์ผ ์ค‘ ๊ฐ€์žฅ ํฐ ํ•˜๋ฃจ ์ฆ๊ฐ€+9์ตœ๊ทผ 14์ผ ยท ํ•˜๋ฃจ ๋ณ„ ์ฆ๊ฐ€๋นˆ์นธ = ๊ด€์ธก ์—†์Œ

์ˆœ์œ„ ์—ญ๋Œ€ 225์œ„

ํ•œ๋ˆˆ์— ๋ณด๋Š” ์‚ฌ์‹ค

์–ธ์–ด
TypeScript
๋ผ์ด์„ ์Šค
MIT
์‚ฌ์šฉ ๋ฒ”์œ„
์ƒ์—… ์ด์šฉยท์ˆ˜์ •ยท์žฌ๋ฐฐํฌ ๊ฐ€๋Šฅ. ์ €์ž‘๊ถŒ ๊ณ ์ง€๋Š” ์œ ์ง€.
ํ™œ๋™
๋งˆ์ง€๋ง‰ ์ปค๋ฐ‹ 3์ผ ์ „ ()
ํ† ํ”ฝ
  • 3d
  • animation
  • fiber
  • react
  • renderer
  • threejs
ํ™ˆํŽ˜์ด์ง€
https://docs.pmnd.rs/react-three-fiber
์ €์žฅ์†Œ
GitHub โ†—

์š”์•ฝ์ด๋ฉฐ ๋ฒ•์  ์กฐ์–ธ์ด ์•„๋‹™๋‹ˆ๋‹ค.

README ๋ฐœ์ทŒ

@react-three/fiber react-three-fiber is a React renderer for threejs. Build your scene declaratively with re-usable, self-contained components that react to state, are readily interactive and can participate in React's ecosystem. [!WARNING] Three-fiber is a React renderer, it must pair with a major version of React, just like react-dom, react-native, etc. @react-three/fiber@8 pairs with react@18, @react-three/fiber@9 pairs with react@19. --- Does it have limitations? None. Everything that works in Threejs will work here without exception. Is it slower than plain Threejs? No. There is no overhead. Components render outside of React. It outperforms Threejs in scale due to React's scheduling abilities. Can it keep up with frequent feature updates to Threejs? Yes. It merely expresses Threejs in JSX, dynamically turns into new THREE.Mesh() . If a new Threejs version adds, removes or changes features, it will be available to you instantly without depending on updates to this library. What does it look like? Let's make a re-usable component that has its own state, reacts to user-input and participates in the render-loop. ( live demo ). Show TypeScript example Live demo: https://codesandboโ€ฆ

GitHub README์˜ ์•ž๋ถ€๋ถ„์„ ์ €์žฅ๋œ ๊ทธ๋Œ€๋กœ ์ตœ๋Œ€ 1,200์ž๊นŒ์ง€ ์˜ฎ๊ฒผ์Šต๋‹ˆ๋‹ค. ๋งˆํฌ๋‹ค์šด ์„œ์‹์€ ํ‘œ์‹œํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.

ํƒ€์ž„๋ผ์ธ

  1. ์ €์žฅ์†Œ ์ƒ์„ฑ
  2. TESIGN์ด ์ฒ˜์Œ ๋ณธ ์‹œ๊ฐ โ—Œ ๊ณผ๊ฑฐ ๊ธฐ๋ก
  3. ๋งˆ์ง€๋ง‰ push

๋ชฉ๋ก์€ ์šด์˜์ž์˜ ์œ„์ž„์„ ๋ฐ›์•„ AI๊ฐ€ ๊ณ ๋ฆ…๋‹ˆ๋‹ค. 2026๋…„ 9์›”์—๋Š” ์‚ฌ๋žŒ์ด ์ง์ ‘ ๊ฒ€์ˆ˜ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ๋ณ„ ์ดํ•ฉยท์ฆ๊ฐ€๋Ÿ‰ยท๊ต์ฐจ ์ถœ์ฒ˜ยท๋งˆ์ง€๋ง‰ ์—…๋ฐ์ดํŠธยท๋ผ์ด์„ ์Šค๋ฅผ ํŒ๋‹จ ๊ทผ๊ฑฐ๋กœ ๋ณด์—ฌ์ค๋‹ˆ๋‹ค. ์ˆœ์œ„ ๊ณ„์‚ฐ ๋ฐฉ๋ฒ• โ†’

์ด ์ €์žฅ์†Œ์— ํŽธ์ง‘ ๋ฌธ๊ตฌ(์™œยท๋นŒ๋“œยท๋ˆ„๊ฐ€ยท์‹œ์ž‘ยท์ฃผ์˜)๊ฐ€ ๋ถ™์œผ๋ฉด ์ •์‹ ํ•ญ๋ชฉ์œผ๋กœ ์Šน๊ฒฉ๋ฉ๋‹ˆ๋‹ค. ๊ทธ๋•Œ๊นŒ์ง€๋Š” ์ €์žฅ๋œ GitHub ๋ฉ”ํƒ€๋ฐ์ดํ„ฐ์™€ ์ˆซ์ž๋งŒ ๋ณด์—ฌ์ค๋‹ˆ๋‹ค.