목록프로젝트&웨비나 회고/프리온보딩 FE course (5)
\(@^0^@)/
이번 과제는 주어진 마크업과 API를 활용해서 기능들을 추가하는 프로젝트였고, ts를 적용하였다. ✨ 이번 과제를 하며 좋았던 부분, 뿌듯했던 부분들은 과제의 주어진 기능들을 주어진 기간 내에 팀원들과 모두 구현해냈다는 것이 만족스러웠고 클린 코드, 재사용성 여러 군데에서 공통으로 쓰이는 Type과 재사용이 가능한 utils 함수를 따로 빼서, 해당 컴포넌트에는 정말 필요한 코드만 남도록 클린 코드, 재사용을 위해 팀원분들과 회의하고 소통하며 진행하여 만족하는 결과물이 탄생했다. Github PR 활용 어떤 기능을 구현하였는지 상세하게 적어서 PR 하면 해당 코드를 팀원 모두 살펴보고, 코드 리뷰를 함으로써 조금 더 나은 코드를 작성하지 않았나 싶다. 추가 구현 기능 마지막으로 기업에는 구현하라고 되어있..
이번 과제는 next.js와 typescript를 사용해서 해당 사이트의 메인 화면을 클론 코딩하는 것. ✨ 과제를 하면서 아쉬웠던 부분들은 구현한 사이트에서 아쉬웠던 부분은 개발자 도구로 해당 사이트의 스타일을 참고하였는데, 시멘틱 태그들을 쓰지 않고, div로 모두 스타일을 적용했던 것들이 조금 아쉬웠다. 나 또한 늘 div만을 써오다가 최근에는 시멘틱 태그의 중요성을 알게 되어, 시멘틱 태그를 적용하자 마음을 먹고 조금씩 천천히 적용하고, 적응을 하려고 노력하고 있는 상태여서 그런지 이러한 점들이 조금 눈에 보이니까 나도 발전하고 있구나!라는 생각이 들어서 나름 기분이 좋았다 :) styled component, global css활용 부족 스타 일드 컴포넌트, 글로벌 css를 사용하였는데 이번 과..
두 번째 과제는 주어진 사이트의 관리자용 상품 페이지를 제작하는 것. 아무래도 페이지를 제작하는 것이다 보니, 해야 될 마크업이 상당해서 2일로는 벅찬 과제였다ㅠ.ㅠ 회고 순서는 1. 이번 과제를 통해 새로 알게 된 기능들과 코드를 정리하고 2. 개인적으로 리팩터링 하고 싶은 부분들과 리팩터링 후 새로 알게 된 기술들 💎 작업을 위해 고려했던 사항들 1. mui 달력 라이브러리 사용 2. 카테고리 리스팅 ( 체크박스를 선택 시 오른쪽에 선택된 카테고리만 따로 리스팅 됨) 3. 이미지 업로드 (1, 업로드 시 이미지 프리뷰 2. 업로드 시 이미지 타이틀들을 보여 줌) 4. 필터 태그 검색 ( 검색창 포커스 시 모든 필터태그 제공, 검색 시 검색 결과 제공) 1. mui 달력 라이브러리 사용 Material..
1.5일 동안 api로 환율 정보를 받아와서 환율 계산기를 만드는 첫 팀플 과제를 끝마쳤다. 앞으로 한달 간 같이 할 팀원들과 처음 오프라인으로 만나서 2:2 페어 코딩을 하였는데, 같은 꿈을 목표로 하는 분들이라 그런지 처음 만났는데도 전혀 어색하지 않아서 너무 재밌었고 색다른 경험~ 코시국만 아니었으면 더 많은 분들과 오프라인으로 많은 정보를 공유했을텐데.. 아쉬운 마음이 크다. 회고 순서는 1. 새로 알게 된 기술들과 구현한 코드들을 정리하고 2. styled-components를 적용한 이유와 장단점, 3. 과제의 api를 사용하여 netlify에 배포하였을 때 발생한 트러블 슈팅 💎 작업을 위해 고려했던 사항들 1. 받아온 API 키는 암호화를 위해 .env폴더에 따로 보관해서 사용. 2. 셀렉..
같이 공부하는 분께서 위코드와 원티드에서 제공하는 프론트앤드 프리온보딩을 소개해주셔서 어제부터 과제를 만드는 중인데, 쉽다고 생각했는데 생각보다 오래 걸려서 내 한계를 또 체험 중이다. 요새 클론 코딩 프로젝트를 거의 마무리하고 이제 또 어떻게 공부해야 할지 막막하고 감이 안 잡혀서 또다시 내 특기인 뭉그적 대면서 하루하루를 보내는 기분이다... 멈춰!!! 낼부터는 다시 딥 다이브 스터디, 코어 자바스크립트 읽은 후 TIL을 적고 과제를 다 끝낸 후, 강의를 들으며 또 강의 속 과제를 해보자! 강의를 들으면 잠이 쏟아지는 건 어떻게 해결 방법을 찾아야겠다 1. 커피 마시기 2. 핫식스 3. 투명의자 하기 과제 중 하나가 위의 이미지를 마크업 작업 (css, html)만 하는 건데, 개발자 도구를 활용하여..