๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

IT/React9

[react] React-Player๋ฅผ ํ™œ์šฉํ•˜์—ฌ YouTube ์˜์ƒ์„ ํŽ˜์ด์ง€ ๋ฐฐ๊ฒฝ์œผ๋กœ ์„ค์ •ํ•˜๊ธฐ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์„ธ๊ณ„๋ฅผ ํƒ๊ตฌํ•ฉ์‹œ๋‹ค. React ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์—์„œ ๋™์˜์ƒ ๋ฐ ์˜ค๋””์˜ค๋ฅผ ํ”Œ๋ ˆ์ดํ•˜๋ ค๋ฉด React Player ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ํ™œ์šฉํ•˜๋ฉด ๊ฐ„๋‹จํ•˜๊ฒŒ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ๋ธ”๋กœ๊ทธ ๊ธ€์—์„œ๋Š” React Player๋ฅผ ํ™œ์šฉํ•˜์—ฌ ๋™์˜์ƒ์„ ํŽ˜์ด์ง€์— ์‰ฝ๊ฒŒ ํ†ตํ•ฉํ•˜๊ณ  ์ œ์–ดํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์ž์„ธํžˆ ์‚ดํŽด๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. react ๊ตฌํ˜„ ํ™”๋ฉด 1. react-player ์„ค์น˜ ๋จผ์ €, react-player๋ฅผ ์„ค์น˜ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ํ„ฐ๋ฏธ๋„(Ctrl + J)์— ๋‹ค์Œ๊ณผ ๊ฐ™์€ ๋ช…๋ น์–ด๋ฅผ ์ž…๋ ฅํ•˜์—ฌ ์„ค์น˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. npm install react-player 2. import react-player๋ฅผ ์„ค์น˜ํ•œ ํ›„์—๋Š”, ์›ํ•˜๋Š” ์ปดํฌ๋„ŒํŠธ์— import ํ•ด์ค๋‹ˆ๋‹ค. import ReactPlayer from 'react-player/youtube' 3. ์ฝ”๋“œ.. 2023. 10. 27.
loading

ํ‹ฐ์Šคํ† ๋ฆฌํˆด๋ฐ”