코딩항해기

[JS] SweetAlert2 라이브러리 본문

HTML CSS JS

[JS] SweetAlert2 라이브러리

miniBcake 2024. 11. 9. 16:31

 

 

SweetAlert2

스위트 알랏은 기본 alert()창 대신 사용할 수 있는 예쁜 알림창 라이브러리다. 다양한 스타일과 애니메이션을 제공하며 커스터마이징이 가능한 것이 특징이다. 또한 Promise 기반으로 동작해 사용자 응답에 따른 후속 처리가 용이하다.

 

 

 

SweetAlert2

SweetAlert2 - a beautiful, responsive, customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes

sweetalert2.github.io

 

 

환경 구성

CDN

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

(* Jsdelivr CDN 서비스)

 

CSS JS 분리버전

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11.4.10/dist/sweetalert2.min.css">
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.4.10/dist/sweetalert2.min.js"></script>

 

 

 

jsDelivr - A free, fast, and reliable CDN for JS and Open Source

Optimized for JS and ESM delivery from npm and GitHub. Works with all web formats. Serving more than 150 billion requests per month.

www.jsdelivr.com

 

 

사용 예제

 

SweetAlert2

SweetAlert2 - a beautiful, responsive, customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes

sweetalert2.github.io

 

 

공식 사이트 Recipe Gallery에서 다양한 사용 예제를 제공하고 있다.

 

 

 

추가 참고 : https://inpa.tistory.com/entry/SweetAlert2-%F0%9F%93%9A-%EC%84%A4%EC%B9%98-%EC%82%AC%EC%9A%A9#sweetalert2_%EC%84%A4%EC%B9%98

'HTML CSS JS' 카테고리의 다른 글

[HTML] 캐노니컬 태그 (+ HTML 문서가 아닐 때 캐노니컬)  (0) 2024.11.29
[Web] 검색 엔진 최적화 SEO  (3) 2024.11.29
[Bootstrap] 부트스트랩 프레임워크  (2) 2024.11.09
[JS] 콜백 지옥 Callback Hell  (0) 2024.11.08
[JS] Promise  (0) 2024.11.07
'HTML CSS JS' Related Articles more