TIL_20_1126

20일 차 회고

프로젝트 마무리.

각자 팀원 이 작업했던 내용을 이제 합치는 단계에 왔다.
금요일 발표였는데 월요일로 변경되어 그나마 시간을 벌게 되어 다행이다..ㅠ
주말에도 팀원과 나와서 같이 작업 하기로 했다...
어서 끝나고 팀원과 회고를 하고싶다....^^...

프로필 저장 구현

<div class="container">
  <div class="main_right">
    <div class="tit_wrap">
      <h2 class="main_tit">내 프로필</h2>
    </div>
    <div class="profile_wrap">
      <div class="profile-second img profile_large">
        <img id="profileView" src="/assets/blankProfile.webp" />
      </div>


      <div class="profileModify">
      <div class="profile_info" id="userInfo">
        
        <div class="profile-main">
          <h2 class="sub_tit" id="userID">아이디</h2>
          <span id="profileBtn" class="modifyBTN" onclick="changeModify(event)">수정</span>
        </div>
        <div id="tagViewList" class="tag_list">
         
        </div>
        <div class="line_intro">
          <h3 class="sub_tit">한 줄 소개</h3>
          <p id="line_txt"></p>
        </div>
      </div>

    </div>
  </div>
</div>

import { dbService } from "../firebase.js";

import {
  collection,
  query,
  getDocs,
  orderBy,
} from "https://www.gstatic.com/firebasejs/9.14.0/firebase-firestore.js";

export const getProfileInfor = async () => {
  //프로필 해쉬태그 + 간단한소개 저장
  let profileObjList = [];
  console.log(profileObjList);
  const q = query(
    collection(dbService, "profileInfor"),
    orderBy("createdAt", "desc")
  );
  const querySnapshot = await getDocs(q);

  querySnapshot.forEach((doc) => {
    const profileInfoObj = {
      id: doc.id,
      ...doc.data(),
    };
    profileObjList.push(profileInfoObj);
  });

  const userID = document.getElementById("userID");
  const userNickName = profileObjList[0].nickname ?? "닉네임 없음";
  userID.innerText = userNickName;

  const tagInputs = profileObjList[0]?.tagInput || [];
  
  tagInputs.forEach((inputs) => {
    const span = document.createElement("span");
    span.classList.add("tagView");
    span.innerHTML = inputs;
    //갯수가 3개 일때 보여주기를 멈춰라.
    if (document.querySelector("#tagViewList").childElementCount <= 2) {
      document.querySelector("#tagViewList").appendChild(span);
    }
  });

  const line_txt = document.getElementById("line_txt");
  line_txt.innerText =
    profileObjList[0]?.introTxt ||
    "당신에 대한 간단한 한 줄 소개를 적어주세요.";
};

export const changeModify = () => {
  window.location.hash = "#profileModify";
};