#32 로그아웃

[인프런] 따라하며 배우는 노드, 리액트 시리즈 - 기본강의를 들으며 정리한 내용입니다.

 

 

1. LandingPage.js 파일에 로그아웃 버튼 및 기능 추가

import React from "react";
import axios from "axios";
import { useNavigate } from "react-router-dom";

export default function LandingPage() {
	const navigate = useNavigate();

	const onLogoutHandler = () => {
		axios.get("/api/users/logout").then((response) => {
			if (response.data.success) {
				navigate("/LoginPage");
			} else {
				alert("로그아웃에 실패했습니다.");
			}
		});
	};

	return (
		<div
			style={{
				display: "flex",
				justifyContent: "center",
				alignItems: "center",
				width: "100%",
				height: "100vh",
			}}
		>
			시작 페이지
			<button onClick={onLogoutHandler}>로그아웃</button>
		</div>
	);
}