JaeHyeok Song

add kakao login

......@@ -25,6 +25,8 @@
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
<script>"https://developers.kakao.com/sdk/ks/kakao.min.js"</script>
<script>Kakao.init("9454fd9d91effc97b064c201f04586d2");</script>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
......
import { makeStyles } from '@material-ui/core/styles';
import TextField from '@material-ui/core/TextField';
import React from 'react';
import path from 'path';
require("dotenv").config({
path : path.join(__dirname,'/jaksimsamil-server/.env')
});
console.log(process.env.KAKAO_JS_KEY);
const useStyles = makeStyles((theme) => ({
root: {
'& > *': {
margin: theme.spacing(1),
},
},
button: {
margin: theme.spacing(1),
},
}));
const KakaoLoginBtn = () => {
const classes = useStyles();
const kakaoLogin = function() {
window.Kakao.Auth.login({
success:function(auth) {
console.log(auth);
},
fail:function(err) {
console.log(err);
}
})
}
return (
<div>
<button onClick={kakaoLogin}>KakaoLogin</button>
</div>
);
};
export default KakaoLoginBtn
\ No newline at end of file
......@@ -8,6 +8,7 @@ import Paper from '@material-ui/core/Paper';
import Grid from '@material-ui/core/Grid';
import CircularProgress from '@material-ui/core/CircularProgress';
import styled from 'styled-components';
import KakaoLoginBtn from './KakaoLogin'
const useStyles = makeStyles((theme) => ({
root: {
......@@ -80,6 +81,17 @@ const SettingForm = ({
/>
</Paper>
</Grid>
<Grid container item xs={6}>
<Paper className={classes.paper} elevation={3}>
<h1>카카오 로그인</h1>
<KakaoLoginBtn
profile={profile}
onChange={onChange}
/>
</Paper>
</Grid>
</Grid>
</div>
);
......