화성 땅 공동구매 | 스파르타 커뮤니티

커뮤니티

포인트

쿠폰

내 강의실

국비 신청 내역

증명서

계정

로그아웃

학습 질문

개발 일지

나의 활동

답변 완료

화성 땅 공동구매

undefined주차

이*원

・

추천

・

조회수

답변 완료

* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.

* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.

튜터님께서 하라고 하신대로 코드 입력해도 여전히 에러가 뜹니다ㅠㅠ

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


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


    <link href="https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&display=swap" rel="stylesheet" />


    <title>운동 일지</title>


    <style>
        * {
            font-family: "Gowun Batang", serif;
            color: white;
        }


        body {
            background-image: linear-gradient(0deg,
                    rgba(0, 0, 0, 0.5),
                    rgba(0, 0, 0, 0.5)),
                url("https://www.digidog3d.com/data/editor_data/858f025196f0dac9a027ae1a9cc5734e_1652080389_2866.jpg");
            background-position: center;
            background-size: cover;
        }


        h1 {
            font-weight: bold;
        }


        .order {
            width: 500px;
            margin: 60px auto 0px auto;
            padding-bottom: 60px;
        }


        .mybtn {
            width: 100%;
        }


        .order>table {
            margin: 40px 0;
            font-size: 18px;
        }


        option {
            color: black;
        }
    </style>
    <script>
        $(document).ready(function () {
            show_order();
        });
        function show_order() {
            fetch('/mars').then((res) => res.json()).then((data) => {
                console.log(data)
                alert(data['msg'])
            })
        }
        function save_order() {
            let name=$('#name').val()
            let address=$('#address').val()
            let size=$('#size').val()


            let formData = new FormData();
            formData.append("name_give", name)
            formData.append("address_give", address)
            formData.append("size_give", size)


            fetch('/mars', { method: "POST", body: formData }).then((res) => res.json()).then((data) => {
                console.log(data);
                alert(data["msg"]);
                window.location.reload();
            });
        }
    </script>
</head>


<body>
    <div class="mask"></div>
    <div class="order">
        <h1>운동 챌린지🏋🏻‍♀️</h1>
        <h3>나는 운동한다 고로 존재한다. </h3>
        <p>
            중요한 것은<br />
            꺾이지 않는 마음!
        </p>
        <div class="order-info">
            <div class="input-group mb-3">
                <span class="input-group-text">시간</span>
                <input id="name" type="text" class="form-control" />
            </div>
            <div class="input-group mb-3">
                <span class="input-group-text">종목</span>
                <input id="address" type="text" class="form-control" />
            </div>
            <div class="input-group mb-3">
                <label class="input-group-text" for="size">횟수</label>
                <select class="form-select" id="size">
                    <option selected>-- 운동 횟수 --</option>
                    <option value="10평">30회</option>
                    <option value="20평">40회</option>
                    <option value="30평">50회</option>
                    <option value="40평">60회</option>
                    <option value="50평">70회</option>
                    <option value="50평">80회</option>
                    <option value="50평">90회</option>
                    <option value="50평">100회</option>
                </select>
            </div>
            <button onclick="save_order()" type="button" class="btn btn-warning mybtn">
                입력하기
            </button>
        </div>
        <table class="table">
            <thead>
                <tr>
                    <th scope="col">시간</th>
                    <th scope="col">종목</th>
                    <th scope="col">횟수</th>
                </tr>
            </thead>
            <tbody id="order-box">
                <tr>
                    <td>7:00</td>
                    <td>스쿼트</td>
                    <td>50회</td>
                </tr>
                <tr>
                    <td>7:15</td>
                    <td>레그프레스</td>
                    <td>60회</td>
                </tr>
                <tr>
                    <td>7:30</td>
                    <td>레그레이즈</td>
                    <td>40회</td>
                </tr>
            </tbody>
        </table>
    </div>
</body>


</html>

app.py

import certifi
from pymongo import MongoClient
from flask import Flask, render_template, request, jsonify
app = Flask(__name__)



ca = certifi.where()


client = MongoClient(
    'mongodb+srv://sparta:test@cluster0.t7edg36.mongodb.net/?retryWrites=true&w=majority', tlsCAFile=ca)
db = client.dbsparta



@app.route('/')
def home():
    return render_template('index.html')



@app.route("/mars", methods=["POST"])
def mars_post():
    name_receive = request.form['name_give']
    address_receive = request.form['address_give']
    size_receive = request.form['size_give']



doc = {
    'name':name_receive,
    'address':address_receive,
    'size':size_receive
}


db.mars.insert_one(doc)


return jsonify({'msg': '저장 완료!'})



@app.route("/mars", methods=["GET"])
def mars_get():
    return jsonify({'msg': 'GET 연결 완료!'})



if __name__ == '__main__':
    app.run('0.0.0.0', port=5001, debug=True)

댓글 알림