본문 바로가기

분류 전체보기168

210322_TIL (First Project - Day8) 🍎오늘 한 일 서버 - 클라이언트 연동 테스트 서버와 클라이언트의 요청, 응답 부분이 거의 다 작성된 것 같아서 두번째 테스트를 진행했다. 첫번째 테스트보다 구현해둔 기능이 훨씬 많아서 오래 걸리기도 했고, 엮여있는 부분이 많아서 한 곳에서 생긴 에러가 또다른 에러를 낳고.. 자잘한 오류를 해결하는데 시간을 굉장히 많이 썼다. 정규시간(9to6) 동안은 거의 테스트만 진행한 것 같다. 그래도 제대로 연결되는걸 보니 좀 마음이 놓인다. 여전히 날 힘들게하는 훅스.. 그리고 내가 실제 사용자라고 생각하고 테스트를 하다보니 사용하기에 불편하거나 추가되어야 할 기능이 계속 발견되기도 했다. 2주가 생각보다 너무 짧다.. 벌써 이틀밖에 안남았다니ㅣㅣㅣ 🍎 교훈 ✔️ 코드리뷰의 필요성 ✔️ 우선순위를 잘 정하자 🍎.. 2021. 3. 27.
210321_TIL (First Project - Day7) 🍎 오늘 한 일 함수 작성 마무리 Modal Page의 API 요청 관련 함수 작성을 마무리지었다. Dropdown UI 가 필요한 부분도 있어서 이부분도 완성했다. 이 과정에서 datalist와 select 태그의 차이점에 대해서 알게되었고, 서버에 계속해서 요청을 보낼 생각이었는데 그럴 필요가 없다는 것도 깨달아서 코드를 수정했다. Custom Hook 만들어보기 이벤트 처리를 위해 useRef와 useEffect를 이용한 Custom Hook 을 하나 만들었다. 좀 더 다양한 곳에서 쓰기 위해서 매개변수를 받을 수 있게 했다. 차트에 Gradient 효과 추가 브라우저에 내장된 canvas API 를 이용해서 라이브러리로 만든 차트에 gradient 효과를 추가할 수 있다고 해서 도전해봤다. 리액트.. 2021. 3. 22.
210320_TIL (First Project - Day6) 🍎 오늘 한 일 Modal창 UI 관련 함수 작성 오전동안 모달창 UI와 관련된 함수 작성을 마무리지었다. 코드가 점점 복잡해지고 있어서 최대한 재활용 가능한 함수로 작성해보려고 노력했는데 리팩토링이 좀 더 필요할 것 같다. 그리고 뜬금없는 부분에서 에러가 나서 보니까 변수명이 중복되어서 발생한 에러였다. 여기저기서 한 기능에 대한 여러 변수가 생기다보니까 이런일이 생긴 것 같아서 변수명을 앞으론 좀 더 신중하게 지어야 할 필요성도 느꼈다. 🍎 해야할 일 ✔️ 모달창 API 요청 관련 함수 작성 ✔️ 새로고침문제 해결 ✏️ 오후에는 가족들이랑 맛있는거 먹고 잠 보충을 했다. 번아웃이 오기 전에 이렇게 가끔씩은 아무생각 안하는 시간이 필요한 것 같다. 그리고 체력이 점점 떨어지는게 느껴져서 진짜로 운동을 .. 2021. 3. 21.
210319_TIL (First Project - Day5) 🍎 오늘 한 일 User 관련 API 요청, 함수 작성 완료 유저와 관련된 API 요청 (login, logout, signup, withdrawal, edit..) 과 관련된 함수들을 작성했다. 확실히 함수를 만들고 뭔가 돌아가게 만드는게 재밌다,, 이제 진짜 뭘 하는 느낌이 든다. 로컬서버에서 클라이언트 - 서버 연결 테스트 진행 어느정도 유저와 관련된 부분은 완성이 된 것 같아서 로컬 환경에 따로 서버를 만들어서 처음으로 클라이언트와 서버를 합쳐봤다. 지금까지는 각각 작성해서 혹시 합쳤을 때 어긋나는 부분이 있을까봐 걱정했는데, 확실히 API문서를 꼼꼼하게 작성해 둔 덕분인지 잘 작동했다. 클라이언트 요청에 따라 DB까지도 잘 작동하고 User 관련 CRUD 요청은 모두 성공했다. 백엔드분이 서버부.. 2021. 3. 20.
210318_TIL (First Project - Day4) 🍎 오늘 한 일 SCSS 레이아웃 클라이언트 요청이나 함수들을 작성할 때 제대로 작동하는지 테스트해보려면 일단은 시각적으로 확인하는게 좋을 것 같아서, 와이어 프레임을 기반으로 뼈대가 되는 레이아웃만 먼저 구현해두었다. SCSS를 이용했는데 확실히 구조가 계층적이라 길을 잃어도 금방 찾을 수도 있고, 코드랑도 비교하기가 수월했다. 프론트엔드 팀원들 모두 SCSS 의 장점에 동의해주셔서 다행이다. 우선 큰 틀은 대략 완성이 되어서 세세한 디자인같은건 기능 구현이 어느정도 되면 보충을 해야겠다. ESLint, Prettier 설정 코딩 컨벤션을 정했다고 생각했는데 아침에 merge를 하는 과정에서 포매팅때문에 충돌이 생겼다. 그래서 모든 팀원들이 formatting 형식을 동일하게 하는 시간을 가졌다. 세팅.. 2021. 3. 19.
210317_TIL (First Project - Day3) 🍎 오늘 한 일 Wireframe 구체화 설계해둔 와이어 프레임을 바로 코드를 작성할 수 있을 정도로 구체화했다. class name, id 도 포함해서 설계했는데 BEM 방식으로 이름을 정해보기로 했다. 이 과정이 엄청 오래 걸렸는데 맞는 방식으로 한건지 확신이 들지가 않아 리팩토링이 필요할 것 같다. Component 구조 설계, 파일 생성 완성된 Wireframe을 바탕으로 컴포넌트 구조를 설계했다. 어느 부분을 컴포넌트로 만들건지, Page 파일들은 어떤식으로 작성할건지 의논하고 컴포넌트를 몇개씩 맡아서 와이어 프레임을 코드로 옮기는 작업을 했다. Github Issue Card, PR 태스크를 분배하기 위해서 우리 프로젝트의 github 레파지토리 이슈카드를 이용하기로 했다. 작성 규칙을 정해서.. 2021. 3. 18.
210316_TIL (First Project - Day2) 🍎 오늘 한 일 API 문서 작성 어제 작성했던 플로우 차트에 어떤 요청이 필요한지 먼저 생각해보며 추가를 해보고, API 문서를 작성하기 시작했다. 확실히 플로우 차트가 좀 더 구체화되니까 작성하기가 편했던 것 같다. 물론 수정 과정을 계속 거쳤고 앞으로도 거쳐야 하겠지만, 초반에 꼼꼼하게 문서나 차트들을 작성해두는게 나중에 작업할 때 훨씬 순조롭게 진행될 것 같기도 하고, 태스크를 분배해서 각자 작업을 하고 합치는 과정에서 충돌이 덜 생길 것 같다는 생각이 든다. 팀 규칙, 코딩 컨벤션 팀원들 간의 생활습관부터 평소 코드를 작성할 때 방식도 달라서 팀 규칙도 정하는 시간을 가졌다. 생활적인 면에서는 고정적인 회의 시간이나 혹시 갈등이 생긴다면 어떤식으로 대처할지, 서로 이런건 안했으면 좋겠다.. 등 .. 2021. 3. 17.
210315_TIL (First Project - Day1) 🍎 오늘 한 일 Firtst Project - 시작, 아이디어 선정 팀원분들과 만나서 각자 생각해본 프로젝트 아이디어들을 공유하고, 의견을 덧붙여가다보니 모두가 동의하는 방향으로 프로젝트 주제가 결정되었다. 일단은 모두 처음 시작해보는, 기간이 2주밖에 주어지지 않는 프로젝트라, 새로운 스택보다는 지금까지 배웠던 것들을 활용하고 파이널 프로젝트를 위해 단단히 다져두는걸 목표로 진행하기로 했다. 팀 이름이랑 프로젝트 이름도 이것저것 제안하다보니 좋은 이름이 나왔다. 모두의 맘에 딱 들기도 했고, 오래 걸릴 줄 알았는데 생각보다 금방 진행되어서 가장 뿌듯했다 :D 팀원들 각자가 하고싶은 역할이 뚜렷하기도 하고 그렇게 포지션이 겹치지도 않아서 역할은 자연스럽게 결정되었다. 나는 백엔드쪽을 우선적으로하다가 프론.. 2021. 3. 16.
210313_TIL 🍎 오늘 한 일 알고리즘 공부 밀린 토이 문제도 몇개 풀고, 특히 비슷한듯 조금씩 다른 정렬 알고리즘에 대한 공부를 했다. merge sort, quick sort, radix sort....등이 있었는데, merge sort는 표준 라이브러리에서 정렬을 구현할 때 퀵 정렬이나 힙 정렬의 대안으로도 사용될 정도로 최적화된 알고리즘이라고 한다. 사실 개념과 장단점을 각각은 이해하겠는데 언제 뭐가 더 효율적일지에 대해서는 아직 정확히 구분하지는 못하겠다., 독서 정신없어서 한동안 책을 제대로 못읽었던 것 같은데, 오랜만에 느긋하게 책을 읽었다. 프로젝트가 서쪽으로 간 까닭은 이라는 제목의 책인데, 협업하는 방식을 짧막하게 여러 주제로 다룬 책이라 내가 협업하는 데 있어 어떤 점이 부족하고, 좀 더 신경써야하.. 2021. 3. 14.
210312_TIL 🍎 오늘 한 일 React, CSS 연습 하나의 CSS 파일에서 모든 스타일링을 하는게 아니라, React의 컴포넌트를 위주로 스타일링을 해보려고 연습했다. SCSS로 기본적인 처리를 하고, 몇몇 컴포넌트들은 styled-components 라이브러리를 사용해 스타일을 적용했다. 기본적인 사용방법은 익힌 것 같은데 언제 따로 파일에 작성해야하고, 언제 styled-components 로 정의해야 하는지 그 경계에 대해서는 좀 더 공부할 것 같다. 추가적으로 일정 크기 이하로 줄어들면 media-query를 이용해 레이아웃이 바뀌도록 반응형 웹을 구축하는 연습도 했고, 스크롤 위치에 따라 다른 효과를 나타내는 인터랙티브한 페이지를 만들어보기도 했다. 오랜만에 CSS에 집중해보니까 이벤트나 position,.. 2021. 3. 13.
210311_TIL (HTTPS 배포..) 🍎 오늘 한 일 AWS 정말 어제부터 이틀 내내 AWS 페이지에만 머물러있던 것 같다..ㅎㅎ Let's Encrypt로 서버에, ACM으로 클라이언트에 권한을 부여해줬다. 가장 큰 문제는 클라이언트와 서버를 모두 HTTPS로 통신하도록 해야했는데, 서버부분의 인증 처리가 제대로 안돼서 https 요청을 처리하지 못하는 것이었다. 처음에는 문제가 생겨도 클라이언트 문제인지, 서버 문제인지, 어디서부터 뜯어 고쳐야하는지 감이 잘 안잡혀서 인증서를 삭제했다 다시 발급받았다 하기도하고, 버킷을 삭제도 해보고 지역문제인가 싶어서 설정도 바꿔보고.. 정말 이런 저런 시도들을 해봤는데 하루종일 보면서 이렇게 삽질을 하다보니 알게모르게 낯설었던 개념들이 익숙해지게 되기도하고 전반적인 흐름?을 알게된 것 같다..! 결국.. 2021. 3. 12.
210310_TIL (내 도메인이 생긴날) 🍎 오늘 한 일 AWS 굉장히 새로운 개념들이 넘쳐들어온 날이다. 배포라고해서 그냥 어디 파일을 올리면 되는게 아닌가 싶었는데 EC2, RDS, S3, Route53 등,, 서비스가 엄청 다양해서 알아둬야할 것도 정말 많았다. 아예 새로운 개념들이라 정리하는데도 시간을 많이 써야했다. 먼저 EC2에다가 서버를 올리고, RDS를 이용해서 DB도 올렸다. S3으로는 클라이언트 부분을 생성했다. joootopia.com이라는 도메인도 신청해서 승인받았는데, Route53을 통해서 내가 만든 도메인과 연결시킬 수도 있었다. Let's Encrypt 를 통해 무료로 인증서도 발급받고, CloudFront를 통해서 배포를 해서 HTTPS 환경에서도 잘 작동할 수 있게 만들었다. 나만의 주소를 갖게된 것도 뭔가 신나.. 2021. 3. 11.
반응형

티스토리툴바