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
375dd180
Commit
375dd180
authored
Jul 04, 2022
by
Kim, MinGyu
Browse files
글쓰기
parent
e928e6d8
Changes
4
Hide whitespace changes
Inline
Side-by-side
frontend/src/App.tsx
View file @
375dd180
...
...
@@ -6,6 +6,7 @@ import Body from "./Pages/body";
import
Board
from
"
./Pages/board
"
;
import
Login
from
"
./Pages/login
"
;
import
Signup
from
"
./Pages/signup
"
;
import
Posting
from
"
./Pages/posting
"
;
export
const
App
=
()
=>
{
return
(
...
...
@@ -17,6 +18,7 @@ export const App = () => {
<
Route
path
=
"/"
element
=
{
<
Header
/>
}
>
<
Route
index
element
=
{
<
Body
/>
}
/>
<
Route
path
=
"board"
element
=
{
<
Board
/>
}
/>
<
Route
path
=
"posting"
element
=
{
<
Posting
/>
}
/>
</
Route
>
</
Routes
>
</
BrowserRouter
>
...
...
frontend/src/Pages/posting.tsx
0 → 100644
View file @
375dd180
import
React
from
"
react
"
;
export
default
function
Posting
()
{
return
(
<
div
className
=
"flex flex-col border-3"
>
<
form
className
=
"w-full items-center"
>
<
div
className
=
"flex flex-row relative"
>
<
p
className
=
"basis-4/12 place-self-center"
>
Id
</
p
>
<
p
className
=
"basis-8/12 invisible"
>
empty
</
p
>
<
button
data
-
dropdown
-
toggle
=
"dropdownId"
className
=
"basis-1/12"
>
Theme
</
button
>
<
p
className
=
"basis-1/12"
>
city
</
p
>
<
button
className
=
"basis-1/12 "
>
글쓰기
</
button
>
</
div
>
<
div
className
=
"flex border-4"
>
<
textarea
placeholder
=
"title"
className
=
"w-full h-8"
></
textarea
>
</
div
>
<
div
className
=
"flex border-2"
>
<
textarea
placeholder
=
"body"
className
=
"w-full h-96"
></
textarea
>
</
div
>
</
form
>
</
div
>
);
}
\ No newline at end of file
frontend/src/pages/board.tsx
View file @
375dd180
import
React
,
{
useState
,
}
from
"
react
"
;
import
{
PostType
}
from
"
./typesrc
"
;
import
Post
from
"
./post
"
;
import
{
Link
}
from
"
react-router-dom
"
function
range
(
start
:
number
,
end
:
number
)
{
function
range
(
start
:
number
,
end
:
number
)
{
return
(
new
Array
(
end
-
start
+
1
)).
fill
(
undefined
).
map
((
_
,
i
)
=>
i
+
start
);
}
const
fakes
=
[{
id
:
"
a
"
,
title
:
'
부산남자의 서울여행
'
,
date
:
'
2022-06-30
'
,},
{
id
:
"
b
"
,
title
:
'
바다!바다!바다!
'
,
date
:
'
2022-08-01
'
,},
{
id
:
"
c
"
,
title
:
'
Jeju-island
'
,
date
:
'
2022-9-10
'
,},
{
id
:
"
d
"
,
title
:
'
마! 부싼 가봤나!
'
,
date
:
'
2022-9-22
'
,
},
{
id
:
"
e
"
,
title
:
'
Daegu
'
,
date
:
'
2022-10-1
'
,
},
{
id
:
"
f
"
,
title
:
'
강원도 감자는 맛있다.
'
,
date
:
'
2022-12-12
'
,},
{
id
:
"
g
"
,
title
:
'
여행가고싶다...
'
,
date
:
'
2022-12-25
'
,}];
const
fakes
=
[{
id
:
"
a
"
,
title
:
'
부산남자의 서울여행
'
,
date
:
'
2022-06-30
'
,
},
{
id
:
"
b
"
,
title
:
'
바다!바다!바다!
'
,
date
:
'
2022-08-01
'
,
},
{
id
:
"
c
"
,
title
:
'
Jeju-island
'
,
date
:
'
2022-9-10
'
,
},
{
id
:
"
d
"
,
title
:
'
마! 부싼 가봤나!
'
,
date
:
'
2022-9-22
'
,
},
{
id
:
"
e
"
,
title
:
'
Daegu
'
,
date
:
'
2022-10-1
'
,
},
{
id
:
"
f
"
,
title
:
'
강원도 감자는 맛있다.
'
,
date
:
'
2022-12-12
'
,
},
{
id
:
"
g
"
,
title
:
'
여행가고싶다...
'
,
date
:
'
2022-12-25
'
,
}];
interface
Posts
{
posts
:
PostType
[];
}
export
default
function
BoardPage
()
{
const
[
posts
,
setPosts
]
=
useState
<
PostType
[]
>
(
fakes
);
const
[
posts
,
setPosts
]
=
useState
<
PostType
[]
>
(
fakes
);
return
(
<
div
className
=
"flex flex-col items-center"
>
...
...
@@ -29,17 +30,17 @@ export default function BoardPage() {
<
div
className
=
"flex flex-col w-10/12 mt-16"
>
<
div
className
=
"flex justify-end"
>
<
div
className
=
"border-2 mb-2"
><
button
>
글쓰기+
</
button
></
div
>
{
/* Link */
}
<
div
className
=
"border-2 mb-2"
><
Link
to
=
"/posting"
><
button
>
글쓰기+
</
button
></
Link
></
div
>
{
/* Link */
}
</
div
>
<
div
className
=
"sm:overflow-y-scroll"
>
<
div
className
=
"flex flex-row divide-x-2 border-2 border-solid bg-gray-500 border-y-2 h-10 "
>
<
div
className
=
"basis-full"
>
Title
</
div
>
<
div
className
=
"basis-3/12"
>
Date
</
div
>
<
div
className
=
"basis-2/12"
>
Clicks
</
div
>
<
div
className
=
"basis-full"
>
Title
</
div
>
<
div
className
=
"basis-3/12"
>
Date
</
div
>
<
div
className
=
"basis-2/12"
>
Clicks
</
div
>
</
div
>
<
div
>
{
posts
.
map
((
post
)
=>
(
<
Post
key
=
{
post
.
id
}
post
=
{
post
}
/>
<
Post
key
=
{
post
.
id
}
post
=
{
post
}
/>
))
}
</
div
>
</
div
>
...
...
frontend/src/pages/login.tsx
View file @
375dd180
import
{
Link
,
}
from
"
react-router-dom
"
;
import
React
from
"
react
"
;
import
React
,
{
useState
}
from
"
react
"
;
interface
login
{
id
:
string
;
password
:
string
;
}
export
default
function
Login
()
{
const
fake
=
{
id
:
"
asdf
"
,
password
:
"
qwer
"
}
function
Logindata
(
fake
:
login
){
const
[
id
,
setId
]
=
useState
(
""
);
const
[
password
,
setPassword
]
=
useState
(
""
);
return
(
<
div
className
=
"flex flex-col md:w-2/3 md:gap-2"
>
<
input
className
=
"
placeholder
:
text
-
slate
-
300
bg
-
white
border
border
-
slate
-
500
rounded
-
2xl
py
-
2
pl
-
9
pr
-
3
focus
:
border
-
black
" placeholder="
Id
" type="
text
" name="
Id
"
onChange
=
{
(
e
)
=>
setId
(
e
.
target
.
value
)
}
/>
<
input
className
=
"
placeholder
:
italic
placeholder
:
text
-
slate
-
300
bg
-
white
border
border
-
slate
-
500
rounded
-
2xl
py
-
2
pl
-
9
pr
-
3
focus
:
border
-
black
" placeholder="
Password
" type="
text
" name="
Password
"
onChange
=
{
(
e
)
=>
setPassword
(
e
.
target
.
value
)
}
/>
</
div
>
)
}
export
default
function
Login
()
{
return
(
<
div
>
<
div
className
=
"flex flex-row grid grid-rows-2"
>
<
div
className
=
" p-12 w-1/2 h-1/2 md:w-40 md:h-40 bg-red-400 place-self-center rounded-2xl"
>
<
Link
to
=
"/"
>
Travel Report
</
Link
>
</
div
>
<
div
className
=
" flex-row w-auto h-60 md:w-1/2 bg-white border-2 border-black grid place-items-center rounded-xl place-self-center"
>
<
div
className
=
"flex flex-col w-full md:flex-row md:p-20 md:gap-10"
>
<
div
className
=
"flex flex-col md:w-2/3 md:gap-2"
>
<
input
className
=
"
placeholder
:
text
-
slate
-
300
bg
-
white
border
border
-
slate
-
500
rounded
-
2xl
py
-
2
pl
-
9
pr
-
3
focus
:
border
-
black
" placeholder="
Id
" type="
text
" name="
Id
"
/>
<
input
className
=
"
placeholder
:
italic
placeholder
:
text
-
slate
-
300
bg
-
white
border
border
-
slate
-
500
rounded
-
2xl
py
-
2
pl
-
9
pr
-
3
focus
:
border
-
black
" placeholder="
Password
" type="
text
" name="
Password
"
/>
<
div
>
{
/* <form onSubmit={loginsubmit}> */
}
<
div
className
=
"flex flex-row grid grid-rows-2"
>
<
div
className
=
" p-12 w-1/2 h-1/2 md:w-40 md:h-40 bg-red-400 place-self-center rounded-2xl"
>
<
Link
to
=
"/"
>
Travel Report
</
Link
>
</
div
>
<
button
className
=
"md:w-1/3 bg-sky-600 hover:bg-sky-700 rounded-xl"
>
login
</
button
>
</
div
>
<
div
className
=
"flex-row grid grid-cols-3"
>
<
button
className
=
"bg-white bottom-0 right-0"
>
<
Link
to
=
"/signup"
>
회원가입
</
Link
>
</
button
>
<
div
></
div
>
<
button
className
=
"bg-white inset-x-0"
>
<
Link
to
=
"/forgot"
>
비밀번호 찾기
</
Link
>
</
button
>
<
div
className
=
" flex-row w-auto h-60 md:w-1/2 bg-white border-2 border-black grid place-items-center rounded-xl place-self-center"
>
<
div
className
=
"flex flex-col w-full md:flex-row md:p-20 md:gap-10"
>
<
Logindata
id
=
{
""
}
password
=
{
""
}
/>
<
button
type
=
"submit"
className
=
"md:w-1/3 bg-sky-600 hover:bg-sky-700 rounded-xl"
>
login
</
button
>
</
div
>
<
div
className
=
"flex-row grid grid-cols-3"
>
<
button
className
=
"bg-white bottom-0 right-0"
>
<
Link
to
=
"/signup"
>
회원가입
</
Link
>
</
button
>
<
div
></
div
>
<
button
className
=
"bg-white inset-x-0"
>
<
Link
to
=
"/forgot"
>
비밀번호 찾기
</
Link
>
</
button
>
</
div
>
</
div
>
</
div
>
</
div
>
</
div
>
</
div
>
// Login Page
{
/* </form> */
}
</
div
>
// Login Page
);
}
\ No newline at end of file
}
\ 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