inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

인터랙티브 개발 실무 끝장내기 [역량 강화편]

오브젝트 랜덤으로 뿌리기 (appendChild)

여기에 나오는 강의들 리액트로 작성하기 쉬운편인가요?

229

반가우면반갑다고해

작성한 질문수 142

0

안녕하세요!

리액트는 직접적으로 dom을 건드리면 안된다고 알고 있습니다.

그래서 인프런에있는 인터랙티브 강의들을 보고 리액트에서 동작

해주게끔 하고싶은데, 제가 리액트에대한 지식이 부족해서인지

조금 어려움이 있는데요..

useRef()를 사용해주는 방법이 있지만, 너무 사용이 잦은것 같아

고민이고, 또 다른 강사님들은 어떤식으로 구현을 하는지 들여다보고싶습니다.

나중에 리액트로 인터랙티브하게 만드는 강의를 내주실 계획이 있으신지 혹은 리액트로 인터랙티브하게 만들어보신 코드가 있다면 한펀 살펴보고싶습니다!

인터랙티브-웹 javascript

답변 2

1

반가우면반갑다고해

답변 너무 감사합니다!
강사님이 짜신 코드들부터 이해하고,습득한 후에 남겨주신 링크들을 따라치고 이해하고 또 습득하겠습니다!

1

코딩일레븐

안녕하세요 리액트 + 인터랙티브 관련 문의가 종종 있네요.

저도 아직 리액트에서 인터랙티브 스크립트를 사용해보지 않았습니다.

리액트는 아시다시피 돔 자체를 건드리지 않다보니 필요한 경우에는 useRef()를 사용해주셔도 될 것 같고요

질문 주신 예제 영상처럼 랜덤으로 뿌려지는 모션이라면 컴포넌트를 만들어서 뿌려주는 것도 괜찮을 것 같습니다.

다른 강의에 비슷한 질문을 주셔서 아래 url을 드렸는데 참고해보세요.

https://ihatetomatoes.net/react-and-greensock-tutorial-for-beginners/

_

스크롤 이벤트 사용 방법도 첨부드립니다.

componentDidMount() {
    window.addEventListener('scroll', this.handleScroll, true);
  }

https://gist.github.com/koistya/934a4e452b61017ad611

다음 강의를 한다면 우선 three.js를 할까 하고 있습니다.

리액트 + 인터랙티브는 저도 조금 더 연구를 해야할 것 같네요.

모바일 스와이프 구현 마지막 숙제

0

418

2

레퍼런스 사이트

0

353

1

스크롤위치에 따른 페이지 변화에서

0

279

1

배열을 이용한 bg컬러 변경 강의에서 tagname body에 [0]이 왜 붙나요?

0

395

1

스크롤 위치에 따른 페이지 변화 - scroll 이벤트 에 대한 질문

0

683

1

페이징.페이지고정2 질문드립니다.

0

465

1

scrollTo 완성본

0

614

2

모바일 3D 입체 카드 제작 아이폰에서 에러

0

392

1

css 질문 드립니다

0

630

1

css 질문

0

291

1

pointBtn.addEventListner("click")

0

315

2

if문의 첫번째 조건 질문 있습니다~

0

289

1

offsetTop, offsetHeight

0

793

2

기존의 축 회전값에 더해서 rotate

0

323

1

모바일 드래그 강의 질문드립니다!

0

262

1

질문입니다.

0

227

1

GSAP(트윈맥스) 라이센스 관련 질문 드립니다.

0

1664

1

wrap 안에 click 이벤트

0

230

1

greensock을 사용하려면

0

705

1

TweenMax 효과 리셋

0

534

1

max 이상으로 입력했을 때 질문입니다.

0

198

1

dom에서 직접i nput의 value 값을 갖고 나오는 것에 대해

0

376

1

화살표 회전 질문

0

269

1

질문이용~

0

224

1