Skip to content

Commit 8ecdb9e

Browse files
yeojinchoyeojincho
committed
commit
1 parent 3215101 commit 8ecdb9e

File tree

6 files changed

+201
-128
lines changed

6 files changed

+201
-128
lines changed

‎.vscode/settings.json

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"html-to-css-autocompletion.autocompletionFilesScope": "linked-files"
3+
}

‎src/App.js

+44-51
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,51 @@
1-
import {Route, Switch} from 'react-router-dom';
2-
import { useState, useEffect } from 'react';
3-
4-
import "bootstrap/dist/css/bootstrap.min.css";
5-
import './components/common/common.css'
6-
7-
import Header from './components/common/Header';
8-
import Footer from './components/common/Footer';
9-
import Main from './components/main/Main';
10-
import NotFound from './components/common/NotFound';
11-
import Sample1 from './components/sample/Sample1';
12-
import Sample2 from './components/sample/Sample2';
13-
import Join from './components/member/Join';
14-
import JoinForm from './components/member/JoinForm';
15-
import JoinComplete from './components/member/JoinComplete';
16-
17-
function App({sessionLogin}) {
18-
/* 로그인 세션 확인 */
19-
const [isLogin,setIsLogin] = useState(false);
20-
useEffect(() => {
21-
sessionLogin === null ? setIsLogin(false) : setIsLogin(true);
22-
})
1+
import "./components/common/common.css";
232

3+
import { Route, Switch } from "react-router-dom";
4+
5+
import Header from "./components/common/Header";
6+
import Footer from "./components/common/Footer";
7+
import Main from "./components/main/Main";
8+
import NotFound from "./components/common/NotFound";
9+
import ChangePw from "./components/mypage/ChangePw";
10+
import RegiConfirm from "./components/mypage/RegiConfirm";
11+
import MyClassList from "./components/mypage/MyClassList";
12+
13+
function App() {
2414
return (
2515
<div className="wrapper">
26-
27-
<Header isLogin={isLogin} />
28-
29-
<Switch>
30-
{/* 메인 */}
31-
<Route exact path="/" component={Main}><Main /></Route>
32-
{/* 회원가입 */}
33-
<Route exact path="/join" component={Join}><Join /></Route>
34-
<Route exact path="/join/form" component={JoinForm}><JoinForm /></Route>
35-
<Route exact path="/join/complete" component={JoinComplete}><JoinComplete /></Route>
36-
<Route exact path="/sample1" component={Sample1}><Sample1 /></Route>
37-
<Route exact path="/sample2" component={Sample2}><Sample2 /></Route>
38-
39-
{/* 공개과정 */}
40-
41-
{/* 취업과정 */}
42-
43-
{/* Ex콘텐츠 */}
44-
45-
{/* 고객센터 */}
46-
47-
{/* 아카데미 */}
48-
49-
<Route>
50-
<NotFound />
51-
</Route>
52-
</Switch>
53-
54-
<Footer />
16+
<Header />
17+
18+
<Switch>
19+
{/* 메인 */}
20+
<Route exact path="/" component={Main}>
21+
<Main />
22+
</Route>
23+
<Route exact path="/myclass" component={MyClassList}>
24+
<MyClassList />
25+
</Route>
26+
<Route exact path="/confirm" component={RegiConfirm}>
27+
<RegiConfirm />
28+
</Route>
29+
<Route exact path="/change" component={ChangePw}>
30+
<ChangePw />
31+
</Route>
32+
33+
{/* 공개과정 */}
34+
35+
{/* 취업과정 */}
36+
37+
{/* Ex콘텐츠 */}
38+
39+
{/* 고객센터 */}
40+
41+
{/* 아카데미 */}
42+
43+
<Route>
44+
<NotFound />
45+
</Route>
46+
</Switch>
5547

48+
<Footer />
5649
</div>
5750
);
5851
}

‎src/components/common/Header.js

+107-60
Original file line numberDiff line numberDiff line change
@@ -2,112 +2,159 @@
22
화면 : 메인 > 헤더
33
*/
44

5+
import React from "react";
6+
import { useState } from "react";
7+
import { Link } from "react-router-dom";
58

6-
import React from 'react'
7-
import { useState } from 'react';
8-
import { Link } from 'react-router-dom';
9+
import LoginPop from "../main/popup/Login";
10+
import "./header.css";
911

10-
import LoginPop from '../main/popup/Login';
11-
import './header.css'
12-
13-
14-
export default function Header({isLogin}) {
12+
export default function Header({ isLogin }) {
1513
/* 로그인 팝업 */
1614
const [LoginPopOpen, setLoginPopOpen] = useState(false);
17-
const openLoginPopFn = ()=> setLoginPopOpen(true);
18-
const closeLoginPopFn = ()=> setLoginPopOpen(false);
15+
const openLoginPopFn = () => setLoginPopOpen(true);
16+
const closeLoginPopFn = () => setLoginPopOpen(false);
1917

2018
/* 로그아웃 */
21-
const logoutFn = ()=> {
19+
const logoutFn = () => {
2220
// 로그인 세션 삭제
23-
sessionStorage.removeItem('user_id');
24-
document.location.replace('/');
21+
sessionStorage.removeItem("user_id");
22+
document.location.replace("/");
2523
};
2624

2725
return (
2826
<>
29-
<header className="header-wrapper">
30-
31-
<div className="header-top">
32-
<div className="inner-box header-inner">
33-
<h1 className="top-logo"><a href ="/">엑스퍼트아카데미</a></h1>
27+
<header className="header-wrapper">
28+
<div className="header-top">
29+
<div className="inner-box header-inner">
30+
<h1 className="top-logo">
31+
<a href="/">엑스퍼트아카데미</a>
32+
</h1>
3433
<div className="top-search">
35-
<input type="text" className="top-search-input" placeholder="빅테이터" />
34+
<input
35+
type="text"
36+
className="top-search-input"
37+
placeholder="빅테이터"
38+
/>
3639
<a className="top-search-btn">
37-
<img src="/images/search.png" alt="search"/>
40+
<img src="/images/search.png" alt="search" />
3841
</a>
3942
</div>
4043
<div className="top-btn">
41-
{
42-
!isLogin ?
44+
{!isLogin ? (
4345
<>
44-
<a href="#" onClick={openLoginPopFn}>로그인</a>
46+
<a href="#" onClick={openLoginPopFn}>
47+
로그인
48+
</a>
4549
<Link to="/join">회원가입</Link>
4650
</>
47-
:
51+
) : (
4852
<>
4953
<Link to="/mypage">마이페이지</Link>
50-
<a href="#" onClick={logoutFn}>로그아웃</a>
54+
<a href="#" onClick={logoutFn}>
55+
로그아웃
56+
</a>
5157
</>
52-
}
58+
)}
5359
<button className="sitemap">+sitemap</button>
5460
</div>
61+
</div>
5562
</div>
56-
</div>{/* 헤더 top */}
57-
58-
<nav className="header-bottom">
63+
{/* 헤더 top */}
64+
65+
<nav className="header-bottom">
5966
<ul className="inner-box gnb">
6067
<li className="depth1">
61-
<Link to ="/sample1">공개과정</Link>
68+
<Link to="/sample1">공개과정</Link>
6269
<ul class="depth2">
63-
<li><Link to ="/sample1">월간교육일정</Link></li>
64-
<li><Link to ="/sample1">계층교육</Link></li>
65-
<li><Link to ="/sample1">직무역량</Link></li>
66-
<li><Link to ="/sample1">DX교육</Link></li>
67-
<li><Link to ="/sample1">진단</Link></li>
68-
<li><Link to ="/sample1">일반</Link></li>
70+
<li>
71+
<Link to="/sample1">월간교육일정</Link>
72+
</li>
73+
<li>
74+
<Link to="/sample1">계층교육</Link>
75+
</li>
76+
<li>
77+
<Link to="/sample1">직무역량</Link>
78+
</li>
79+
<li>
80+
<Link to="/sample1">DX교육</Link>
81+
</li>
82+
<li>
83+
<Link to="/sample1">진단</Link>
84+
</li>
85+
<li>
86+
<Link to="/sample1">일반</Link>
87+
</li>
6988
</ul>
7089
</li>
7190
<li className="depth1">
72-
<Link to ="/sample2">취업과정</Link>
91+
<Link to="/sample2">취업과정</Link>
7392
<ul class="depth2">
74-
<li><Link to ="/sample2">소개</Link></li>
75-
<li><Link to ="/sample2">모집중인 과정</Link></li>
93+
<li>
94+
<Link to="/sample2">소개</Link>
95+
</li>
96+
<li>
97+
<Link to="/sample2">모집중인 과정</Link>
98+
</li>
7699
</ul>
77100
</li>
78101
<li className="depth1">
79-
<Link to ="/">Ex콘텐츠</Link>
102+
<Link to="/">Ex콘텐츠</Link>
80103
<ul class="depth2">
81-
<li><Link to ="/">이벤트</Link></li>
82-
<li><Link to ="/test">과정후기</Link></li>
83-
<li><Link to ="/">EXC뷰</Link></li>
104+
<li>
105+
<Link to="/">이벤트</Link>
106+
</li>
107+
<li>
108+
<Link to="/test">과정후기</Link>
109+
</li>
110+
<li>
111+
<Link to="/">EXC뷰</Link>
112+
</li>
84113
</ul>
85114
</li>
86115
<li className="depth1">
87-
<Link to ="/">고객센터</Link>
116+
<Link to="/">고객센터</Link>
88117
<ul class="depth2">
89-
<li><Link to ="/">공지사항</Link></li>
90-
<li><Link to ="/test">문의하기</Link></li>
91-
<li><Link to ="/">자주묻는 질문</Link></li>
92-
<li><Link to ="/">오시는 길</Link></li>
118+
<li>
119+
<Link to="/">공지사항</Link>
120+
</li>
121+
<li>
122+
<Link to="/test">문의하기</Link>
123+
</li>
124+
<li>
125+
<Link to="/">자주묻는 질문</Link>
126+
</li>
127+
<li>
128+
<Link to="/">오시는 길</Link>
129+
</li>
93130
</ul>
94131
</li>
95132
<li className="depth1">
96-
<Link to ="/">아카데미</Link>
133+
<Link to="/">아카데미</Link>
97134
<ul class="depth2">
98-
<li><Link to ="/">아카데미 소개</Link></li>
99-
<li><Link to ="/test">강사소개</Link></li>
100-
<li><Link to ="/">HR샵</Link></li>
101-
<li><Link to ="/">제휴제안</Link></li>
102-
<li><Link to ="/">인재채용</Link></li>
135+
<li>
136+
<Link to="/">아카데미 소개</Link>
137+
</li>
138+
<li>
139+
<Link to="/test">강사소개</Link>
140+
</li>
141+
<li>
142+
<Link to="/myclass">내역</Link>
143+
</li>
144+
<li>
145+
<Link to="/confirm">확인취소</Link>
146+
</li>
147+
<li>
148+
<Link to="/change">비번변경</Link>
149+
</li>
103150
</ul>
104151
</li>
105152
</ul>
106-
</nav>{/* 헤더 bottom */}
107-
</header>
108-
153+
</nav>
154+
{/* 헤더 bottom */}
155+
</header>
109156

110-
<LoginPop open={LoginPopOpen} close={closeLoginPopFn} />
111-
</>
112-
)
157+
<LoginPop open={LoginPopOpen} close={closeLoginPopFn} />
158+
</>
159+
);
113160
}

‎src/components/mypage/ChangePw.js

+17-17
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@ import "./ChangePw.css";
55
function ChangePw() {
66
return (
77
<div>
8-
<div className='inner-box wrap1'>
9-
<div className='sideBar'>
10-
<ul className='info'>
8+
<div className="inner-box wrap1">
9+
<div className="sideBar">
10+
<ul className="info">
1111
회원정보
1212
<li>
1313
<button>- 회원정보관리</button>
@@ -16,7 +16,7 @@ function ChangePw() {
1616
<button>- 비밀번호 변경</button>
1717
</li>
1818
</ul>
19-
<ul className='info'>
19+
<ul className="info">
2020
수강정보
2121
<li>
2222
<button>- 수강신청 확인/취소</button>
@@ -26,30 +26,30 @@ function ChangePw() {
2626
</li>
2727
</ul>
2828
</div>
29-
<div className='contentBox'>
30-
<p className='myTitle'>마이페이지 _____님 </p>
31-
<p className='myTitle'>엑스퍼트 아카데미에 오신걸 환영합니다.</p>
32-
<h2 className='Imp'>비밀번호변경</h2>
29+
<div className="contentBox">
30+
<p className="myTitle">마이페이지 _____님 </p>
31+
<p className="myTitle">엑스퍼트 아카데미에 오신걸 환영합니다.</p>
32+
<h2 className="Imp">비밀번호변경</h2>
3333
<p>비밀번호 변경을 위해 현재 비밀번호를 입력해 주세요</p>
34-
<FormGroup className='FormNow'>
35-
<Label for='exampleEmail' className='Imp'>
34+
<FormGroup className="FormNow">
35+
<Label for="exampleEmail" className="Imp">
3636
현재비밀번호
3737
</Label>
38-
<Input type='text' />
38+
<Input type="text" />
3939
</FormGroup>
40-
<FormGroup className='FormNow'>
41-
<Label for='examplePassword' className='Imp'>
40+
<FormGroup className="FormNow">
41+
<Label for="examplePassword" className="Imp">
4242
{" "}
4343
새로운 비밀번호{" "}
4444
</Label>
45-
<Input type='text' />
45+
<Input type="text" />
4646
</FormGroup>
47-
<FormGroup className='FormNow'>
48-
<Label for='examplePassword' className='Imp'>
47+
<FormGroup className="FormNow">
48+
<Label for="examplePassword" className="Imp">
4949
{" "}
5050
새로운 비밀번호 확인{" "}
5151
</Label>
52-
<Input type='text' className='inputEnd' />
52+
<Input type="text" className="inputEnd" />
5353
</FormGroup>
5454
<Button>확인</Button>
5555
</div>

0 commit comments

Comments
 (0)