[지호] sweetalert2 - boostcampwm2023/web04-ALGOCEAN GitHub Wiki

도입한 이유

기존에 별 다른 모달, 토스트 창을 만들어 두지 않고 js에서 제공하는 alert 함수를 사용하였다.

UI, UX를 고려했을 때 alert창을 계속 가져가는 것은 적합하지 않다고 판단하였고

커스터마이징 할 수 있는 모달, 토스트 창을 제공하는 라이브러리인 sweetalert2를 적용하였다.

Swal.fire({
        width: 600,
        icon: 'question',
        title: '로그인 후 질문 작성이 가능합니다 😉',
        text: '로그인 페이지로 이동하시겠습니까?',
        showCancelButton: true,
        cancelButtonText: '취소',
        confirmButtonText: '확인',
      }).then((result) => {
        if (result.isConfirmed) {
          return navigate('/login');
        }
      });

Swal.fire({
      icon: 'success',
      title: '로그인이 완료되었습니다.',
      showConfirmButton: false,
      toast: true,
      timer: 2000,
    });

Swal.fire({
        icon: 'success',
        title: '글이 임시 등록되었습니다.',
        confirmButtonText: '확인',
      });