24.01.30 최종 프로젝트 배포 후 추가 수정 중

디테일한 부분을 계속 수정 중에 있다 오늘은

상단에 점 3개 더 보기 버튼을 누르면 수정 삭제 버튼이 나오도록 설정했는데 아래 박스 더 보기를 눌러도

위에서만 수정 삭제가 뜨는 대참사가 일어났다 처음에는 기능 문제인가

아니면 map으로 잘못 뿌려 주고 있나 싶었지만 원인은 css였다

 

<PostContainer key={index}>
                <EditBtn onClick={() => handleMoreInfoClick(post.id)} />
                {editingPostId === post.id && (
                  <StfetchForm>
                    <StButton onClick={() => handleEditButtonClick(post.id)}>수정</StButton>
                    <StButton onClick={handleDeletePostButton}>삭제</StButton>
                  </StfetchForm>
                )}

 

에딧 버튼(점 3개)를 누르면 밑에 있는 수정 삭제 버튼이 나와야 하는데

 

const StfetchForm = styled.div`
  flex-direction: column;
  padding: 10px;
  justify-content: flex-end;
  display: flex;
  position: absolute;
  z-index: 20;
  right: 2%;
  top: 16%;
`;

 

패치 폼에는 포지션에 앱솔루트(고정)을 넣어주고

const PostContainer = styled.div`
  width: 1020px;
  margin: 10px auto;
  border-bottom: 1px solid #ccc;
  padding: 15px;
  border-color: #333;
  position: relative;
`;

 

그 위에 상위 컴포넌트에는 position: relative;를 넣어주지 않아서

한 곳에서만 수정, 삭제 버튼이 고정적으로 나타난 것!

 

항상 화면에 렌더링이 안될 때는 기능 구현 코드의 문제였는데

css로도 문제가 생긴 적은 처음이라 많이 당황했습니다. 그래도 이제 다음부터는 안 당할듯하네요.

이전에 준비해둔 구글 로그인도 추가했습니다 로그인 로고 가져다가 css 수정하는 게 제일 번거롭네요

각각의 소셜 로그인마다 공식적인 로그인 로고를 사용해야 한다고 합니다

 

---

그리고 오늘 하루가 끝나갈 때쯤 튜터님이 전체 잡담방에 글을 하나 올려주셨다

---

 

 

우리가 취업할 때 포트폴리오를 제출하게 되면, 채용하는 사람의 입장에서는 사실 코드가 궁금하지 웹브라우저에서 어떻게 생겼는지는 크게 관심이 없어요.

그래서 지원자분이 포트폴리오를 제출해 주시면 깃헙 링크를 들어가서 이곳저곳을 뜯어보며 코드의 질과 수준을 평가하고 함께 하고 싶은지 여부를 판단한답니다.

특히 좋은 회사일 수록 지원자가 많기 때문에, 채용 담당자 입장에서는 모든 지원자들의 포트폴리오를 꼼꼼히 볼 시간이 없어요.

아마도 깃헙에 들어가서 빠르게 몇 개 파일을 보고 판단하는 게 대부분일 거에요.

그런 점에서 여러분들께 해드리고 싶은 말씀은, 지금이라도 "코드의 완성도"를 높이는 데에 시간을 써 주었으면 좋겠다. 입니다.

긴 시간과 많은 노력을 들여서 참여한 프로젝트가 포트폴리오로서 가치가 없다면 그만큼 속상한 일도 없겠죠.

소중한 프로젝트가 정말 채용에 보탬이 될 수 있도록 최소한 맡은 부분에 대한 코드를, 가능한 프로젝트 전체 코드들을 훨씬 가독성 높고 구조적으로 재작성해 주시기를 부탁 드려요.

항상 여러분들의 취업을 진심으로 응원합니다. 그러한 마음을 담아 조금은 쓴소리가 담긴 글을 남겨 봅니다 ㅎㅎ

그럼 남은 기간 모두 화이팅하세요!

-2024.01.30-

 

---

 

읽고 나서 다시 한번 이 프로젝트를 왜 하는지 생각해 보게 되었다 결국은 취업을 위해 포트폴리오 작성을 위해 마지막 최종 프로젝트를 하고 있는 건데 막상 취업에 도움이 안 된다면 의미가 없다

그런 생각이 들어 지금이라도 코드를 전체적으로 리팩토링 하는데 중점을 둬볼까 한다

필요한 코드들만 마저 마무리하고 대대적인 수정에 들어갈 예정이다