React 31장 - 로그인 구현하기 (6)

React

자료 구조

• client
  • …
  • src
    • pages
      • components
        • Loading.js
        • UserInfo.js
      • Login.js
      • Mypage.js
    • App.css
    • App.js
    • index.js
  • .env
  • .gitignore
• server
  • controllers
    • users
      • callback.js
      • logout.js
      • userinfo.js
    • index.js
  • data
    • data.js
  • .env
  • .gitignore
  • index.js

클라이언트

client/.env

CLIENT_ID = ******

• GitHub App에서 제공하는 Client ID를 가져와서 환경 변수에 담는다.
• 값으로 암호화된 salt역할을 한다.

client/src/App.js

import { BrowserRouter, Routes, Route } from "react-router-dom";
import Login from "./pages/Login";
import MyPage from "./pages/MyPage";
import { useState, useEffect } from "react";
import axios from "axios";

function App() {
  const [isLogin, setIsLogin] = useState(false);
  const [accessToken, setAccessToken] = useState("");

  const getAccessToken = async (authorizationCode) => {
    axios.post;
  };
}

client/src/pages/Mypage.js

client/src/pages/Login.js