Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
students
travel
Commits
ab76f24e
Commit
ab76f24e
authored
Jul 27, 2022
by
Kim, MinGyu
Browse files
css 수정
parent
fbaae34c
Changes
9
Hide whitespace changes
Inline
Side-by-side
frontend/src/auth/signup.tsx
View file @
ab76f24e
...
...
@@ -77,12 +77,12 @@ export default function Signup() {
<
div
className
=
"flex flex-col "
>
<
div
className
=
"border-0 border-y-2 border-black"
>
<
div
className
=
"h-16 flex "
>
<
div
className
=
"whitespace-nowrap grid place-items-center basis-1/5 shrink-0 border-0 border-r-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center
w-32 lg:
basis-1/5 shrink-0 border-0 border-r-2"
>
이름
</
div
>
<
div
className
=
"
grid place-
items-center mx-5"
>
<
div
className
=
"
flex
items-center mx-5"
>
<
input
className
=
"h-10
basis-1/5
border-2 focus:border-black"
className
=
"h-10
w-4/5 lg:w-60
border-2 focus:border-black"
type
=
"text"
name
=
"name"
onChange
=
{
handleChange
}
...
...
@@ -90,12 +90,12 @@ export default function Signup() {
</
div
>
</
div
>
<
div
className
=
"h-16 flex border-0 border-t-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center basis-1/5 shrink-0 border-0 border-r-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center
w-32 lg:
basis-1/5 shrink-0 border-0 border-r-2"
>
이메일
</
div
>
<
div
className
=
"
grid place-
items-center mx-5"
>
<
div
className
=
"
flex
items-center mx-5"
>
<
input
className
=
"
grid place-items-center h-10 basis-1/5
border-2 focus:border-black"
className
=
"
w-4/5 h-10 lg:w-60
border-2 focus:border-black"
type
=
"email"
name
=
"email"
onChange
=
{
handleChange
}
...
...
@@ -103,12 +103,12 @@ export default function Signup() {
</
div
>
</
div
>
<
div
className
=
"h-16 flex border-0 border-t-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center basis-1/5 shrink-0 border-0 border-r-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center
w-32 lg:
basis-1/5 shrink-0 border-0 border-r-2"
>
비밀번호
</
div
>
<
div
className
=
"
grid place-
items-center mx-5"
>
<
div
className
=
"
flex
items-center mx-5"
>
<
input
className
=
"
grid place-items-center h-10 basis-1/5
border-2 focus:border-black"
className
=
"
w-4/5 h-10 lg:w-60
border-2 focus:border-black"
type
=
"password"
name
=
"password"
onChange
=
{
handleChange
}
...
...
@@ -117,13 +117,13 @@ export default function Signup() {
</
div
>
<
div
className
=
"h-16 flex border-0 border-t-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center basis-1/5 shrink-0 border-0 border-r-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center
w-32 lg:
basis-1/5 shrink-0 border-0 border-r-2"
>
비밀번호 확인
</
div
>
<
div
className
=
"
grid place-
items-center mx-5"
>
<
div
className
=
"
flex
items-center mx-5"
>
<
input
className
=
"
grid place-items-center h-10 basis-1/5
border-2 focus:border-black"
className
=
"
w-4/5 h-10 lg:w-60
border-2 focus:border-black"
type
=
"password"
name
=
"password2"
onChange
=
{
handleChange
}
...
...
frontend/src/board/board.tsx
View file @
ab76f24e
import
React
,
{
useState
,
MouseEvent
,
useEffect
}
from
"
react
"
;
import
{
Link
}
from
"
react-router-dom
"
;
import
{
Link
,
useNavigate
}
from
"
react-router-dom
"
;
import
{
PostType
}
from
"
../types
"
;
import
Post
from
"
../post/post
"
;
import
{
postApi
}
from
"
../apis
"
;
import
{
useAuth
}
from
"
../auth/auth.context
"
;
interface
Posts
{
posts
:
PostType
[];
...
...
@@ -10,6 +11,8 @@ interface Posts {
export
default
function
BoardPage
()
{
const
[
posts
,
setPosts
]
=
useState
<
PostType
[]
>
();
const
navigate
=
useNavigate
();
const
{
user
}
=
useAuth
();
useEffect
(()
=>
{
getDataList
();
...
...
@@ -36,29 +39,37 @@ export default function BoardPage() {
}
};
const
goLogin
=
async
(
event
:
React
.
MouseEvent
)
=>
{
if
(
!
user
.
isLoggedIn
)
{
alert
(
"
로그인이 필요합니다.
"
);
navigate
(
"
/login
"
,
{
replace
:
true
});
}
};
return
(
<
div
className
=
"flex flex-col "
>
<
div
className
=
"flex flex-col mt-6"
>
<
div
className
=
"text-2xl"
>
자유 게시판
</
div
>
<
div
className
=
"text-sm mt-5"
>
여행지 후기를 남겨주세요!
</
div
>
<
div
className
=
"text-2xl whitespace-nowrap"
>
자유 게시판
</
div
>
<
div
className
=
"text-sm mt-5 whitespace-nowrap"
>
여행지 후기를 남겨주세요!
</
div
>
</
div
>
<
div
className
=
"flex flex-col w-full mt-16"
>
<
div
className
=
"flex justify-end"
>
<
div
className
=
"border-2 border-blue-500 rounded mb-2"
>
<
Link
to
=
"/posting"
>
<
button
>
글쓰기
</
button
>
</
Link
>
</
div
>
{
"
"
}
{
/* Link */
}
<
div
className
=
"border-2 border-blue-500 rounded mb-2 whitespace-nowrap"
>
<
button
onClick
=
{
goLogin
}
>
<
Link
to
=
"/posting"
>
글쓰기
</
Link
>
</
button
>
</
div
>
</
div
>
<
div
className
=
"sm:overflow-y-auto"
>
<
div
className
=
"flex place-items-center divide-x-2 border-2 border-solid border-y-2 h-10 bg-gradient-to-r from-cyan-500 to-blue-500 "
>
<
div
className
=
"
whitespace-nowrap
flex place-items-center divide-x-2 border-2 border-solid border-y-2 h-10 bg-gradient-to-r from-cyan-500 to-blue-500 "
>
<
div
className
=
"basis-full"
>
제목
</
div
>
<
div
className
=
"basis-3/12"
>
게시 날짜
</
div
>
<
div
className
=
"basis-2/12"
>
조회수
</
div
>
</
div
>
<
div
className
=
""
>
<
div
className
=
"
whitespace-nowrap
"
>
{
posts
?.
map
((
post
,
i
)
=>
(
<
Post
key
=
{
i
}
post
=
{
post
}
handleClick
=
{
titleHandleClick
}
/>
))
}
...
...
frontend/src/home/body.tsx
View file @
ab76f24e
...
...
@@ -21,10 +21,10 @@ export default function Body() {
imgsData
();
},
[]);
useEffect
(()
=>
{
console
.
log
(
searchParams
.
get
(
"
theme
"
),
searchParams
.
get
(
"
city
"
));
setSearchParams
(
searchParams
);
},
[]);
//
useEffect(() => {
//
console.log(searchParams.get("theme"), searchParams.get("city"));
//
setSearchParams(searchParams);
//
}, []);
const
themeHandleClick
=
(
event
:
MouseEvent
<
HTMLButtonElement
>
)
=>
{
console
.
log
(
`theme id=
${
event
.
currentTarget
.
id
}
`
);
...
...
frontend/src/home/header.tsx
View file @
ab76f24e
...
...
@@ -14,20 +14,20 @@ export default function Header() {
};
return
(
<
div
className
=
"flex flex-col
lg
:px-56 "
>
<
div
className
=
"flex flex-col
md
:px-56 "
>
<
div
className
=
"flex flex-col-reverse pt-3 pb-12 border-b-2 border-sky-200 bg-gradient-to-t from-sky-200"
>
<
div
className
=
"flex mt-5 justify-between pr-3"
>
<
button
className
=
"ml-3 shrink-0 text-2xl"
>
<
button
className
=
"ml-3 shrink-0
md:
text-2xl"
>
<
Link
to
=
"/"
className
=
"hover:text-sky-300 active:text-purple-500"
>
Travel Report
</
Link
>
</
button
>
<
div
className
=
"flex h-12"
>
<
input
className
=
"ml-10 focus:outline-none focus:border-y-4 focus:border-l-4 focus:border-sky-500 w-
20 w-40
md:w-4/5 border-y-4 border-l-4 border-sky-300 pl-9 rounded-l-full focus:border-0"
className
=
"ml-10 focus:outline-none focus:border-y-4 focus:border-l-4 focus:border-sky-500 w-
3/5
md:w-4/5 border-y-4 border-l-4 border-sky-300 pl-9 rounded-l-full focus:border-0"
onChange
=
{
handleChange
}
/>
<
button
className
=
"
shrink-0
bg-white border-y-4 border-r-4 border-sky-500 rounded-r-full pr-4"
>
<
button
className
=
"
whitespace-nowrap
bg-white border-y-4 border-r-4 border-sky-500 rounded-r-full pr-4"
>
검색
</
button
>
</
div
>
...
...
frontend/src/home/theme.tsx
View file @
ab76f24e
import
React
,
{
MouseEventHandler
}
from
"
react
"
;
import
React
,
{
MouseEventHandler
,
useState
}
from
"
react
"
;
type
ThemeProps
=
{
handleClick
:
MouseEventHandler
;
};
export
default
function
Theme
({
handleClick
}:
ThemeProps
)
{
const
[
active
,
setActive
]
=
useState
(
0
);
const
onactive
=
"
whitespace-nowrap px-5 text-sky-300
"
;
const
offactive
=
"
whitespace-nowrap px-5
"
;
const
clickActive
=
(
a
:
number
)
=>
{
setActive
(
a
);
};
return
(
<
div
className
=
"overflow-x-auto flex rounded md:justify-center py-2 border-b-2 divide-x-2"
>
<
button
id
=
{
"
surfing
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300 "
>
서핑
</
button
>
<
button
id
=
{
"
activity
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300"
>
액티비티
</
button
>
<
button
id
=
{
"
camping
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300 "
>
캠핑
</
button
>
<
button
id
=
{
"
skiing
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300"
>
스키
</
button
>
<
button
id
=
{
"
boat
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300"
>
보트
</
button
>
<
button
id
=
{
"
desert
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300"
>
사막
</
button
>
<
button
id
=
{
"
golf
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300"
>
골프
</
button
>
<
button
id
=
{
"
cave
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300"
>
동굴
</
button
>
<
button
id
=
{
"
history
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300"
>
문화재
</
button
>
<
button
id
=
{
"
zoo
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300"
>
동물원
</
button
>
<
button
id
=
{
"
cycling
"
}
onClick
=
{
handleClick
}
className
=
"shrink-0 px-5 hover:text-sky-300"
>
사이클링
</
button
>
<
div
className
=
"overflow-x-auto flex rounded py-2 md:p-2 border-b-2 divide-x-2"
>
<
div
onClick
=
{
()
=>
clickActive
(
1
)
}
>
<
button
id
=
{
"
surfing
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
1
?
onactive
:
offactive
}
>
서핑
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
2
)
}
>
<
button
id
=
{
"
activity
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
2
?
onactive
:
offactive
}
>
액티비티
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
3
)
}
>
<
button
id
=
{
"
camping
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
3
?
onactive
:
offactive
}
>
캠핑
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
4
)
}
>
<
button
id
=
{
"
skiing
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
4
?
onactive
:
offactive
}
>
스키
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
5
)
}
>
<
button
id
=
{
"
boat
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
5
?
onactive
:
offactive
}
>
보트
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
6
)
}
>
<
button
id
=
{
"
desert
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
6
?
onactive
:
offactive
}
>
사막
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
7
)
}
>
<
button
id
=
{
"
golf
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
7
?
onactive
:
offactive
}
>
골프
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
8
)
}
>
<
button
id
=
{
"
cave
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
8
?
onactive
:
offactive
}
>
동굴
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
9
)
}
>
<
button
id
=
{
"
history
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
9
?
onactive
:
offactive
}
>
문화재
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
10
)
}
>
<
button
id
=
{
"
zoo
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
10
?
onactive
:
offactive
}
>
동물원
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
11
)
}
>
<
button
id
=
{
"
cycling
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
11
?
onactive
:
offactive
}
>
사이클링
</
button
>
</
div
>
</
div
>
);
}
frontend/src/pages/citylist.tsx
View file @
ab76f24e
import
React
,
{
MouseEventHandler
}
from
"
react
"
;
import
React
,
{
MouseEventHandler
,
useState
}
from
"
react
"
;
type
CityProps
=
{
handleClick
:
MouseEventHandler
;
};
export
default
function
Citylist
({
handleClick
}:
CityProps
)
{
const
[
active
,
setActive
]
=
useState
(
0
);
const
onactive
=
"
text-start px-5 py-2 underline whitespace-nowrap
"
;
const
offactive
=
"
text-start px-5 py-2 whitespace-nowrap
"
;
const
clickActive
=
(
a
:
number
)
=>
{
setActive
(
a
);
};
return
(
<
div
className
=
"overflow-auto w-full flex flex-row md:flex-col md:mr-24 bg-sky-100"
>
<
div
className
=
"text-start px-5 py-2 bg-white whitespace-nowrap"
>
도시
</
div
>
<
button
id
=
{
"
Seoul
"
}
onClick
=
{
handleClick
}
className
=
"text-start px-5 py-2 hover:underline whitespace-nowrap"
>
서울
</
button
>
<
button
id
=
{
"
Busan
"
}
onClick
=
{
handleClick
}
className
=
"text-start px-5 py-2 hover:underline whitespace-nowrap"
>
부산
</
button
>
<
button
id
=
{
"
Incheon
"
}
onClick
=
{
handleClick
}
className
=
"text-start px-5 py-2 hover:underline whitespace-nowrap"
>
인천
</
button
>
<
button
id
=
{
"
Daegoo
"
}
onClick
=
{
handleClick
}
className
=
"text-start px-5 py-2 hover:underline whitespace-nowrap"
>
대구
</
button
>
<
button
id
=
{
"
Gwangjoo
"
}
onClick
=
{
handleClick
}
className
=
"text-start px-5 py-2 hover:underline whitespace-nowrap"
>
광주
</
button
>
<
button
id
=
{
"
Daejeon
"
}
onClick
=
{
handleClick
}
className
=
"text-start px-5 py-2 hover:underline whitespace-nowrap"
>
대전
</
button
>
<
button
id
=
{
"
Woolsan
"
}
onClick
=
{
handleClick
}
className
=
"text-start px-5 py-2 hover:underline whitespace-nowrap"
>
울산
</
button
>
<
button
id
=
{
"
Sejong
"
}
onClick
=
{
handleClick
}
className
=
"text-start px-5 py-2 hover:underline whitespace-nowrap"
>
세종
</
button
>
<
button
id
=
{
"
Dokdo
"
}
onClick
=
{
handleClick
}
className
=
"text-start px-5 py-2 hover:underline whitespace-nowrap"
>
독도
</
button
>
<
button
id
=
{
"
Jeju
"
}
onClick
=
{
handleClick
}
className
=
"text-start px-5 py-2 hover:underline whitespace-nowrap"
>
제주
</
button
>
{
/* citylist */
}
<
div
onClick
=
{
()
=>
clickActive
(
1
)
}
>
<
button
id
=
{
"
Seoul
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
1
?
onactive
:
offactive
}
>
서울
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
2
)
}
>
<
button
id
=
{
"
Busan
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
2
?
onactive
:
offactive
}
>
부산
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
3
)
}
>
<
button
id
=
{
"
Incheon
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
3
?
onactive
:
offactive
}
>
인천
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
4
)
}
>
<
button
id
=
{
"
Daegoo
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
4
?
onactive
:
offactive
}
>
대구
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
5
)
}
>
<
button
id
=
{
"
Gwangjoo
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
5
?
onactive
:
offactive
}
>
광주
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
6
)
}
>
<
button
id
=
{
"
Daejeon
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
6
?
onactive
:
offactive
}
>
대전
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
7
)
}
>
<
button
id
=
{
"
Woolsan
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
7
?
onactive
:
offactive
}
>
울산
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
8
)
}
>
<
button
id
=
{
"
Sejong
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
8
?
onactive
:
offactive
}
>
세종
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
9
)
}
>
<
button
id
=
{
"
Dokdo
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
9
?
onactive
:
offactive
}
>
독도
</
button
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
10
)
}
>
<
button
id
=
{
"
Jeju
"
}
onClick
=
{
handleClick
}
className
=
{
active
===
10
?
onactive
:
offactive
}
>
제주
</
button
>
</
div
>
</
div
>
// Citylist Page
);
...
...
frontend/src/types/index.tsx
View file @
ab76f24e
...
...
@@ -39,7 +39,8 @@ export interface SignupUser {
export
interface
Profile
{
_id
:
string
;
email
:
string
;
fileInfo
:
{
name
:
string
;
avatar
:
{
originalfilename
:
string
;
newfilename
:
string
;
picturepath
:
string
;
...
...
src/controllers/fileinfo.controller.ts
View file @
ab76f24e
...
...
@@ -4,7 +4,11 @@ import { TypedRequest } from "../types";
export
const
uploadFile
=
asyncWrap
(
async
(
reqExp
,
res
,
next
)
=>
{
const
req
=
reqExp
as
TypedRequest
;
const
form
=
formidable
({
multiples
:
false
,
uploadDir
:
"
uploads
"
});
const
form
=
formidable
({
multiples
:
false
,
uploadDir
:
"
uploads
"
,
keepExtensions
:
true
,
});
await
new
Promise
((
resolve
,
reject
)
=>
{
form
.
parse
(
req
,
(
err
,
fields
,
files
)
=>
{
...
...
@@ -25,7 +29,11 @@ export const uploadFile = asyncWrap(async (reqExp, res, next) => {
export
const
uploadFiles
=
asyncWrap
(
async
(
reqExp
,
res
,
next
)
=>
{
const
req
=
reqExp
as
TypedRequest
;
const
form
=
formidable
({
multiples
:
true
,
uploadDir
:
"
uploads
"
});
const
form
=
formidable
({
multiples
:
true
,
uploadDir
:
"
uploads
"
,
keepExtensions
:
true
,
});
await
new
Promise
((
resolve
,
reject
)
=>
{
form
.
parse
(
req
,
(
err
,
fields
,
files
)
=>
{
...
...
src/db/index.ts
View file @
ab76f24e
export
*
as
roleDb
from
"
./role.db
"
;
export
*
as
postDb
from
"
./post.db
"
;
export
*
as
userDb
from
"
./user.db
"
;
export
*
as
mainimgDb
from
"
./mainimg.db
"
\ No newline at end of file
export
*
as
mainimgDb
from
"
./mainimg.db
"
;
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