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