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
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