SigninPage 생성 및 /signin 라우팅

@@ -11403,6 +11403,11 @@
         }
       }
     },
+    "react-social-login-buttons": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/react-social-login-buttons/-/react-social-login-buttons-3.1.0.tgz",
+      "integrity": "sha512-3BU+MqWI6XibmSotZ1LFKUYSwBBzb/CYdnemizVsaFfMu6MXzfUCcbpekO1eMPQg/AI3ZUdg3zu4E3r62t80nw=="
+    },
     "react-transition-group": {
       "version": "2.9.0",
       "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.9.0.tgz",

@@ -19,6 +19,7 @@
     "react-dom": "^16.13.1",
     "react-router-dom": "^5.2.0",
     "react-scripts": "3.4.1",
+    "react-social-login-buttons": "^3.1.0",
     "reactstrap": "^8.4.1"
   },
   "scripts": {

@@ -2,6 +2,7 @@ import React from 'react';
 import LandingPage from './pages/LandingPage';
 import AboutPage from './pages/AboutPage';
 import MenuPage from './pages/MenuPage';
+import SigninPage from './pages/SigninPage';
 import {
   BrowserRouter as Router,
   Switch,
@@ -17,7 +18,8 @@ function App() {
           <Route exact path="/" component={LandingPage}/>
           <Route exact path="/about" component={AboutPage}/>
           <Route exact path="/menu" component={MenuPage}/>
-          {/* mypick, login 라우팅 */}
+          <Route exact path="/signin" component={SigninPage}/>
+          {/* mypick, signup 라우팅 */}
         </Switch>
       </>
     </Router>

@@ -36,7 +36,7 @@ const NavBar = (props) => {
                 <NavLink href="/mypick" style={{'color':'#fff'}}>MyPick</NavLink>
               </NavItem>
             </Nav>
-            <NavbarText style={{'color':'#fff'}}>OSS Project</NavbarText>
+            <NavbarText><a href="http://khuhub.khu.ac.kr/2019102227/TermProject" target="_blank" style={{'color':'#fff', 'textDecoration':'none'}}>OSS Project</a></NavbarText>
           </Collapse>  
         </Container>
       </Navbar>

+import React from 'react';
+import { Button, Form, FormGroup, Label, Input} from 'reactstrap';
+
+import {FacebookLoginButton} from 'react-social-login-buttons';
+
+const SigninPage = (props) => {
+    return (
+        <>
+            <Form style={{
+                width:'100%',
+                maxWidth:'330px',
+                padding:'15px',
+                margin:'auto',
+                height:'100%'
+            }}>
+                <a href='/' style={{'color':'#000000', textDecoration:'none'}}>
+                <h1 className="text-center">
+                    <span className="font-weight-bold">MEALKHU</span>.com
+                </h1>
+                </a>
+                <h2 className="text-center"><br/>Sign In</h2>
+                <FormGroup>
+                    <Label>Username</Label>
+                    <Input type="name" placeholder="Enter your name"></Input>
+                </FormGroup>
+                <FormGroup>
+                    <Label>Password</Label>
+                    <Input type="password" placeholder="Enter your password"></Input>
+                </FormGroup>
+                <FormGroup>
+                    <Button className="btn-lg btn-dark btn-block">Sign in</Button>
+                </FormGroup>
+                <div className="text-center pt-3">
+                Or continue with your social account
+                </div>
+                <FacebookLoginButton className="mt-3 mb-3"/>
+                <div className="text-center">
+                    <a href="/signup">Sign up here!</a>
+                </div>
+            </Form>
+            
+        </>
+    );
+}
+
+export default SigninPage;
\ No newline at end of file

@@ -251,6 +251,13 @@
         "type-is": "~1.6.18",
         "utils-merge": "1.0.1",
         "vary": "~1.1.2"
+      },
+      "dependencies": {
+        "path-to-regexp": {
+          "version": "0.1.7",
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
+          "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
+        }
       }
     },
     "finalhandler": {
@@ -466,11 +473,6 @@
       "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz",
       "integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw=="
     },
-    "path-to-regexp": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
-      "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
-    },
     "pify": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",