커뮤니티
포인트
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
5주차 숙제에서 콘솔에 에러가 나오는데 왜그럴까요?
[왕초보] 코딩이 처음이어도 쉽게 배우는 웹개발 A to Z v0
5주차
북마크
김*란
댓글
38
추천
0
조회수
66
조회수
66
답변 완료

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

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


숙제 작성을 다한 것 같은데 콘솔창에 에러가 뜹니다 왜그럴까요?



 고 계신 화면 전체를 캡처해 주시면, 튜터님들이 빠르게 상황을 이해할 수 있어요.


import { initializeApp } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-app.js";

        import { getFirestore } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";

        import { collection, addDoc } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";

        import { getDocs } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";



        // Firebase 구성 정보 설정

        const firebaseConfig = {

            apiKey: "AIzaSyC5DUUM8j4P_0xiWVMDo425rT67uRpCak8",

            authDomain: "sprata-24865.firebaseapp.com",

            projectId: "sprata-24865",

            storageBucket: "sprata-24865.appspot.com",

            messagingSenderId: "526106325681",

            appId: "1:526106325681:web:27ca775c92cf5be557e890",

            measurementId: "G-DZW2BBQM2G"    본인 설정 내용 채우기

        };

const app = initializeApp(firebaseConfig);

        const db = getFirestore(app);


        $("#addbtn").click(async function () {

            let image = $('#image').val();

            let title = $('#title').val();

            let stars = $('#stars').val();

            let comment = $('#comment').val();


            let doc = {

                'image': image,

                'title': title,

                'star': star,

                'comment': comment,

            };

            await addDoc(collection(db, "푸드파이터"), doc);

            alert('저장 완료!');

            window.location.reload();

        })

        $("#savebtn").click(async function () {

            $('#postingbox').toggle();

        })





        $("row-cols-3").empty();

        let docs = await getDocs(collection(db, "푸드파이터"));

        docs.forEach((doc) => {

            let row = doc.data();

            let image = row['image'];

            let title = row['title'];

            let comment = row['comment'];

            let star = row['star'];


            let temp_html = `

            <div class="col">

                <div class="card h-100">

                    <img src="${image}"

                        class="card-img-top" alt="...">

                    <div class="card-body">

                        <h5 class="card-title">${title}</h5>

                        <p class="card-text">${star}</p>

                        <p class="card-text">${comment}</p>

                    </div>

                </div>

            </div>`;

            $('#card').append(temp_html);

        });

const app = initializeApp(firebaseConfig);

        const db = getFirestore(app);


        $("#addbtn").click(async function () {

            let image = $('#image').val();

            let title = $('#title').val();

            let stars = $('#stars').val();

            let comment = $('#comment').val();


            let doc = {

                'image': image,

                'title': title,

                'star': star,

                'comment': comment,

            };

            await addDoc(collection(db, "푸드파이터"), doc);

            alert('저장 완료!');

            window.location.reload();

        })

        $("#savebtn").click(async function () {

            $('#postingbox').toggle();

        })





        $("row-cols-3").empty();

        let docs = await getDocs(collection(db, "푸드파이터"));

        docs.forEach((doc) => {

            let row = doc.data();

            let image = row['image'];

            let title = row['title'];

            let comment = row['comment'];

            let star = row['star'];


            let temp_html = `

            <div class="col">

                <div class="card h-100">

                    <img src="${image}"

                        class="card-img-top" alt="...">

                    <div class="card-body">

                        <h5 class="card-title">${title}</h5>

                        <p class="card-text">${star}</p>

                        <p class="card-text">${comment}</p>

                    </div>

                </div>

            </div>`;

            $('#card').append(temp_html);

        });






취소
 공유
취소
댓글 0
댓글 알림
나의얼굴