본문 바로가기
Dev/bootstrap

드롭다운 사용을 위한 popper.js 다운로드 for bootstrap 4.3 dropdown components

by 넥조세24 2020. 10. 21.

목차

    드롭다운 사용을 위한 Popper.js 다운로드 for Bootstrap 4.3 Dropdown Components

    안녕하세요, 블로그 독자 여러분! 오늘은 Bootstrap 4.3에서 드롭다운 컴포넌트를 사용하기 위해 필요한 Popper.js 다운로드에 대해 알아보려 합니다. 이 글을 통해 드롭다운 메뉴를 구현하면서 발생할 수 있는 문제를 해결하는 방법을 살펴보겠습니다.

    부트스트랩 3.x부터 4.3까지의 변화

    부트스트랩의 버전이 업데이트되면서 드롭다운 컴포넌트를 사용하기 위한 요구 사항도 조금씩 변화하였습니다. 부트스트랩 3.x까지는 Popper.js가 필수적으로 필요하지 않았습니다. 하지만 4.3 버전부터는 드롭다운 메뉴를 사용하려면 Popper.js를 함께 사용해야 합니다. 이로 인해 초기 설정에 조금 더 신경을 써야 하지만, 이후 드롭다운 메뉴를 효율적으로 활용할 수 있습니다.

    Popper.js 다운로드 방법

    Popper.js를 다운로드하는 가장 간단한 방법은 CDN을 이용하는 것입니다. 다만, 로컬 환경에서 파일이 필요한 경우도 있을 것입니다. 이때 로컬에 파일을 다운로드할 때 주의할 점이 있습니다.

    일단, 필요한 파일을 다운로드하는 링크는 다음과 같습니다:

    이 링크를 통해 Popper.js 파일과 Popper.js.map 파일을 다운로드할 수 있습니다. 두 파일은 일반적으로 같은 폴더에 저장되는 경우가 많으므로, 파일을 다운로드할 때는 Popper.js를 먼저 다운로드한 뒤, 파일 이름 끝에 .map을 붙여서 Popper.js.map 파일도 함께 다운로드하면 됩니다.

    Popper.js 1.14.3 버전 다운로드

    혹시 최신 버전인 Popper.js 1.14.3 버전을 다운로드하고 싶은 경우를 대비하여 해당 버전을 압축하여 올려두었습니다. 아래 링크에서 다운로드할 수 있습니다:

    혹시 필요할지 몰라서 그나마 최신 버전인 popper.js 1.14.3 버전을 압축해서 올려 둔다.

    popper.js 1.14.3.zip
    0.06MB

     

    Home

    Positioning tooltips and popovers is difficult. Popper is here to help! Popper is the de facto standard to position tooltips and popovers in modern web applications.

    popper.js.org

    이렇게 함으로써, 부트스트랩 4.3에서 드롭다운 컴포넌트를 사용하기 위해 필요한 Popper.js를 쉽게 다운로드하고 활용할 수 있습니다.

    마무리

    이렇게해서, 부트스트랩 4.3에서 드롭다운 컴포넌트를 사용하기 위해 Popper.js를 다운로드하고 설정하는 방법에 대해 알아보았습니다. Popper.js의 활용으로 더욱 동적하고 효과적인 드롭다운 메뉴를 구현할 수 있습니다. 더 자세한 내용은 부트스트랩 공식 문서와 Popper.js 공식 웹사이트를 참고하시면 도움이 될 것입니다.

    이상으로 오늘은 드롭다운 컴포넌트를 위한 Popper.js 다운로드에 대해 알아보았습니다.  

    반응형

    댓글