
정은지 방명록이 안떠요.
기록이 안남으니까 제대로 완성이 안되었어요. 웹개발 종합반 동영상 수정부탁드려요! 오류가 너무 많아요!
제발 대충 답변넣거나 그냥 넘어가지마세요! 몇번동안 계속 똑같은 질문을 여러번 번거롭게 올립니다.
문의하기에서도 답변을 해주시면 좋겠지만, 문의하기에서는 행정적인 것만 해야한데요.
무엇 때문에 버튼이 안눌리고, 메세지가 안뜨는 건가요? 메세지 기록하기도 안되요. 응원 남기기 버튼 기록이 안되요. 어떻게 기록되었는지 확인하고, 왜 메세지가 안뜨는지 알려주세요!
빨간글씨가 있는데, 여기서 문제가 생기는건가요?
왜 빨간글씨가 뜨는건가요? 문제 해결좀 도와주세요!
빨간색 글씨가 오류가 있는것 같아요.
그리고 제 웹개발플러스, 앱개발 플러스 수강권 두개가 왜 둘다 자유수강권으로 바뀌었나요?
아래 두 문자 부분이 오류가 발생했어요!
오류가 생긴 부분 자세히 찾아줬으니, 이번에는 그냥 넘어가지 말고, 빠르게 제대로된 답변 부탁드려요! 꼭 클리어 하고 싶어요!
"floatingInput"
"floatingTextarea2"
</script>
</head>
<body>
<div class="mypic"><h1>정은지 팬명록</h1><p>현재기온: <span id="temp">36</span>도</p>
</div>
<div class="mypost"><div class="form-floating mb-3"><input type="text" class="form-control" id="name" placeholder="url"><label for="floatingInput">닉네임</label></div><div class="form-floating">
<textarea class="form-control" placeholder="Leave a comment here" id="comment"style="height: 100px"></textarea><label for="floatingTextarea2">응원댓글</label></div><button onclick="save_comment()" type="button" class="btn btn-dark">응원 남기기</button>
</div>
<div class="mycards" id="comment-list">
</div>
</body>
</html>




app.py
from flask import Flask, render_template, request, jsonify
app = Flask(__name__)
from pymongo import MongoClient
client = MongoClient('mongodb+srv://아이디:비밀번호@cluster0.nkkno48.mongodb.net/Cluster0?retryWrites=true&w=majority')
db = client.dbsparta
@app.route('/')
def home():
return render_template('index.html')
@app.route("/homework", methods=["POST"])
def homework_post():
name_receive = request.form['name_give']
comment_receive = request.form['comment_give']
doc = {
'name':name_receive,
'comment':comment_receive
}
db.homework.insert_one(doc)
return jsonify({'msg':'응원 완료!'})
@app.route("/homework", methods=["GET"])
def homework_get():
comment_list = list(db.homework.find({}, {'_id':False}))
return jsonify({'comments':comment_list})
if __name__ == '__main__':
app.run('0.0.0.0', port=5000, debug=True)
index.html
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:title" content="<h1>정은지 팬명록</h1>" /><meta property="og:description" content="응원 한마디 남기고 가세요!" /><meta property="og:image" content="https://search.pstatic.net/common/?src=http%3A%2F%2Fimgnews.naver.net%2Fimage%2F5359%2F2016%2F05%2F11%2F20160511201305_P_00_C_1_153_99_20160511201503.jpg&type=sc960_832" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script><script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"crossorigin="anonymous"></script>
<title>초미니홈피 - 팬명록</title>
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&display=swap"rel="stylesheet"><style>
* {
font-family: 'Noto Serif KR', serif;
}
.mypic {
width: 100%;
height: 300px;
background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('https://search.pstatic.net/common/?src=http%3A%2F%2Fimgnews.naver.net%2Fimage%2F5359%2F2016%2F05%2F11%2F20160511201305_P_00_C_1_153_99_20160511201503.jpg&type=sc960_832');
background-position: center 10%;
background-size: cover;
color: white;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.mypost {
width: 95%;
max-width: 500px;
margin: 20px auto 20px auto;
box-shadow: 0px 0px 3px 0px black;
padding: 20px;
}
.mypost > button {
margin-top: 15px;
}
.mycards {
width: 95%;
max-width: 500px;
margin: auto;
}
.mycards > .card {
margin-top: 10px;
margin-bottom: 10px;
}
</style><script>
$(document).ready(function () {
set_temp()
show_comment()
});
function set_temp() {
$.ajax({
type: "GET",
url: "http://spartacodingclub.shop/sparta_api/weather/seoul",
data: {},
success: function (response) {
$('#temp').text(response['temp'])
}
})
}
function save_comment() {
$.ajax({
type: 'POST',
url: '/homework',
data: {'name_give':name,'comment_give':comment},
success: function (response) {
alert(response['msg'])
window.location.reload()
}
})
}
function show_comment() {
$('#comment-list').empty()
$.ajax({
type: "GET",
url: "/homework",
data: {},
success: function (response) {
let rows = response['comments']
for (let i = 0; i < rows.length; i++){
let name = rows[i]['name']
let comment = rows[i]['comment']
let temp_html = `<div class="card">
<div class="card-body">
<blockquote class="blockquote mb-0">
<p>${comment}</p>
<footer class="blockquote-footer">${name}</footer>
</blockquote>
</div>
</div>`
$('#comment-list').append(temp_html)
}
}
});
}
</script>
</head>
<body>
<div class="mypic"><h1>정은지 팬명록</h1><p>현재기온: <span id="temp">36</span>도</p>
</div>
<div class="mypost"><div class="form-floating mb-3"><input type="text" class="form-control" id="name" placeholder="url"><label for="floatingInput">닉네임</label></div><div class="form-floating">
<textarea class="form-control" placeholder="Leave a comment here" id="comment"style="height: 100px"></textarea><label for="floatingTextarea2">응원댓글</label></div><button onclick="save_comment()" type="button" class="btn btn-dark">응원 남기기</button>
</div>
<div class="mycards" id="comment-list">
</div>
</body>
</html>
오류가 생긴 부분 코딩 요약
</script>
</head>
<body>
<div class="mypic"><h1>정은지 팬명록</h1><p>현재기온: <span id="temp">36</span>도</p>
</div>
<div class="mypost"><div class="form-floating mb-3"><input type="text" class="form-control" id="name" placeholder="url"><label for="floatingInput">닉네임</label></div><div class="form-floating">
<textarea class="form-control" placeholder="Leave a comment here" id="comment"style="height: 100px"></textarea><label for="floatingTextarea2">응원댓글</label></div><button onclick="save_comment()" type="button" class="btn btn-dark">응원 남기기</button>
</div>
<div class="mycards" id="comment-list">
</div>
</body>
</html>
