2020-2_open_source_sw_development_Han / Jaksimsamil

Go to a project
Toggle navigation Toggle navigation pinning
JaeHyeok Song
140ddb0f 1 parent 7dcdb7d9

add kakao login

Inline Side-by-side
Showing 3 changed files with 54 additions and 0 deletions
...@@ -25,6 +25,8 @@ ...@@ -25,6 +25,8 @@
25 Learn how to configure a non-root public URL by running `npm run build`. 25 Learn how to configure a non-root public URL by running `npm run build`.
26 --> 26 -->
27 <title>React App</title> 27 <title>React App</title>
28 + <script>"https://developers.kakao.com/sdk/ks/kakao.min.js"</script>
29 + <script>Kakao.init("9454fd9d91effc97b064c201f04586d2");</script>
28 </head> 30 </head>
29 <body> 31 <body>
30 <noscript>You need to enable JavaScript to run this app.</noscript> 32 <noscript>You need to enable JavaScript to run this app.</noscript>
......
1 +import { makeStyles } from '@material-ui/core/styles';
2 +import TextField from '@material-ui/core/TextField';
3 +import React from 'react';
4 +import path from 'path';
5 +require("dotenv").config({
6 + path : path.join(__dirname,'/jaksimsamil-server/.env')
7 +});
8 +console.log(process.env.KAKAO_JS_KEY);
9 +
10 +const useStyles = makeStyles((theme) => ({
11 + root: {
12 + '& > *': {
13 + margin: theme.spacing(1),
14 + },
15 + },
16 + button: {
17 + margin: theme.spacing(1),
18 + },
19 +}));
20 +
21 +const KakaoLoginBtn = () => {
22 + const classes = useStyles();
23 + const kakaoLogin = function() {
24 + window.Kakao.Auth.login({
25 + success:function(auth) {
26 + console.log(auth);
27 + },
28 + fail:function(err) {
29 + console.log(err);
30 + }
31 + })
32 + }
33 + return (
34 + <div>
35 + <button onClick={kakaoLogin}>KakaoLogin</button>
36 + </div>
37 + );
38 +};
39 +
40 +export default KakaoLoginBtn
...\ No newline at end of file ...\ No newline at end of file
...@@ -8,6 +8,7 @@ import Paper from '@material-ui/core/Paper'; ...@@ -8,6 +8,7 @@ import Paper from '@material-ui/core/Paper';
8 import Grid from '@material-ui/core/Grid'; 8 import Grid from '@material-ui/core/Grid';
9 import CircularProgress from '@material-ui/core/CircularProgress'; 9 import CircularProgress from '@material-ui/core/CircularProgress';
10 import styled from 'styled-components'; 10 import styled from 'styled-components';
11 +import KakaoLoginBtn from './KakaoLogin'
11 12
12 const useStyles = makeStyles((theme) => ({ 13 const useStyles = makeStyles((theme) => ({
13 root: { 14 root: {
...@@ -80,6 +81,17 @@ const SettingForm = ({ ...@@ -80,6 +81,17 @@ const SettingForm = ({
80 /> 81 />
81 </Paper> 82 </Paper>
82 </Grid> 83 </Grid>
84 +
85 + <Grid container item xs={6}>
86 + <Paper className={classes.paper} elevation={3}>
87 + <h1>카카오 로그인</h1>
88 + <KakaoLoginBtn
89 + profile={profile}
90 + onChange={onChange}
91 + />
92 + </Paper>
93 + </Grid>
94 +
83 </Grid> 95 </Grid>
84 </div> 96 </div>
85 ); 97 );
......