Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
shopping-mall
Commits
afcd633d
Commit
afcd633d
authored
Jan 08, 2021
by
Jiwon Yoon
Browse files
22
parent
61275de9
Changes
14
Hide whitespace changes
Inline
Side-by-side
client/src/App.js
View file @
afcd633d
import
logo
from
'
./logo.svg
'
;
import
'
./App.css
'
;
import
{
Button
}
from
'
react-bootstrap
'
;
import
{
Router
}
from
'
react-router-dom
'
;
import
Login
from
'
./Login
'
import
LogoutButton
from
'
./LogoutButton
'
import
{
signIn
}
from
'
./auth
'
import
{
BrowserRouter
as
Router
,
Route
,
Redirect
,
Switch
}
from
'
react-router-dom
'
;
import
Home
from
'
./Pages/Home
'
;
import
Login
from
'
./Pages/Login
'
;
import
Signup
from
'
./Pages/Signup
'
;
import
Product
from
"
./Pages/Product
"
;
import
ProductsList
from
"
./Pages/ProductsList
"
;
import
Admin
from
'
./Pages/Admin
'
;
import
ProductRegist
from
'
./Pages/ProductRegist
'
;
import
ShoppingCart
from
'
./Pages/ShoppingCart
'
;
import
Payment
from
'
./Pages/Payment
'
;
import
Account
from
'
./Pages/Account
'
;
import
MainNav
from
'
./Components/MainNav
'
;
import
SubNav
from
'
./Components/SubNav
'
;
function
App
()
{
const
[
user
,
setUser
]
=
useState
(
null
);
const
authenticated
=
user
!=
null
;
const
login
=
({
id
,
password
})
=>
setUser
(
signIn
({
id
,
password
}));
const
logout
=
()
=>
setUser
(
null
);
// const [user,setUser]=useState(null);
// const authenticated =user !=null;
// const login =({id, password}) => setUser(signIn({id,password}));
// const logout=()=>setUser(null);
return
(
<
div
>
<
MainNav
/>
<
SubNav
/>
<
Router
>
<
Switch
>
<
Route
exact
path
=
"
/
"
component
=
{
Home
}
/
>
<
Route
path
=
"
/login
"
component
=
{
Login
}
/
>
<
Route
path
=
"
/signup
"
component
=
{
Signup
}
/
>
<
Route
path
=
"
/product
"
component
=
{
Product
}
/
>
<
Route
path
=
"
/productslist
"
component
=
{
ProductsList
}
/
>
<
Route
path
=
"
/admin
"
component
=
{
Admin
}
/
>
<
Route
path
=
"
/regist
"
component
=
{
ProductRegist
}
/
>
<
Route
path
=
"
/shoppingcart
"
component
=
{
ShoppingCart
}
/
>
<
Route
path
=
"
/payment
"
component
=
{
Payment
}
/
>
<
Route
path
=
"
/account
"
component
=
{
Account
}
/
>
<
Route
path
=
'
/kakao
'
component
=
{()
=>
{
window
.
location
.
href
=
'
https://compmath.korea.ac.kr
'
;
return
null
;
}}
/
>
<
Redirect
path
=
"
/
"
to
=
"
/
"
/>
<
/Switch
>
<
/Router
>
<
/div
>
)
}
...
...
client/src/Components/Card.js
View file @
afcd633d
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Card
}
from
'
react-bootstrap
'
;
function
Card
()
{
return
(
<
div
><
/div
>
)
}
...
...
client/src/Components/MainNav.js
View file @
afcd633d
...
...
@@ -13,18 +13,18 @@ function MainNav() {
return
(
<
Navbar
sticky
=
"
top
"
style
=
{{
background
:
"
#CDC5C2
"
}}
>
<
Navbar
.
Brand
href
=
"
/home
"
className
=
"
text-light
"
>
<
img
src
=
{
logo
}
width
=
"
24
"
height
=
"
24
"
/>
<
img
alt
=
"
로고
"
src
=
{
logo
}
width
=
"
24
"
height
=
"
24
"
/>
{
'
'
}
KU
#
<
/Navbar.Brand
>
<
Nav
className
=
"
float-right
"
>
<
Nav
.
Link
className
=
"
text-light
"
href
=
"
/login
"
>
Login
<
/Nav.Link
>
<
Nav
.
Link
className
=
"
text-light
"
href
=
"
/signup
"
>
Signup
<
/Nav.Link
>
<
Nav
.
Link
href
=
"
/shoppingcart
"
>
<
img
src
=
{
cart
}
width
=
"
30
"
height
=
"
30
"
/>
<
img
alt
=
"
카트
"
src
=
{
cart
}
width
=
"
30
"
height
=
"
30
"
/>
<
/Nav.Link
>
<
Nav
.
Link
className
=
"
text-light
"
onClick
=
{()
=>
handleClick
()}
>
Logout
<
/Nav.Link
>
<
Nav
.
Link
href
=
"
/admin
"
>
<
img
src
=
{
option
}
width
=
"
30
"
height
=
"
30
"
/>
<
img
alt
=
"
관리자
"
src
=
{
option
}
width
=
"
30
"
height
=
"
30
"
/>
<
/Nav.Link
>
<
/Nav
>
<
/Navbar
>
...
...
client/src/Pages/Account.js
View file @
afcd633d
import
React
from
'
react
'
import
MainNav
from
'
../Components/MainNav
'
import
SubNav
from
'
../Components/SubNav
'
function
Account
()
{
return
(
<
div
>
<
MainNav
/>
<
SubNav
/>
<
h5
>
마이페이지
<
/h5
>
<
/div
>
)
...
...
client/src/Pages/Admin.js
View file @
afcd633d
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
MainNav
from
'
../Components/MainNav
'
;
import
SubNav
from
'
../Components/SubNav
'
;
import
Pagination
from
'
../Components/Pagination
'
;
import
search
from
'
../search.svg
'
;
import
{
Row
,
Form
,
FormControl
,
Button
,
Card
,
Container
}
from
'
react-bootstrap
'
;
...
...
@@ -31,8 +29,6 @@ function Admin() {
}
`
}
<
/style
>
<
MainNav
/>
<
SubNav
/>
<
Container
>
<
Row
as
=
{
Form
}
onSubmit
=
{
handleSubmit
}
className
=
"
justify-content-end mx-0 my-5
"
>
<
FormControl
type
=
"
text
"
placeholder
=
"
Search
"
style
=
{{
width
:
"
13rem
"
}}
/
>
...
...
client/src/Pages/Home.js
View file @
afcd633d
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
MainNav
from
'
../Components/MainNav
'
;
import
SubNav
from
'
../Components/SubNav
'
;
import
{
Card
,
Container
,
Row
}
from
'
react-bootstrap
'
;
function
Home
()
{
return
(
<
div
>
<
MainNav
/>
<
SubNav
/>
<
Container
className
=
"
my-5
"
>
<
div
className
=
"
my-4
"
>
<
h2
style
=
{{
marginRight
:
"
5rem
"
,
marginLeft
:
"
3rem
"
,
marginBottom
:
"
2rem
"
}}
><
u
>
Best
<
/u></
h2
>
...
...
client/src/Pages/Login.js
View file @
afcd633d
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Link
,
Redirect
}
from
'
react-router-dom
'
;
import
Nav1
from
'
../Components/MainNav
'
;
import
Nav2
from
'
../Components/SubNav
'
;
import
{
Form
,
Col
,
Container
,
Button
,
Row
}
from
'
react-bootstrap
'
;
function
Login
(){
...
...
@@ -16,10 +14,10 @@ function Login(){
}
setValidated
(
true
);
}
return
(
<
div
>
<
Nav1
/>
<
Nav2
/>
<
Container
className
=
"
my-5
"
>
<
Row
className
=
"
justify-content-center
"
>
<
Col
md
=
{
5
}
xs
=
{
10
}
className
=
"
border
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
...
...
client/src/Pages/Payment.js
View file @
afcd633d
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
MainNav
from
'
../Components/MainNav
'
;
import
SubNav
from
'
../Components/SubNav
'
;
import
DaumPostcode
from
"
react-daum-postcode
"
;
import
{
Container
,
Card
,
Row
,
Col
,
Button
,
Form
,
FormGroup
}
from
'
react-bootstrap
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
...
...
@@ -147,8 +145,6 @@ function Payment() {
return
(
<
div
>
<
MainNav
/>
<
SubNav
/>
<
Container
>
<
h3
className
=
"
my-5 font-weight-bold text-center
"
>
주문
/
결제
<
/h3
>
<
div
>
...
...
@@ -222,15 +218,15 @@ function Payment() {
<
/Col
>
<
Col
md
=
{
6
}
className
=
"
p-2
"
>
<
Card
.
Body
>
<
input
type
=
"
image
"
src
=
"
https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png
"
className
=
"
float-right
"
onClick
=
{
deleteCart
}
/
>
<
input
type
=
"
image
"
alt
=
"
삭제버튼
"
src
=
"
https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png
"
className
=
"
float-right
"
onClick
=
{
deleteCart
}
/
>
<
Card
.
Title
className
=
"
font-weight-bold mt-3
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
옵션
<
/Card.Text
>
<
Card
.
Text
>
수량
<
/Card.Text
>
<
div
>
<
input
type
=
"
image
"
src
=
"
https://img.icons8.com/ios-glyphs/20/000000/minus-math.png
"
className
=
"
align-middle
"
onClick
=
{
minusNum
}
/
>
<
input
type
=
"
image
"
alt
=
"
마이너스
"
src
=
"
https://img.icons8.com/ios-glyphs/20/000000/minus-math.png
"
className
=
"
align-middle
"
onClick
=
{
minusNum
}
/
>
<
input
type
=
"
text
"
style
=
{{
width
:
'
30px
'
}}
className
=
"
text-center align-middle mx-1
"
placeholder
=
"
1
"
value
=
{
num
}
readOnly
><
/input
>
<
input
type
=
"
image
"
src
=
"
https://img.icons8.com/ios-glyphs/20/000000/plus-math.png
"
className
=
"
align-middle
"
onClick
=
{
plusNum
}
/
>
<
input
type
=
"
image
"
alt
=
"
플러스
"
src
=
"
https://img.icons8.com/ios-glyphs/20/000000/plus-math.png
"
className
=
"
align-middle
"
onClick
=
{
plusNum
}
/
>
<
/div
>
<
/Card.Body
>
<
/Col
>
...
...
@@ -258,7 +254,7 @@ function Payment() {
<
h5
className
=
"
font-weight-bold py-3 border-top border-bottom text-center
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
결제수단
<
/h5
>
<
div
className
=
"
text-center mt-5
"
>
<
Button
variant
=
"
success
"
className
=
"
align-top
"
onClick
=
{
handleClick
}
>
무통장입금
<
/Button
>
<
input
type
=
"
image
"
src
=
"
img/payment_icon_yellow_small.png
"
onClick
=
{
kakaopay
}
/
>
<
input
type
=
"
image
"
alt
=
"
카카오페이결제
"
src
=
"
img/payment_icon_yellow_small.png
"
onClick
=
{
kakaopay
}
/
>
<
/div
>
{
paymentWay
}
<
/div
>
...
...
client/src/Pages/Product.js
View file @
afcd633d
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
MainNav
from
'
../Components/MainNav
'
;
import
SubNav
from
'
../Components/SubNav
'
;
import
{
Row
,
Col
,
Form
,
Card
,
Button
}
from
'
react-bootstrap
'
;
function
Product
()
{
...
...
@@ -69,8 +67,6 @@ function Product() {
}
`
}
<
/style
>
<
MainNav
/>
<
SubNav
/>
<
Row
className
=
"
justify-content-center mt-5 mx-0
"
>
<
Col
sm
=
{
11
}
md
=
{
4
}
>
<
img
src
=
"
https://img.sonyunara.com/files/goods/65976/1601953605_0.jpg
"
style
=
{{
objectFit
:
"
contain
"
,
width
:
"
100%
"
}}
/
>
...
...
client/src/Pages/ProductRegist.js
View file @
afcd633d
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
MainNav
from
'
../Components/MainNav
'
;
import
SubNav
from
'
../Components/SubNav
'
;
import
{
Row
,
Col
,
Button
,
Form
,
Container
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
...
...
@@ -27,19 +25,11 @@ function ProductsRegist() {
console
.
log
(
"
client의 res=
"
,
res
)
})
}
// }catch(error) {
// catchErrors(error, setError)
// }
// if (success) {
// return <Redirect to='/' />
// }
if
(
success
)
{
return
<
Redirect
to
=
'
/
'
/>
}
return
(
<
div
>
<
MainNav
/>
<
SubNav
/>
<
Container
>
<
Row
className
=
"
justify-content-md-center
"
>
<
Col
md
=
{
8
}
className
=
"
border p-1
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
...
...
@@ -62,21 +52,21 @@ function ProductsRegist() {
<
Row
>
<
Col
md
=
{
4
}
>
<
Form
.
Control
as
=
"
select
"
name
=
"
main_category
"
placeholder
=
"
상위분류
"
onChange
=
{
handleChange
}
>
{
mainCategorys
.
map
((
main
)
=>
(
{
/*
{mainCategorys.map((main) => (
<option value={main}>{main}</option>
))}
))}
*/
}
<
/Form.Control
>
<
/Col
>
<
Col
md
=
{
6
}
>
<
Form
.
Control
as
=
"
select
"
name
=
"
sub_category
"
placeholder
=
"
하위분류
"
onChange
=
{
handleChange
}
>
{
subCategorys
[
categoryNum
].
map
((
sub
)
=>
(
{
/*
{subCategorys[categoryNum].map((sub) => (
<option value={sub}>{sub}</option>
))}
))}
*/
}
<
/Form.Control
>
<
/Col
>
<
Col
md
=
{
2
}
>
{
/*
<Col md={2}>
<Button style={{ background: '#91877F', borderColor: '#91877F' }} onClick={addCategory}>추가</Button>
<
/Col
>
</Col>
*/
}
<
/Row
>
{
list
.
map
((
element
)
=>
element
)}
<
/Form.Group
>
...
...
client/src/Pages/ShoppingCart.js
View file @
afcd633d
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
MainNav
from
'
../Components/MainNav
'
;
import
SubNav
from
'
../Components/SubNav
'
;
import
{
Card
,
Button
,
Container
,
Row
,
Col
}
from
'
react-bootstrap
'
;
function
ShoppingCart
()
{
...
...
@@ -27,8 +25,6 @@ function ShoppingCart() {
return
(
<
div
>
<
MainNav
/>
<
SubNav
/>
<
Container
className
=
"
justify-content-center
"
>
<
h3
className
=
"
my-5 font-weight-bold text-center
"
>
장바구니
<
/h3
>
<
div
>
...
...
@@ -43,15 +39,15 @@ function ShoppingCart() {
<
/Col
>
<
Col
md
=
{
6
}
className
=
"
p-2
"
>
<
Card
.
Body
>
<
input
type
=
"
image
"
src
=
"
https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png
"
className
=
"
float-right
"
onClick
=
{
deleteCart
}
/
>
<
input
type
=
"
image
"
alt
=
"
삭제버튼
"
src
=
"
https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png
"
className
=
"
float-right
"
onClick
=
{
deleteCart
}
/
>
<
Card
.
Title
className
=
"
font-weight-bold mt-3
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
옵션
<
/Card.Text
>
<
Card
.
Text
>
수량
<
/Card.Text
>
<
div
>
<
input
type
=
"
image
"
src
=
"
https://img.icons8.com/ios-glyphs/20/000000/minus-math.png
"
className
=
"
align-middle
"
onClick
=
{
minusNum
}
/
>
<
input
type
=
"
image
"
alt
=
"
마이너스
"
src
=
"
https://img.icons8.com/ios-glyphs/20/000000/minus-math.png
"
className
=
"
align-middle
"
onClick
=
{
minusNum
}
/
>
<
input
type
=
"
text
"
style
=
{{
width
:
'
30px
'
}}
className
=
"
text-center align-middle mx-1
"
placeholder
=
"
1
"
value
=
{
num
}
readOnly
><
/input
>
<
input
type
=
"
image
"
src
=
"
https://img.icons8.com/ios-glyphs/20/000000/plus-math.png
"
className
=
"
align-middle
"
onClick
=
{
plusNum
}
/
>
<
input
type
=
"
image
"
alt
=
"
플러스
"
src
=
"
https://img.icons8.com/ios-glyphs/20/000000/plus-math.png
"
className
=
"
align-middle
"
onClick
=
{
plusNum
}
/
>
<
/div
>
<
/Card.Body
>
<
/Col
>
...
...
client/src/Pages/Signup.js
View file @
afcd633d
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
Nav1
from
'
../Components/MainNav
'
;
import
Nav2
from
'
../Components/SubNav
'
;
import
{
Form
,
Col
,
Container
,
Button
,
Row
,
Alert
}
from
'
react-bootstrap
'
import
FormCheckInput
from
'
react-bootstrap/esm/FormCheckInput
'
;
import
axios
from
'
axios
'
;
const
INIT_USER
=
{
...
...
@@ -63,8 +60,6 @@ function Signup() {
return
(
<
div
>
<
Nav1
/>
<
Nav2
/>
<
Container
className
=
"
my-5
"
>
{
error
&&
<
Alert
variant
=
'
danger
'
>
{
error
}
...
...
client/src/index.js
View file @
afcd633d
import
React
from
'
react
'
;
import
ReactDOM
from
'
react-dom
'
;
import
{
BrowserRouter
as
Router
,
Route
,
Redirect
,
Switch
}
from
'
react-router-dom
'
;
import
Home
from
'
./Pages/Home
'
;
import
Login
from
'
./Pages/Login
'
;
import
Signup
from
'
./Pages/Signup
'
;
import
Product
from
"
./Pages/Product
"
;
import
ProductsList
from
"
./Pages/ProductsList
"
;
import
Admin
from
'
./Pages/Admin
'
;
import
ProductRegist
from
'
./Pages/ProductRegist
'
;
import
ShoppingCart
from
'
./Pages/ShoppingCart
'
;
import
Payment
from
'
./Pages/Payment
'
;
import
reportWebVitals
from
'
./reportWebVitals
'
;
import
'
bootstrap/dist/css/bootstrap.min.css
'
;
import
A
ccount
from
'
./
Pages/Account
'
;
import
A
pp
from
'
./
App
'
;
ReactDOM
.
render
(
<
React
.
StrictMode
>
<
Router
>
<
Switch
>
<
Route
exact
path
=
"
/
"
component
=
{
Home
}
/
>
<
Route
path
=
"
/login
"
component
=
{
Login
}
/
>
<
Route
path
=
"
/signup
"
component
=
{
Signup
}
/
>
<
Route
path
=
"
/product
"
component
=
{
Product
}
/
>
<
Route
path
=
"
/productslist
"
component
=
{
ProductsList
}
/
>
<
Route
path
=
"
/admin
"
component
=
{
Admin
}
/
>
<
Route
path
=
"
/regist
"
component
=
{
ProductRegist
}
/
>
<
Route
path
=
"
/shoppingcart
"
component
=
{
ShoppingCart
}
/
>
<
Route
path
=
"
/payment
"
component
=
{
Payment
}
/
>
<
Route
path
=
"
/account
"
component
=
{
Account
}
/
>
<
Route
path
=
'
/kakao
'
component
=
{()
=>
{
window
.
location
.
href
=
'
https://compmath.korea.ac.kr
'
;
return
null
;}}
/
>
<
Redirect
path
=
"
/
"
to
=
"
/
"
/>
<
/Switch
>
<
/Router
>
<
App
/>
<
/React.StrictMode>
,
document
.
getElementById
(
'
root
'
)
);
...
...
server/schemas/Cart.js
0 → 100644
View file @
afcd633d
import
mongoose
from
'
mongoose
'
const
{
String
,
Number
,
Array
}
=
mongoose
.
Schema
.
Types
const
CartSchema
=
new
mongoose
.
Schema
({
pro_name
:
{
type
:
String
,
required
:
true
,
},
price
:
{
type
:
Number
,
required
:
true
,
},
stock
:
{
type
:
Number
,
required
:
true
},
purchase
:
{
type
:
Number
,
required
:
true
,
default
:
0
},
main_category
:
{
type
:
String
,
required
:
true
,
},
sub_category
:
{
type
:
Array
,
required
:
true
,
},
main_image
:
{
type
:
String
,
required
:
true
,
}
},
{
timestamps
:
true
})
export
default
mongoose
.
models
.
Cart
||
mongoose
.
model
(
'
Cart
'
,
CartSchema
)
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment