TIL_21_221128

21일 차 회고

다영님 2차 디자인 자랑. (feat.지영님과 순두)

프로젝트 마감😭

드디어 프로젝트가 마감되었다.
다들 평일 주말 할 것 없이 밤새서 작업하고 오늘도 마지말 날이라고
밤을 아예 새.버.리.셨다.
많은 아쉬움들이 많았지만 우리는 아.가 니깐 그래도 이렇게
서로를 위해 최선을 다했다는 점에서 너무 뿌듯하다
다들 고생하셨습니다 팔색조 👏👏👏👏👏👏👏

프로젝트 진행하고 느낀점

• 팀원간의 소통이 중요하다
• 에러는 반드시 TIL 작성하고 이해하기
• 개발 머리로 생각하지 않고 손으로 쓰며 생각하기
• 기본 문법 공부하기

앞으로의 계획

• 오전 자바스크립트스터디
• 이번 프로젝트 개발 디벨롭
• 사이드 프로젝트, 프로젝트를 위해 개발 리서치
• 더 간결하고 효율적인 코드를 위해 리팩토링 연습.

프로젝트 트러블 슈팅

export const save_writing = async (event) => {
  event.preventDefault();

  const imgRef = ref(
    storageService,
    `${authService.currentUser.uid}/${uuidv4()}`
  );

  const imgDataUrl = localStorage.getItem("imgDataUrl");
  let downloadUrl;
  if (imgDataUrl) {
    const response = await uploadString(imgRef, imgDataUrl, "data_url");
    downloadUrl = await getDownloadURL(response.ref);
  }

  const coverInput = downloadUrl ? downloadUrl : null;
  const artistName = document.getElementById("artistName");
  const songName = document.getElementById("songName");
  const title = document.getElementById("title");
  const hashTag = document.getElementById("hashTag");
  const bodyText = document.getElementById("bodyText");
  const emojiSelect = document.querySelector("input[name='emoji']:checked");

  const { uid, photoURL, displayName } = authService.currentUser;
  try {
    await addDoc(collection(dbService, "Writings"), {
      coverInput: coverInput,
      artistName: artistName.value,
      songName: songName.value,
      emotion: emojiSelect.value,
      // emotion: emojiSelect.val()
      title: title.value,
      hashTag: hashTag.value,
      bodyText: bodyText.value,
      createdAt: Date.now(),
      creatorId: uid,
      profileImg: photoURL,
      nickname: displayName,
    }).then(() => {
      alert("포스트 업로드 완료");
      // window.location.hash = "#fanLog";
    });

    const defaultImage = document.getElementById("coverView");

    defaultImage.src = "/assets/select_file.png";
    artistName.value = "";
    songName.value = "";
    emojiSelect.checked = false;
    // emojiSelect.prop("checked", false);
    title.value = "";
    hashTag.value = "";
    bodyText.value = "";

// <-------------------------- Trouble shooting -------------------------->

// 게시글을 저장(Create) 함수 : save_writing
// 게시글 불러오기 (Read) 함수 : getPostList

// 문제발생 >>> 게시글을 저장(Create) 하고 새로고침 해야 게시글이 피드에 불러와짐 (Read)
// 원인 >>> Create 함수와 Read 함수가 비동기여서 각각 따로 작동했기 때문
// 해결방법 >>> sync / await 을 활용해 Create 함수에 Read 함수를 종속시켜 동기로 만들기  
//            (Read 함수가 끝나야만 Create 함수 완료될 수 있게 함)

// <-------------------------- Trouble shooting -------------------------->

    await getPostList(event);
  } catch (error) {
    alert(error);
    console.log("error in addDoc:", error);
  }
};