TIL 196

[TIL] 20210730 양방향 데이터 전달을 리덕스로 관리하자!

문제 발생 책 검색을 구현 리뷰할 책을 선택하면 -> 책 검색 모달이 뜨고 -> 책 검색 모달에서는 책들이 뜨고 -> 선택하면 화면에 뜬다. 이것을 구현하는데 모달을 열고 닫고하는 state를 부모에서 자식으로 그 자식으로 계속 넘기고 있었다. 이것은 리액트에서 지양하는 데이터 흐름이다. 부모에서 자식으로 흐르는 단방향 데이터 흐름을 사용한다. -> 단방향 데이터 바인딩에 관한 포스팅 해결방안 - 리덕스로 전역으로 상태관리! 리덕스로 모달을 열고 닫는 액션을 만들어서 모달 열고 닫는 state를 부모에서 자식으로 넘겨주지 않더라도 리덕스로 관리하였음!

TIL 2021.07.30

[TIL] 20210729 타입스크립트 공부

■ 타입스크립트 공부 2021.07.29 - [WEB/TypeScript] - [TypeScript] 타입스크립트란 ? vscode에서 개발 환경 설정하기 [TypeScript] 타입스크립트란 ? vscode에서 개발 환경 설정하기 타입스크립트(TypeScript)란? 자바스크립트의 supterset인 오픈소스 프로그래밍 언어. 마이크로 소프트에서 개발, 유지 하고 있음 엄격한 문법을 지원. 자바스크립트 엔진을 사용하여 커다란 애플리 sso-feeling.tistory.com 2021.07.29 - [WEB/TypeScript] - [TypeScript] 타입스크립트의 타입 추론. type inference [TypeScript] 타입스크립트의 타입 추론. type inference 앞의 게시물 보고 오..

TIL 2021.07.29

[TIL] 20210728 리덕스 모듈 제작

백엔드에서 준 스웨거를 보고 리덕스 모듈을 제작했다. https://app.swaggerhub.com/apis-docs/seungbin0508/bns/1.0.0 Build, Collaborate & Integrate APIs | SwaggerHub app.swaggerhub.com 오늘도 우리팀은 빠르게 모듈을 제작하고 코드리뷰도 하면서 재밌는 하루를 보냈다. 이번 코드 리뷰는 인덴테이션을 맞췄는데 깔끔한 정렬에서 오는 마음의 안정.. 좋았다. 아직 서버 배포는 안됐다고 해서 리덕스 모듈만 일단 만들어놨다. 나는 리덕스 모듈을 가지고 서버에서 값을 받아오고 화면에 띄워주는거 댓글을 쓰면 댓글이 반영되고, 게시글이 쓰면 반영되고 이런 화면의 변화가 무척 재밌다! 빨리 서버와 연결해서 데이터 받아오고 보내고..

TIL 2021.07.28

[TIL] 20210727 뷰 제작

제플린으로 디자이너분이 준 와이어프레임을 가지고 뷰를 제작했다. https://app.zeplin.io/project/60fc2fc5b30efb14a323bfd2 Zeplin A structured workspace to publish designs, where the entire team can collaborate to ship beautiful products together zeplin.io 디자인을 하는 것 자체가 되게 어려웠는데 이렇게 디자이너분이 같이 있어서 기본적으로 와이어프레임도 다 짜주니까 CSS하는 시간이 정말 엄청 줄어서 좋았고, 겉으로 보기에 엄청 간단한 뷰인데 촌스럽지 않고 세련됐다는 점이 신기했다. 역시 디자이너는 다르다. 이게 디자인 요소를 넣지 않고 그냥 와이어프레임으로 준..

TIL 2021.07.27

[TIL] 20210726 기획회의

기획회의의 연속 https://ohbin-kwon.notion.site/ohbin-kwon/4-8373ab68bac94675a3709393d90db7ce 실전 프로젝트4조 - 책 리뷰 및 추천 서비스 🍒 서비스 소개 ohbin-kwon.notion.site 오늘은 계속 회의를 진행했다. 더 차별성있고 챌린지한 기능을 넣을 수 있는 포트폴리오를 만들기위해 다들 의견을 열심히 내고 조율하는 과정을 거쳤다. 회의라는 것은 정말 에너지가 많이 뺏기는 것 같다. 어떻게 하면 회의가 더 효율적이고 빠르게 진행될 수 있을지에 대한 고찰을 앞으로 많이 해보아야겠다.

TIL 2021.07.26

[TIL] 20210724 실전프로젝트 기획 회의

어제와 오늘 연속으로 실전프로젝트 기획회의를 했다. 기획회의라는 것은 정말 어려운 것 같다. 재밌으면서도 어렵다. 이번에는 백엔드 3명, 프론트 3명, 디자이너 3명, 9명이 함께 이야기를 하다보니까 너무 난이도가 높아졌다. 각자의 의견이 다르고 각자가 생각하는 바가 다르기 때문에 조율도 정말 어려웠다. 그렇지만 우리팀은 젠틀하게 말을 예쁘게 하면서 존중하는 모습이 정말 좋았다. 앞으로도 좋은 기억을 만들어가고 싶다. https://ohbin-kwon.notion.site/ohbin-kwon/4-8373ab68bac94675a3709393d90db7ce

TIL 2021.07.26

[TIL] 20210721 React 벨로퍼트 강의

2021.07.21 - [WEB/REACT] - [React] Axios란? 서버통신하기/ headers, body 넣기 [React] Axios란? 서버통신하기/ headers, body 넣기 1. Axios란? - 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리이다. 2. 설치 yarn add axios import axios from "axios"; 3. 사용방법 1. 리액트 프로젝트에 shared 폴더에 Reques.. sso-feeling.tistory.com 2021.07.21 - [WEB/REACT] - [React] 배열 렌더링하기, map 사용 , key값이 꼭 있어야하는 이유 [React] 배열 렌더링하기, map 사용 , key값이 꼭 ..

TIL 2021.07.21

[TIL] 20210720 마켓컬리 클론코딩 5일차 , 검색기능, 주소 api

오늘 한일 1. 메인 페이지 물품 불러오기 2. 상세페이지 데이터불러오기 3. 검색기능 2021.07.20 - [WEB/REACT] - [REACT] 마켓컬리 클론코딩 - 검색 기능 구현하기 4. 주소 api사용 2021.07.21 - [WEB/REACT] - [React] react-daum-postcode로 주소 api사용하기 5. 주문서 페이지 만들기 실제로 프로젝트를 하다보니까 리액트가 익숙해지고 예전에는 한참 걸렸을 기능도 훨씬 빠르게 만들어내는 모습이 신기하다. 그런데 한가지 내가 걸리는 점은 , 지금 이 프로젝트에서는 뷰를 컴포넌트 스타일로 하고있는데 이 부분이 좀 걸린다. 이유는 1. 공통 컴포넌트를 만들었지만 특정 파일에서만 필요한 컴포넌트 같은 경우에는 그냥 그 파일안에서 만들어서 쓰고..

TIL 2021.07.20