본문 바로가기

프로젝트16

import 할때 중괄호 { }의 의미는 무엇일까? Header와 Footer의 개발이 끝났기에, 오늘은 메인페이지에 들어갈 컴포넌트들을 만드는 작업을 하였다. 무탈하게 개발을 하고 있었는데...... 오늘도 역시나 오류를 만나버렸다 :) import { TagWrapperStyled, NoLineTag } from './NoLineTag'; 이 녀석이 오늘의 만난 문제의 원인!! import NoLineTag from './NoLineTag'; import { TagWrapperStyled } from './NoLineTag'; 이게 원래 import 구문이었는데, 똑같은 곳에서 import 해오는 건데 두 줄로 적혀 있는게 마음에 안들어서 NoLineTag도 중괄호 안에 넣어버린게 화근이었다. 알고보니 단순히 묶어주기만 하는 줄 알았던 저 중괄호에도 .. 2023. 7. 7.
Github에서 Merge 취소하기 pull request를 올린 후 팀원들이 코드리뷰를 해주었다. 몇몇 수정해야할 사항을 알려주셨고, 간단한 수정을 마친다음 내가 직접 Merge를 하기로 하였다. 사실, pull request를 한 번 올려놓으면 수정사항을 수정 한 후 commit을 올리면 자동으로 이 pull request에 적용이 된다. 하지만 그때의 나는 이걸 미처 몰랐다. 그래서 pull request틀 취소한 후, 코드를 수정한 뒤, 다시 pull request를 올려서 Merge를 하였다. 바로 이 때 오늘의 비극이 시작되었다. FE에 Merge를 했어야했는데, 실수로 Main에 Merge를 해버린 것. 취직한 후 이런 실수를 했다면(애초에 내가 직접 Merge를 할 일도 없겠지만) 나는 짤렸을 지도 모른다. 지금이라도 이런 .. 2023. 7. 6.
Footer 개발 중 발생한 오류 어제 역할배분을 나눴는데, 내가 우선 Header와 Footer를 담당하기로 하였다. 그리 어려운 작업이 아니라 생각했기에 금방 끝낼 줄 알았는데, 하루를 다 써도 Footer를 완성시키지 못했다. 왜냐하면..... 문제는 바로 저 왼쪽에 생긴 여백. 개발자 도구를 활용해서 살펴보니 이렇게 나왔다. 코드를 아무리 살펴봐도 저런 값을 준 적이 없어서 도무지 이해가 가지 않았다. 모든 padding이나 margin 값을 좌우대칭으로 줬었기에 저런 비대칭이 나온다는게 이해가 되지 않았다. 몇 시간 동안이나 Footer 컴포넌트 안의 스타일드컴포넌트 요소들을 이것저것 수정해봐도 결국 해결하지 못했다. #root { /* max-width: 1060px; margin: 0 auto; */ padding: 2rem.. 2023. 7. 5.
메인프로젝트 시작! 5일 전에 있었던 메인프로젝트 팀빌딩. 팀장님의 아이디어가 마음에 들어서 참가 신청을 하였고, 팀이 완성되었다! 프리프로젝트 때의 경험을 떠올리며, 본격적인 개발에 들어가기 전에 회의를 많이 하기로 하였다. 그래서 약 5일 동안 팀회의를 거쳐 아이디어를 다듬었고, 사용자요구사항 정의서를 작성하고, 화면 정의서를 만들고, 피그마도 완성하고, 칸반보드를 만들어서 역할분담까지 끝마쳤다. 개발 환경 초기세팅도 완료하였기에 이제부터 개발 시작! 디자이너 출신이신 팀장님이 피그마를 정말 완벽하게 만들어주셔서, 이제부터 피그마를 보고 그대로 따라서 UI를 만들면 아주 편할 것 같다. 경험이 많지 않다보니 항상 새로운 프로젝트를 시작할 때면 헷갈리는 부분이 많은 것 같다. 깃허브 사용법이라던가, eslint & pre.. 2023. 7. 4.