모범 답안

2개의 파일을 수정하고 1개의 파일을 추가하셔야 합니다.

우선 urls.py를 수정하겠습니다.

urls.py
from django.contrib import admin
from django.urls import path
from facebook.views import play
from facebook.views import play2
from facebook.views import my_profile
from facebook.views import event
from facebook.views import fail, help, warn
from facebook.views import newsfeed
from facebook.views import detail_feed
from facebook.views import pages
from facebook.views import new_feed
from facebook.views import remove_feed, edit_feed
from facebook.views import new_page
urlpatterns = [
path('admin/', admin.site.urls),
path('play/', play),
path('play2/', play2),
path('dogeunchoi/profile/', my_profile),
path('event/', event),
path('fail/', fail),
path('help/', help),
path('warn/', warn),
path('', newsfeed),
path('feed/<pk>/', detail_feed),
path('feed/<pk>/remove/', remove_feed),
path('feed/<pk>/edit/', edit_feed),
path('new/', new_feed),
path('pages/', pages),
path('pages/new/', new_page),
]

이어서 views.py를 수정합니다.

views.py
def new_page(request):
if request.method == 'POST': # 폼이 전송되었을 때만 아래 코드를 실행
new_page = Page.objects.create(
master=request.POST['master'],
name=request.POST['name'],
text=request.POST['text'],
category=request.POST['category']
)
# 새 페이지 개설 완료
return redirect('/pages/')
return render(request, 'new_page.html')

templates 폴더안에 아래와 같은 html 파일을 추가해줍니다.

new_page.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>페이지 만들기</title>
</head>
<body>
<style>
body { background-color: #d7d8dc; }
* { box-sizing: border-box; margin: 0; padding: 0; }
.header {
background-color: #475d9f;
color: #fff;
height: 42px;
border-bottom: 1px solid #2c3863;
}
.btn1 {
position: absolute;
left: 0px;
}
.search {
position: absolute;
left: 50px;
right: 50px;
}
.btn2 {
position: absolute;
right: 0px;
}
.searchbar {
border: 1px solid #2c3863;
background-color: #323f6b;
width: 100%;
padding: 6px;
margin-top: 7px;
border-radius: 4px;
color: #fff;
}
.container {
background-color: #d7d8dc;
}
.footer {
position: fixed;
bottom: 0;
left: 0;
right: 0;
border-top: 1px solid #cccccc;
background-color: #ffffff;
height: 50px;
background-color: #fafafa;
text-align: center;
}
.tab1 {
float: left;
width: 25%;
}
.tab2 {
float: left;
width: 25%;
}
.tab3 {
float: left;
width: 25%;
}
.tab4 {
float: left;
width: 25%;
}
.feed {
background-color: #ffffff;
border-top: 1px solid #c0c0c0;
border-bottom: 1px solid #c0c0c0;
margin: 7px 0;
padding: 12px;
}
.date {
color: #999;
margin-bottom: 10px;
}
.title {
color: #6184dddd;
font-weight: 600;
}
.content {
margin-top: 5px;
}
.accessory {
border-top: 1px solid #eee;
padding-top:10px;
margin-top:10px;
color: #999;
font-size: 14px;
}
.more {
font-size: 14px;
color: #6184dddd;
}
a {
color: inherit;
text-decoration: none;
}
.form_box {
background-color: #ffffff;
margin: 10px;
border-radius: 4px;
border: 1px solid #ddd;
padding: 10px;
}
.input_field {
border: 1px solid #ddd;
border-radius: 4px;
padding: 4px;
margin: 3px 0;
font-size: 14px;
width: 100%;
}
.textarea_field {
border: 1px solid #ddd;
border-radius: 4px;
padding: 4px;
margin: 3px 0;
font-size: 14px;
width: 100%;
height: 160px;
}
.write_button {
background-color: #475d9f;
border: 1px solid #323f6b;
color: #ffffff;
border-radius: 4px;
padding: 2px 8px;
font-soze: 18px;
}
</style>
<div class="header">
<div class="btn1"><a href="/new"><img src="/static/ic_pencil.jpg" width="22px" style="margin:9px 0 0 13px"></a></div>
<div class="search">
<input type="text" class="searchbar" placeholder="Search">
</div>
<div class="btn2"><img src="/static/ic_info.jpg" width="22px" style="margin:9px 13px 0 0"></div>
</div>
<div class="container">
<div class="form_box">
<form method="POST">
{% csrf_token %}
<h3>페이지 만들기</h3>
<input class="input_field" type="text" placeholder="주인" name="master"><br>
<input class="input_field" type="text" placeholder="이름" name="name"><br>
<input class="input_field" type="text" placeholder="페이지 분야" name="category"><br>
<textarea class="textarea_field" placeholder="페이지를 설명해주세요." name="text"></textarea><br>
<button class="write_button">게시</button>
</form>
</div>
</div>
<div class="footer">
<div class="tab1"><img src="/static/ic_feed.jpg" width="22px" style="margin-top: 15px"></div>
<div class="tab2"><img src="/static/ic_person.jpg" width="20px" style="margin-top: 14px"></div>
<div class="tab3"><img src="/static/ic_globe.jpg" width="20px" style="margin-top: 14px"></div>
<div class="tab4"><img src="/static/ic_etc.jpg" width="20px" style="margin-top: 14px"></div>
</div>
</body>
</html>