Skip to content

GitLab

Commit c61f522c authored by kusang96's avatar kusang96
Browse files

merge into jaeyeon

parents a5f0af34 791c9a51
Hide whitespace changes
Inline Side-by-side
.env
View file @ c61f522c
BROWSER=none BROWSER=none
PORT=4000 PORT=4000
MONGO_URI=mongodb://localhost/ MONGO_URI=mongodb://localhost/shopping-mall
\ No newline at end of file \ No newline at end of file
client/package.json
View file @ c61f522c
...@@ -38,5 +38,6 @@ ...@@ -38,5 +38,6 @@
"last 1 firefox version", "last 1 firefox version",
"last 1 safari version" "last 1 safari version"
] ]
} },
"proxy":"http://localhost:3001"
} }
client/src/Components/MainNav.js
View file @ c61f522c
...@@ -7,6 +7,7 @@ import option from '../option.svg'; ...@@ -7,6 +7,7 @@ import option from '../option.svg';
function MainNav() { function MainNav() {
function handleClick() { function handleClick() {
alert('로그아웃이 완료되었습니다.') alert('로그아웃이 완료되었습니다.')
window.location.href="/home"
} }
return ( return (
......
client/src/Components/SubNav.js
View file @ c61f522c
...@@ -22,7 +22,7 @@ function SubNav() { ...@@ -22,7 +22,7 @@ function SubNav() {
} }
return ( return (
<Navbar sticky="top" className="flex-nowrap" style={{ top: "62px", paddingTop: "0", paddingBottom: "0", backgroundColor: "#fff" }}> <Navbar sticky="top" className="flex-nowrap" style={{ top: "62px", paddingTop: "0", paddingBottom: "0", backgroundColor: "#fff", overflowX: "auto" }}>
<style type="text/css"> <style type="text/css">
{` {`
.nav-link, .nav-link:hover, .nav-link:active { .nav-link, .nav-link:hover, .nav-link:active {
......
client/src/Pages/Login.js
View file @ c61f522c
...@@ -10,8 +10,7 @@ function Login(){ ...@@ -10,8 +10,7 @@ function Login(){
const handleSubmit=(e)=>{ const handleSubmit=(e)=>{
const form =e.currentTarget; const form =e.currentTarget;
console.log(form) if(form.checkValidity() === false){ //checkValidity 는 입력 요소에 유효한 데이터가 포함되어 있는지 확인
if(form.checkValidity() === false){
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
} }
......
client/src/Pages/Signup.js
View file @ c61f522c
...@@ -2,78 +2,61 @@ import React, { useState, useEffect, useRef } from 'react'; ...@@ -2,78 +2,61 @@ import React, { useState, useEffect, useRef } from 'react';
import { Redirect } from 'react-router-dom'; import { Redirect } from 'react-router-dom';
import Nav1 from '../Components/MainNav'; import Nav1 from '../Components/MainNav';
import Nav2 from '../Components/SubNav'; import Nav2 from '../Components/SubNav';
import { Form, Col, Container, Button, Row } from 'react-bootstrap'; import { Form, Col, Container, Button, Row, Alert } from 'react-bootstrap'
import DaumPostcode from "react-daum-postcode"; import FormCheckInput from 'react-bootstrap/esm/FormCheckInput';
const INIT_USER = {
name: '',
number: '',
id: '',
password: '',
password2: '',
tel: ''
}
function Signup() { function Signup() {
const [address,setAddress] =useState("") const [user, setUser] = useState(true)
//const [disabled, setDisabled] = useState(true)
const handleComplete = (data) => { const [error, setError] = useState('')
let fullAddress = data.address;
let extraAddress = ""; //useEffect(() => {
// const isUser = Object.values(user).every(el => Boolean(el))
console.log(data) // isUser ? setDisabled(false) : setDisabled(true)
//}, user)
if (data.addressType === "R") {
if (data.bname !== "") { function handleChange(event) {
extraAddress += data.bname; const { name, value } = event.target
console.log(extraAddress) setUser({ ...user, [name]: value })
}
if (data.buildingName !== "") {
extraAddress +=
extraAddress !== "" ? `, ${data.buildingName}` : data.buildingName;
}
fullAddress += extraAddress !== "" ? ` (${extraAddress})` : "";
}
setAddress({full: fullAddress, zone: data.zonecode});
console.log(fullAddress);
}
const Postcode = () => {
return (
<DaumPostcode
onComplete={handleComplete}
/>
);
} }
const [post, setPost] = useState([]);
function postClick() {
if (post.length !== 0) {
setPost([])
} else {
setPost(
<div>
<DaumPostcode style={postCodeStyle} onComplete={handleComplete} />
</div>
)
}
}
const postCodeStyle = {
position: "absolute",
width: "400px",
height: "500px",
padding: "7px",
};
const [validated, setValidated] = useState(false); const [validated, setValidated] = useState(false);
const handleSubmit = (e) => { async function handleSubmit(event) {
const form = e.currentTarget; event.preventDefault()
const form = event.currentTarget;
console.log(form) console.log(form)
if (form.checkValidity() === false) { if (form.checkValidity() === false) {
e.preventDefault(); event.preventDefault();
e.stopPropagation(); event.stopPropagation();
} }
setValidated(true); setValidated(true);
console.log(user)
try {
setError('')
const response = await fetch('/api/users/signup', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(user)
})
const data = await response.json()
console.log(data)
} catch (error) {
console.log(error)
setError('다시 시도하세요.')
}
} }
return ( return (
...@@ -81,32 +64,50 @@ function Signup() { ...@@ -81,32 +64,50 @@ function Signup() {
<Nav1 /> <Nav1 />
<Nav2 /> <Nav2 />
<Container className="my-5"> <Container className="my-5">
{error && <Alert variant='danger'>
{error}
</Alert>}
<Row className="justify-content-center"> <Row className="justify-content-center">
<Col md={6} xs={10} className="border" style={{ background: '#F7F3F3' }}> <Col md={6} xs={10} className="border" style={{ background: '#F7F3F3' }}>
<h2 className="text-center mt-5">Sign Up</h2> <h2 className="text-center mt-5">Sign Up</h2>
<Form noValidate validated={validated} onSubmit={handleSubmit} className="p-5"> <Form
noValidate validated={validated}
onSubmit={handleSubmit}
className="p-5">
<Form.Group controlId="formBasicName"> <Form.Group controlId="formBasicName">
<Form.Row> <Form.Row>
<Form.Label for="name">이 름</Form.Label> <Col sm={4} xs={6} as={Form.Label} for="id">이 름</Col>
<Col> <Col sm={8} xs={12} as={Form.Control}
<Form.Control required type="text"
required name="name"
type="text" id="name" placeholder="Name"
size="sm" placeholder="" className="mx-sm-3"> style={{ width: '160px' }}
</Form.Control> value={user.name}
<Form.Control.Feedback type="invalid">이름을 입력하세요. </Form.Control.Feedback> onChange={handleChange} />
</Col> <Form.Control.Feedback type="invalid">이름을 입력하세요. </Form.Control.Feedback>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
<Form.Group controlId="formBasicNumber"> <Form.Group controlId="formBasicNumber">
<Form.Row> <Form.Row>
<Form.Label for="number">주민등록번호</Form.Label> <Col sm={4} xs={6} as={Form.Label} for="number">주민등록번호</Col>
<Col as={Row} sm={8} xs={10} >
<Col as={Row}> <Form.Control
<Form.Control required type="text" id="number1" size="sm" maxlength="6" className="mx-sm-3" style={{ width: '120px' }}></Form.Control> required type="text"
name="number1"
maxlength="6"
className="mx-2" style={{ width: '17 0px' }}
value={user.number1}
onChange={handleChange}>
</Form.Control>
- -
<Form.Control required type="text" id="number2" size="sm" maxlength="1" className="mx-sm-3" style={{ width: '25px' }}></Form.Control> <Form.Control
required type="text"
name="number2"
maxlength="1" className="mx-3"
style={{ width: '50px' }}
value={user.number2}
onChange={handleChange}>
</Form.Control>
****** ******
<Form.Control.Feedback type="invalid">주민등록번호를 입력하세요.</Form.Control.Feedback> <Form.Control.Feedback type="invalid">주민등록번호를 입력하세요.</Form.Control.Feedback>
</Col> </Col>
...@@ -114,64 +115,66 @@ function Signup() { ...@@ -114,64 +115,66 @@ function Signup() {
</Form.Group> </Form.Group>
<Form.Group controlId="formBasicId"> <Form.Group controlId="formBasicId">
<Form.Row> <Form.Row>
<Form.Label for="id">아이디</Form.Label> <Col sm={4} xs={6} as={Form.Label} for="id">아이디</Col>
<Col sm={8} xs={12} as={Form.Control}
<Col> required
<Form.Control required type="text" id="id" size="sm" placeholder="ID" className="mx-sm-3"></Form.Control> type="text"
<Form.Control.Feedback type="invalid"> 아이디를 입력하세요.</Form.Control.Feedback> name="id"
</Col> placeholder="ID"
style={{ width: '160px' }}
value={user.id}
onChange={handleChange} />
<Form.Control.Feedback type="invalid"> 아이디를 입력하세요.</Form.Control.Feedback>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
<Form.Group controlId="formBasicPassword"> <Form.Group controlId="formBasicPassword">
<Form.Row> <Form.Row>
<Form.Label for="password">비밀번호</Form.Label> <Col sm={4} xs={6} as={Form.Label} for="password">비밀번호</Col>
<Col sm={8} xs={12} as={Form.Control}
<Col> type="password"
<Form.Control required type="password" id="password" size="sm" placeholder="Password" aria-describedby="passwordHelpBlock" className="mx-sm-3"></Form.Control> name="password"
<Form.Text id="password" muted> 8-15자로 입력해주세요.</Form.Text> placeholder="Password"
<Form.Control.Feedback type="invalid"> 비밀번호를 입력하세요. style={{ width: '160px' }}
value={user.password}
required
onChange={handleChange} />
<Form.Control.Feedback className="text-center" type="invalid">
비밀번호를 입력하세요.
</Form.Control.Feedback> </Form.Control.Feedback>
</Col>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
<Form.Group controlId="formBasicPassword2"> <Form.Group controlId="formBasicPassword2">
<Form.Row> <Form.Row>
<Form.Label for="password2">비밀번호 확인</Form.Label> <Col sm={4} xs={6} as={Form.Label} for="password">비밀번호 확인</Col>
<Col sm={8} xs={12} as={Form.Control}
<Col> type="password"
<Form.Control required type="password" id="password2" size="sm" placeholder="" className="mx-sm-3"></Form.Control> name="password2"
<Form.Control.Feedback type="invalid"> 비밀번호를 한번 더 입력하세요. placeholder="Password"
style={{ width: '160px' }}
value={user.password2}
required
onChange={handleChange} />
<Form.Control.Feedback type="invalid"> 비밀번호를 한번 더 입력하세요.
</Form.Control.Feedback> </Form.Control.Feedback>
</Col>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
<Form.Group controlId="formBasicTel"> <Form.Group controlId="formBasicTel">
<Form.Row> <Form.Row>
<Form.Label for="tel">휴대전화</Form.Label> <Col sm={4} xs={6} as={Form.Label} for="tel">휴대전화</Col>
<Col sm={8} xs={12} as={Form.Control}
<Col> required
<Form.Control required type="text" id="tel" size="sm" placeholder="" className="mx-sm-3"></Form.Control> type="text"
<Form.Control.Feedback type="invalid"> 휴대전화를 입력하세요. </Form.Control.Feedback> name="tel"
</Col> size="sm" style={{ width: '160px' }}
</Form.Row> value={user.tel}
</Form.Group> onChange={handleChange} />
<Form.Control.Feedback type="invalid"> 휴대전화를 입력하세요. </Form.Control.Feedback>
<Form.Group controlId="formBasicAdd">
<Form.Row>
{console.log("address=", address)}
<Form.Label className="mx-3">주 소</Form.Label>
<Form.Control required type="text" id="add" size="sm " style={{ width: '120px' }} value={address.zone} disabled={(address.zone == null) ? false : true} ></Form.Control>
<Button size="sm" style={{ background: '#91877F', borderColor: '#91877F' }} className="mx-3" type="button" onClick={postClick}>주소 찾기</Button>
{post}
<Form.Control required type="text" id="add" size="sm " value={address.full} disabled={(address.zone == null) ? false : true} className="mx-3"style={{width:'330px'}}></Form.Control>
<Form.Control required type="text" id="add2" size="sm" placeholder="상세주소" className="mx-sm-3"></Form.Control>
<Form.Control.Feedback type="invalid" > 상세 주소를 입력하세요. </Form.Control.Feedback>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
<Button style={{ background: '#91877F', borderColor: '#91877F' }} type="submit" block>Sign Up</Button> <Button
style={{ background: '#91877F', borderColor: '#91877F' }} type="submit" block>
Sign Up
</Button>
</Form> </Form>
</Col> </Col>
</Row> </Row>
......
server/app.js
View file @ c61f522c
...@@ -33,7 +33,7 @@ app.use(express.json()); ...@@ -33,7 +33,7 @@ app.use(express.json());
// app.listen(port, () => console.log(port)); // app.listen(port, () => console.log(port));
app.listen(3001, () => console.log('Listenning')); app.listen(3001, () => console.log('Listenning'));
app.use(userRouter) app.use('/api/users',userRouter)
// catch 404 and forward to error handler // catch 404 and forward to error handler
// app.use(function(req, res, next) { // app.use(function(req, res, next) {
......
server/config.js
View file @ c61f522c
...@@ -2,7 +2,7 @@ const config = { ...@@ -2,7 +2,7 @@ const config = {
env: process.env.NODEENV || 'development', env: process.env.NODEENV || 'development',
port: process.env.PORT || 3001, port: process.env.PORT || 3001,
jwtSecret: process.env.JWT_SECRET || 'My_Secret_Key', jwtSecret: process.env.JWT_SECRET || 'My_Secret_Key',
mongoDbUri: process.env.MONGEDB_URI || 'mongodb://localhost/' mongoDbUri: process.env.MONGEDB_URI || 'mongodb://localhost/shopping-mall'
} }
export default config export default config
\ No newline at end of file
server/controllers/user.controller.js
View file @ c61f522c
import User from "../models/User.js"; import User from "../models/User.js";
import isLength from 'validator/lib/isLength.js'
const signup = async (req, res) => { const signup = async (req, res) => {
const { name, email, password } = req.body console.log(req.body)
console.log('req.body.name=', req.body.name)
const { name, number1, number2, id, password, password2, tel } = req.body
try { try {
if(!isLength(password,{min:8, max:15})){
return res.status(422).json({message: '비밀번호는 8-15자리로 입력해주세요.'})
}
const newUser = await new User ({ const newUser = await new User ({
name, name,
email, number1,
password number2,
id,
password,
password2,
tel
}).save() }).save()
console.log(newUser) console.log(newUser)
res.json(newUser) res.json(newUser)
} catch (error) { } catch (error) {
console.log(error) console.log(error)
res.status(500).send('죄송합니다. 다시 입력해 주십시오.') res.status(500).json({message:'죄송합니다. 다시 입력해 주십시오.'})
} }
} }
......
server/models/User.js
View file @ c61f522c
...@@ -5,9 +5,9 @@ const { String } = mongoose.Schema.Types ...@@ -5,9 +5,9 @@ const { String } = mongoose.Schema.Types
const UserSchema = new mongoose.Schema({ const UserSchema = new mongoose.Schema({
name: { name: {
type: String, type: String,
required: true, required: true, // 꼭 필요한 값
}, },
email: { id: {
type: String, type: String,
required: true, required: true,
unique: true, unique: true,
...@@ -15,7 +15,21 @@ const UserSchema = new mongoose.Schema({ ...@@ -15,7 +15,21 @@ const UserSchema = new mongoose.Schema({
password: { password: {
type: String, type: String,
required: true, required: true,
select: true, },
number1:{
type:String,
required:true,
unique:true
},
number2:{
type:String,
required:true,
unique:true
},
tel:{
type:String,
required:true,
unique:true
}, },
role: { role: {
type: String, type: String,
......
server/package.json
View file @ c61f522c
...@@ -5,6 +5,7 @@ ...@@ -5,6 +5,7 @@
"type": "module", "type": "module",
"main": "app.js", "main": "app.js",
"scripts": { "scripts": {
"dev": "nodemon app.js",
"test": "echo \"Error: no test specified\" && exit 1" "test": "echo \"Error: no test specified\" && exit 1"
}, },
"keywords": [], "keywords": [],
......
server/routes/user.routes.js
View file @ c61f522c
...@@ -3,7 +3,7 @@ import userCtrl from '../controllers/user.controller.js'; ...@@ -3,7 +3,7 @@ import userCtrl from '../controllers/user.controller.js';
const router = express.Router() const router = express.Router()
router.route('/api/users/signup') router.route('/signup')
.post(userCtrl.signup) .post(userCtrl.signup)
.get(userCtrl.hello) .get(userCtrl.hello)
......
server/schemas/index.js
View file @ c61f522c
...@@ -4,9 +4,9 @@ import config from '../config.js'; ...@@ -4,9 +4,9 @@ import config from '../config.js';
const connection = {} const connection = {}
async function connectDb() { async function connectDb() {
// if (connection.isConnection) { if (connection.isConnection) {
// return return
// } }
const db = await mongoose.connect(config.mongoDbUri, { const db = await mongoose.connect(config.mongoDbUri, {
useNewUrlParser: true, useNewUrlParser: true,
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment