TIL

스파르타 코딩 클럽 사전 캠프 4주차 하는 5주차

영우는여전히 2023. 9. 21. 20:32

 

ㅋㅋ 남들 이미 다 끝나서 복습하고 다른 것 하는데, 이번 주 드디어 4주차에 5주차 진도를 나간다.

 

1. 파이어베이스에 데이터 넣고 가져오는 것 전에 만들던 스파르타 플릭스(넷플릭스st) 복습,

 

2. 모두가 볼 수 있게 배포도 할 것이다. -> 깃허브 초간단 입문

 

3. 파이썬 초간단 맛보기

vsCode 스파르타 플릭스 열고, 파이어 베이스 켠다 -> 콘솔 ... 등 내가 만들어 놓은 대로 들어가기

 

지난 번 것을 참고한다.

 

1. 스타일은 건드리지 않으니 접어놓는다. 아랫쪽 내려가서 그냥 센스껏 col 도 다 접어놓자 귀찮으니까

2. 스크립트> 꺽쇠를 열어 타입 = "모듈" <script type="module">

3.

    <script type="module">

        // Firebase SDK 라이브러리 가져오기
        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";


        // For Firebase JS SDK v7.20.0 and later, measurementId is optional
        const firebaseConfig = {
            apiKey: "AIzaSyDJXn_t_VBpio-PaJuhSCkc8RTId9GG01U",
            authDomain: "saprta-75140.firebaseapp.com",
            projectId: "saprta-75140",
            storageBucket: "saprta-75140.appspot.com",
            messagingSenderId: "322749072371",
            appId: "1:322749072371:web:f8182d0a83d3d479d34886",
            measurementId: "G-N04BM9D512"
        };

        // Firebase 인스턴스 초기화
        const app = initializeApp(firebaseConfig);
        const db = getFirestore(app);

        $(document).ready(function () {
 

 

영화 이미지 주소, 제목 등 입력 했을 때

 

파이어 스토어에다가 데이터를 넣어줘야 함

 

클릭 부터 달아야 하는데

 

클릭을 전에 달았던 방식을

 

그대로 가져오면 된다.

 

 

        <div class="form-floating mb-3">
            <input type="email" class="form-control" id="comment" placeholder="추천 이유">
            <label for="floatingInput">추천 이유</label>
        </div>
        <button id="postingbtn" type="button" class="btn btn-danger">기록하기</button>
    </div>

    <div class="mycards">

<button id="postingbtn" 

 

먼저 버튼 옆에 id="postingbtn"

id 값을 넣어 주었다. -> " 동적으로 클릭을 만들어준다. "

이 코드가 입력이 안 되어있어서 손으로 적었다.

 

image, title, star, comment

$("#postingbtn").click(async function () {
        let image = $('#image').val();
        let title = $('#title').val();
        let star = $('#star').val();
        let comment = $('#comment') .val();
       
        let doc = {
            'image': image,
            'title': title,
            'star': star,
            'comment': comment

 

집중도 잘 안 됐지만

 

그냥 하라는대로 했는데 실행이 안 된다;

 

ㅠㅠㅠㅠㅠㅠㅠㅠㅠ 뭐지

 

물어보기도 애매하고 하 내일 혼자 해봐야겠다

 

 

 

 

간단하게 배포가 무엇인지 설명.

 

적기 *********

 

깃허브 가입 -> 예전에 했었다. 그냥 쉽게 되어있어서 그냥 가입하면 된다...

 

5-6 세팅 Branch -> main 으로 변경

 

배포한 것을 수정.

여기서 내가 올린 인덱스 파일 누르고

 

오른쪽 끝에 ... 을 눌러서 딜리트 파일

눌러 삭제하고 다시 올리면 된다.

 

특정 부분만 수정도 가능하긴 한데 그냥 깔끔하게 딜리트 파일로 하기로

 

 

 

 

커밋 체인지스 눌러서 애드파일 업로드 파일 다시 해서 커밋 체인지스 다시 해서 들어가면 된다.

바뀌는 데 2~3분 정도 걸린다.

 

 

내 키를 인터넷에 다 올려두는 것이지만, 무료배포가 아니라 다른 카드를 등록하고 사용중이라면

 

누군가가 사용해서 잘못 될 수가 있다. 그래서 조심해야 한다.

 

어쨌든 한계점이 있는 부분 보기, 파이썬 연습하기 이다.