정성훈 / MEALKHU

Go to a project
Toggle navigation Toggle navigation pinning
swa07016
e83c65e4 1 parent 3391bd34

SignupPage 생성 및 /signup 라우팅

Inline Side-by-side
Showing 3 changed files with 53 additions and 3 deletions
...@@ -3,6 +3,8 @@ import LandingPage from './pages/LandingPage'; ...@@ -3,6 +3,8 @@ import LandingPage from './pages/LandingPage';
3 import AboutPage from './pages/AboutPage'; 3 import AboutPage from './pages/AboutPage';
4 import MenuPage from './pages/MenuPage'; 4 import MenuPage from './pages/MenuPage';
5 import SigninPage from './pages/SigninPage'; 5 import SigninPage from './pages/SigninPage';
6 +import SignupPage from './pages/SignupPage';
7 +
6 import { 8 import {
7 BrowserRouter as Router, 9 BrowserRouter as Router,
8 Switch, 10 Switch,
...@@ -19,7 +21,8 @@ function App() { ...@@ -19,7 +21,8 @@ function App() {
19 <Route exact path="/about" component={AboutPage}/> 21 <Route exact path="/about" component={AboutPage}/>
20 <Route exact path="/menu" component={MenuPage}/> 22 <Route exact path="/menu" component={MenuPage}/>
21 <Route exact path="/signin" component={SigninPage}/> 23 <Route exact path="/signin" component={SigninPage}/>
22 - {/* mypick, signup 라우팅 */} 24 + <Route exact path="/signup" component={SignupPage}/>
25 + {/* mypick 라우팅 */}
23 </Switch> 26 </Switch>
24 </> 27 </>
25 </Router> 28 </Router>
......
...@@ -21,11 +21,11 @@ const SigninPage = (props) => { ...@@ -21,11 +21,11 @@ const SigninPage = (props) => {
21 <h2 className="text-center"><br/>Sign In</h2> 21 <h2 className="text-center"><br/>Sign In</h2>
22 <FormGroup> 22 <FormGroup>
23 <Label>Username</Label> 23 <Label>Username</Label>
24 - <Input type="name" placeholder="Enter your name"></Input> 24 + <Input required="required" type="name" placeholder="Enter your name"></Input>
25 </FormGroup> 25 </FormGroup>
26 <FormGroup> 26 <FormGroup>
27 <Label>Password</Label> 27 <Label>Password</Label>
28 - <Input type="password" placeholder="Enter your password"></Input> 28 + <Input required="required" type="password" placeholder="Enter your password"></Input>
29 </FormGroup> 29 </FormGroup>
30 <FormGroup> 30 <FormGroup>
31 <Button className="btn-lg btn-dark btn-block">Sign in</Button> 31 <Button className="btn-lg btn-dark btn-block">Sign in</Button>
......
1 +import React from 'react';
2 +import { Button, Form, FormGroup, Label, Input} from 'reactstrap';
3 +
4 +import {FacebookLoginButton} from 'react-social-login-buttons';
5 +
6 +const SigninPage = (props) => {
7 + return (
8 + <>
9 + <Form style={{
10 + width:'100%',
11 + maxWidth:'330px',
12 + padding:'15px',
13 + margin:'auto',
14 + height:'100%'
15 + }}>
16 + <a href='/' style={{'color':'#000000', textDecoration:'none'}}>
17 + <h1 className="text-center">
18 + <span className="font-weight-bold">MEALKHU</span>.com
19 + </h1>
20 + </a>
21 + <h2 className="text-center"><br/>Sign Up</h2>
22 + <FormGroup>
23 + <Label>Username</Label>
24 + <Input required="required" type="name" placeholder="Enter your name"></Input>
25 + </FormGroup>
26 + <FormGroup>
27 + <Label>Password</Label>
28 + <Input required="required" type="password" placeholder="Enter your password"></Input>
29 + </FormGroup>
30 + <FormGroup>
31 + <Label>Confirm Password</Label>
32 + <Input required="required" type="password" placeholder="Enter your password again"></Input>
33 + </FormGroup>
34 + <FormGroup>
35 + <Button className="btn-lg btn-dark btn-block">Sign up</Button>
36 + </FormGroup>
37 +
38 + <div className="text-center mt-3">
39 + <a href="/signin">Sign in here!</a>
40 + </div>
41 + </Form>
42 +
43 + </>
44 + );
45 +}
46 +
47 +export default SigninPage;
...\ No newline at end of file ...\ No newline at end of file