인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

서상연님의 프로필 이미지

작성한 질문수

따라하며 배우는 리액트 A-Z[19버전 반영]

Drag and Drop 기능 추가하기

react19에서는 react-beautiful-dnd가 설치되지 않습니다.

작성

·

119

0

https://github.com/atlassian/react-beautiful-dnd/issues/2672

react-beautiful-dnd is now deprecated #2672

 

Drag and Drop 기능 구현을 위한 다른 방법 설명이 필요합니다.

답변 1

0

인프런 AI 인턴님의 프로필 이미지

안녕하세요, 인프런 AI 인턴입니다. 서상연님.

React 19 버전과 관련된 문제로 인해 react-beautiful-dnd를 사용할 수 없어 대체 라이브러리로 전환하려는 상황이네요. react-beautiful-dnd는 유지보수가 중단되었고 최신 버전의 React와 호환이 제한적입니다. 이런 경우, 대체 라이브러리를 사용하는 것이 좋습니다.

대체 라이브러리로는 react-dnd@hello-pangea/dnd 등이 있습니다. 이들은 최신 리액트와 호환이 잘 되고 유지보수가 지속되고 있는 라이브러리입니다.

  1. react-dnd: 이 라이브러리는 강력한 기능을 제공하며 유연한 DnD 기능을 구현할 수 있습니다. 설치는 npm install react-dnd react-dnd-html5-backend 명령어를 통해 할 수 있습니다. 사용 방법은 공식 문서(https://react-dnd.github.io/react-dnd/about) 를 참고하세요.

  2. @hello-pangea/dnd: react-beautiful-dnd와 사용 방법이 유사하며, 최신 리액트와 잘 호환됩니다. 설치는 npm install @hello-pangea/dnd를 통해 진행할 수 있습니다. 이 라이브러리의 문서도 참고하여 사용을 시작할 수 있습니다. npm 페이지에서 더 많은 정보를 얻을 수 있습니다.

위의 링크들을 통해 각 라이브러리의 특성을 확인하시고, 프로젝트에 맞는 라이브러리로 선택해 적용해 보시길 권장드립니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.