도리쓰에러쓰

📍 개인 과제 1️⃣ 'void 형식에 then이 없다'는 에러 ts를 처음 사용하다보니 void 형식에 then이 없다는 말에 type을 잘못 작성했다고 생각하고, type 선언한 코드만 계속 봤다. 알고보니 return 작성 안해준 .. 이 에러 때문에 API 못불러와서 하루를 날려먹었다. 그래도 해결한게 어디야.. 🔽 내가 잘못 쓴 코드 export const getMoviesApi = (params: Params) => { axios.get(`${MOVIE_BASE_URL}/?`, { params }) } 🔽 수정한 코드 export const getMoviesApi = (params: Params) => { return axios.get(`${MOVIE_BASE_URL}/?`, { params ..

📍 팀 과제 1️⃣ Git develop 브랜치로 push 하기 Git을 협업해서 사용해보는 것이 처음이라 develop 브랜치로 push하는데 애먹었다. 뭔가 공부하면서 해보고 싶었는데 그러기엔 시간이 촉박해서 팀원분께 도움 요청해서 함께 push를 진행했다. 코스하는 도중에 'git 협업 가이드' 게시물을 정리하고 싶지만 시간이 없는 관계로 여기에 간단히 정리하고 추후에 더 공부를 해야겠다. 현재 내가 작업한 브랜치로 checkout하여 add, commit, push git pull upstream develop conflict 파일이 있다면 충돌이 난 경우 충돌난 것 비교하면서 해결 초록색을 적용하고 싶다면 accept current change, 파란색을 적용하고 싶다면 accept incomi..

📍 팀 과제 1️⃣ PropTypes로 하는 타입 검사 평소와 같이 props 넘겨서 사용했는데 props를 사용하는 것이 자꾸 에러가 났다. 자주 사용했던 props인 만큼 왜 에러나는지 알 수 없어서 좀 헤맸다. 알고 보니, props로 넘긴 후 PropTypes로 타입 검사를 해줘야 했다. 🔽 사용 방법 컴포넌트명.propTypes = { props명: PropTypes.각props의타입 } import PropTypes from 'prop-types' 컴포넌트명.propTypes = { modify: PropTypes.bool, nickName: PropTypes.string.isRequired, todo: PropTypes.shape({ todo: PropTypes.string.isRequire..

📍 팀 과제 1️⃣ stylelint 설정 멘토님 git의 foundation 폴더에 설정되어 있는 stylelint가 적용되지 않았다. 그래서 멘토님이 알려주신 방법대로 설정을 수정하였더니 적용되었다. 2️⃣ todo 생성 화면 설정 - routes 폴더명 : UpdateTodo - 선미님이 today Component 만드시면 import 하여 todo 생성 화면에 합치기 - Calendar Component 크기 : width: 280px, height: 280px - Category Component는 Calendar Component 크기 고려해서 width: 280px으로 하고 height는 개발한 후에 봐야할 것 같다. (카테고리 색상 팔레트 크기가 꽤나 클 것 같다..) 3️⃣ react ..

📍 개인 과제 🔍 해야 할 일 : 사전 과제 전체적인 수정 1️⃣ classNames.bind()를 이용해 조건부 스타일 주기 지금까진 조건에 따른 className을 어떻게 추가하고 삭제하는지를 몰라 아래 방식으로 하였다. 근데 위 방식은 가독성이 떨어져 별로 좋은 방식이 아니였다. 그래서 classNames.bind()를 변수 cx에 선언하고, const cx = classNames.bind(styles) 아래와 같이 className에 조건부 스타일을 주었더니 훨씬 보기 깔끔한 코드가 되었다. {클래스명 : state명} : state가 true이면 클래스가 적용되고, false이면 클래스가 적용되지 않는다. 📍 팀 회의 1️⃣ Git-flow로 브랜치 정하기 우리팀은 main, develop, f..

📍 기업 과제를 하기 전 처음으로 해보는 팀 프로젝트 ! todolist를 개발하는데 아무래도 10명의 인원이 작은 프로젝트를 어떻게 나누는 것이 좋을까 고민했다. 1️⃣ Component 별로 구현한다. 2️⃣ 5명씩 나눠서 진행한다. 그래도 첫 팀 프로젝트니까 5명씩 나눠서 하는 것보단 Component 별로 구현하자는 1️⃣번으로 결정이 났다. Component 별로 역할을 나누는게 쉽진 않았지만 이번엔 어떤 기능을 거창하게 만드는 것보단 클린코드를 작성하고, 팀원들과의 협업하는 방식을 공부하는 것에 의미를 두기로 했다. 오늘 팀원들끼리 해본 첫 회의였는데, 다들 적극적으로 임해주셔서 너무 좋았다 😊 이후에 프로젝트도 지금처럼 더 나은 결과물을 위해 아낌없이 의견을 던져주셨으면 했다 ! 📌 todo..

🔍 검색 잘하기 한글로 검색하면 오래된 코드들이 많이 나올 수 있다. 때문에 구글에서 영어로만 검색하면 괜찮은 코드들이 많이 나온다. EX) email regex w3c 🔑 의 key값 에 key값을 index값으로 주는 실수를 많이 했는데 key값에 unique한 값이 들어가지 않으면 부정적인 영향을 미칠 수 있다. 그래서 아래 예시와 같이 string으로 key값을 생성해서 사용하는 방법이 좋다. {list.map((_, idx) => { const key = `list-key-${idx}`; return 예시입니당; })} 🎲 이메일 정규표현식 변경 이전 내 코드에선 이메일 정규표현식을 아래와 같이 작성했다. const regExp = /^[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*@..

원래 백엔드 쪽으로 일본 취업을 하기로 하였으나, 예상치 못한 코로나19가 시작되는 바람에 한국에서 계속 대기를 했어야 했다. 그렇게 2년을 기다리다가 당시에 일본 회사 측에서 한국 회사에 6개월 다녀보는 것이 어떻겠냐고 제안을 해주셨다. 그렇게 한국 회사에서 프론트엔드 개발자로 입사하였고 일을 하다 보니 프론트엔드 분야가 흥미롭게 느껴졌다. 일본으로 출국하는 것은 여러 가지 이유로 못가게 되었고, 한국에서 프론트엔드로 전향하여 다시 취업 준비를 하기로 하였다. 국비 학원, 인터넷 강의 등 어디서 공부하는게 좋을까 생각을 하다가 국비 학원은 기초부터 배우기도 하고 요즘 개발 트렌드에 맞춰서 공부하고 싶어 인터넷 강의로 공부를 시작하게 됐다. 그렇게 JavaScript와 React를 공부하다가 이제 이론적..