time to wander

Today I Learned comment API 모듈 작성 오늘은 커뮤니티 페이지의 게시글에 들어갈 댓글 목록 조회, 추가, 수정, 삭제 모듈을 작성하였고, 이전 미니 프로젝트에서 댓글 모듈을 연결해 본 경험이 있어 어렵지 않게 써내려갈 수 있었다. 모듈을 작성하는 과정에서 전날 백엔드 분들과 정했던 댓글 API 명세서에서 response로 받을 데이터 형태에 수정이 필요할 것 같아 스프링 짱짱 팀장님께 말씀 드렸고, 빠르게 수정해주셨다! CRUD를 할 때마다 느끼는 점은 비슷한데, 어떤 데이터를 보내서, 어떤 데이터를 받아올 지는 물론이거니와, 리스트나 딕셔너리 등 보내거나 받을 데이터의 형태에 대해서도 신경써야 한다는 것이다. 데이터의 형태에 따라 활용할 때 코드가 더 복잡해지거나 간결해지기도 하고..

Today I Learned quiz 로직 작성 원래 스와이퍼 라이브러리를 사용해서 각 문제가 슬라이드로 넘어가도록 구현하려고 했다. 1) 기본으로 있는 화살표 아이콘의 prev 버튼과 next 버튼을 없애고 별도의 버튼을 만들어 동작하게 하고, 2) quizIndex라는 state를 만들어서 퀴즈 문제가 마지막일 때는 삼항연산자로 조건부 렌더링을 걸어 next 버튼의 텍스트가 다음 문제가 아닌 결과 보기로 렌더링 되도록 하려고 했으나, onClick의 문제인지 코드를 모두 작성하고 나니 nextEl 버튼이 제대로 동작하지 않았다. 두 가지 문제가 있었는데, 첫 번째는, nextEl 버튼을 클릭하면 다음 문제로 넘어가는 게 아니라 prevEl 버튼을 클릭한 것처럼 이전 문제로 돌아갈 때가 있었고, 두 번..

Today I Learned Final Project day 2 스와이퍼 라이브러리 사용 오늘은 본격적으로 페이지 뷰 작업을 시작했다. 기본적인 모바일 뷰에 필요한 레이아웃을 잡기 위해 다른 분이 프레임 컴포넌트를 만드시고 나는 헤더와 푸터를 만든 후 합쳐서 모든 페이지에서 공통으로 사용할 대략적인 레이아웃을 만들었다. 나는 신조어 퀴즈 페이지를 담당하게 되었는데, 시작부터 막막해서 어떻게 할 까 하다가 글램에서 만든 능력고사? 같은 페이지가 생각나서 그 페이지를 참고하면서 퀴즈 페이지를 만들어 나가기 시작했다. 대략적인 페이지 뷰는 만들었는데 재사용할 퀴즈 페이퍼를 어떻게 고정되어 있는 모바일프레임 안에 슬라이드 형식으로 넣을 수 있을지가 문제였다. 고민하던 중 저번 주에 인스타그램을 클론 코딩한 조 ..

🔎 일주일 동안 한 일 12/13 월 - 클론 코딩할 사이트 선정 - API 설계 - FE 폴더 구조 및 재사용 elements 초기 설정 - 메인 페이지, 게시글 상세 페이지 뷰 작업 시작 - 회원가입 페이지, 로그인 페이지 뷰 작업 완료 12/14 화 - 메인 페이지, 업로드 페이지, 수정 페이지, 게시글 상세 페이지 뷰 작업 완료 - 마이 페이지 뷰 작업 시작 12/15 수 - api 통신을 위한 인덱스 파일 작성 - 기능별 모듈 작성 시작 - 로그인, 회원가입 기능 구현 완료 - 마이 페이지 뷰 작업 완료 12/16 목 - 메인 페이지 게시글 목록 조회 및 카테고리별 클릭, 검색 구현 완료 - 마이 페이지 - 로그인 한 유저가 작성한 게시글 목록 조회 구현 완료 12/17 금 - 메인 페이지 게시..

styled-components 패키지의 createGlobalStyle 사용하기 React를 사용하다 보면 보통 스타일 속성을 컴포넌트 안에서 설정하기 때문에 기본적으로 세팅하는 속성들은 각 컴포넌트마다 중복으로 작성해야 하는 경우가 많다. 이럴 경우 한 컴포넌트 안에서의 코드 양이 길어지고 많아지며 전체적인 가독성이 떨어진다는 단점이 있다. 프로젝트에 공통으로 사용하는 폰트 스타일이나, box-sizing, button이나 input의 outline과 border 속성, cursor 등 기본적으로 컴포넌트마다 설정해주는 속성들은 GlobalStyle로 적용하면 컴포넌트별 중복 작성을 막아줄 수 있다. 초기 세팅 사용하고 있는 패키지 매니저에 따라 아래와 같이 styled-reset과 styled-co..

Today I Learned 오늘은 추가적으로 하려고 했던 마이페이지를 만들었다. 뷰는 어제 밤부터 만들기 시작해서 오늘 마무리를 했고, 백에서는 이미 로그인한 유저가 등록한 게시글만 불러올 수 있도록 api 설계를 해주셔서 바로 서버와 연결해서 미들웨어가 잘 작동하는지 확인할 수 있었다. 다만 모달로 만든 디테일 페이지가 전체 화면에서 나오지 않고 카드가 붙는 영역 안에서 보여져서 그대로 둘지 아니면 별도의 페이지로 라우팅을 해줄지 고민 중이다. 아직 오버레이가 익숙하지 않아서 컴포넌트 안에 그대로 쓰면서 전체 화면으로 나오게 하는 만드는 건 기한 내에 완성하지 못할 것 같다. 유저가 등록한 게시글은 리덕스에서 배열 데이터로 받아와서 map() 메소드를 사용하여 한 개의 게시글씩 붙여주는데, 새로고침해..