240711 TIL_팀 프로젝트5 () > 바보 이슈

바보가튼 나
오늘은 프로젝트 하면서 한 바보 이슈에 대해 말해볼까 한다....

바보 이슈1

        <svg
          className={`absolute w-[25%] h-[25%] top-[33%] fill-[#ffffff] 
          ${
            index % 2 === 0
              ? "right-[-12%] rotate-90"
              : "left-[-12%] rotate-[270deg]"
          }`}
          viewBox="0 0 100 100"
        >
        </svg>

인덱스 홀짝수에 따라 말풍선을 왔다 갔다 하는 걸 구현하려고 했는데 뭐가 잘 안 됐다. 테일윈드 조건부 함수 나름 잘 쓴 것 같다고 생각했는데도 안 돼서 여기서 잠시 막혔다... 근데 바보 이슈

조건부 함수를 쓰는 것도 익숙했던 게 아니라서, 혹시 어디가 잘못됐는지 계속 봤다.... 위에 중복 부분까지 같이 넣어야 하나..? 하며 인덱스 부분만 한참 봤다.

그런데......

오잉 내 흰 삼각형 그려주는 다각형 친구 어디갔어

          <polygon points="25,0 50,50 0,50" />

어디갔었냐구 너

        <svg
          className={`absolute w-[25%] h-[25%] top-[33%] fill-[#ffffff] 
          ${
            index % 2 === 0
              ? "right-[-12%] rotate-90"
              : "left-[-12%] rotate-[270deg]"
          }`}
          viewBox="0 0 100 100"
        >
          <polygon points="25,0 50,50 0,50" />
        </svg>

넣어주니까 된다.... 사실 이 모든 게 기본기 부족이라는 생각이 든다. svg 태그에 대한 이해도 없이 쓰려고 해서 생긴 문제. 너무너무 사소한 문제라서 이젠 싱거워....

바보 이슈2

오늘은 바보 이슈가 왜 이리 많을까?

  console.log(comment);
  if (comment === null) {
    console.log("작동 되는 건가?");
    return (
      <div className="flex justify-center text-gray-300">
        댓글이 없어요, 첫 댓글을 작성해보세요!
        <MdOutlineCatchingPokemon className="mt-1" />
      </div>
    );
  }

이게 왜 안 되는가 싶어서 콘솔을 덕지덕지 붙여서 생각해보는데 어...? text-....gray....?

  console.log(comment);
  if (comment === null) {
    console.log("작동 되는 건가?");
    return (
      <div className="flex justify-center">
        댓글이 없어요, 첫 댓글을 작성해보세요!{" "}
        <MdOutlineCatchingPokemon className="mt-1" />
      </div>
    );

아무리 생각해도 오늘 내가 좀...........

좀 그렇다^^