[WIL] 지옥을 경험한 깃충돌, 지옥에서 천당까지/ 그리고 리액트 쿼리와 리코일

김하나·2022년 10월 30일
0

WIL

목록 보기
6/17

깃허브 공부는 필수다

깃협업에서 어려운 점은, 그동안 썼던 코드가 날아가버릴수도 있다는것, 아니 날아간다는 것에서 부담감이 밀려온다.
내가 영어를 못해서 어려운걸까, 날려먹는게 두려워서 어려운걸까...

난 왜 자꾸 오류가 나나... 이런것들.

그런데, 필연적으로 날려먹을수 밖에 없었다는 사실을 깨닫게 되었다.

첫째로 깃 커밋을 하기전에 반드시 main에 있는 것을 pull 해온다.

이 과정을 이해하지 못했기 때문에 날려먹었던것 같다.
터미널에서도 계속 pull 에 대한 경고가 있었는데, 대체 저걸 왜 pull을 해와야 하는지 몰랐었다.

pull을 해와도 내 코드가 삭제되는 것은 아니다.

최초로 main에 push 된 내용은 전체의 기반이 되는 틀이다.

각각 issue를 만들어서 branch를 관리해도 되고, 각자의 branch를 만들어서 관리해도 되는데,

충돌이 일어나지 않으려면 최초의 커밋 이후에는 반드시 main의 내용을 pull 해와서 공통분모를 만들어야한다.

main이나 master에는 커밋을 하면 안된다.

여러 브랜치를 merge한 내용만 커밋이 된다.

이걸 몰랐던 나는 과제제출 바로 직전에 코드를 날려먹었고,
팀원들에게 미안해졌다.

손이 빠르고 코드에 대한 이해도가 높은 조장님을 만났기에 망정이지...
어떻게든 수습을 해서 발표를 했고, 제출도 했다.

휴...

지옥불에 떨어진 경험...

그 이후로 커밋을 할때마다 상당히 부담이 되는데,
이번주에 만난 조장님도 능력자.

최대한 충돌이 나지 않게 서로 화면을 보면서 커밋을 하고 있다.

이 과정이 조금 익숙해져야 사고를 미연에 방지할듯.

코드를 어떻게 짜는지도 정말 중요하지만, 더 중요한건 프로젝트에 피해를 끼치지 않는 것이다.

연습이 가장 필요한 것은 깃허브 였다....

리액트 쿼리와 리코일

그동안 자바스크립트 (알고리즘 공부) - 리액트- 리덕스 - 리덕스 툴킷 - thunk 등의 과정을 따라 내용을 조금씩 익혀오면서,

비버처럼 집을 쌓는 기분으로 공부한거 같다.

머리속에 꾸역꾸역 집어넣어놓으면 그 다음주에는 "헿 그건 안써" 라는 비버 사육사의 집 허물기가 시작 되고,

잠시 정말 비버가 된냥 넋을 놓았다가 다시 새로운 내용을 머릿속에 넣고.

깃허브에 커밋하는것도 쉽지 않지만,
내 머릿속에 내용을 커밋하는것도 쉽지 않다.

pull 해올 내용을 떠올려보면, 초기에 배웠던 건 이제 희미한 느낌...
정말 리액트 뭐시기들만 남은 느낌이다.

툴킷만 해도 많이 요약되었다고 생각했는데,
쿼리는 더 많이 심하게 요약되어서, 페이지로나마 남아있던 리듀서가
하나의 단어가 되기까지 ...

얼마나 많은 개발자들이 뛰어들어서 바꾸게 되었는지 매주 실감하고 있다.

이정도로 변화의 속도가 빠른거라면, 난 정말 개발자로 나아가도 괜찮은 걸까 싶을 정도이다.

어쨌거나 꽤 혁신적이었던 리액트 쿼리와 리코일에 대해서 이야기 해볼까 한다.

쿼리는 useQuery와 useMutation으로 이루어져있다.

useQuery에서는 data를,

useMutation에서는 mutate를 써준다는 공식.

data와 mutate는 중복되어 작성되는 코드이므로 이름 변경은 필수이다.

useQuery는 get,
useMutation은 post, delete, update를 해낼수 있다.

axios를 통해 서버와 통신하는 내용을 api페이지에서 전역관리하면서 적재적소에 활용하면 된다.

리코일은 길었던 리듀서의 종지부를 찍는 라이브러리같다.

리덕스로 넘어가서 리듀서를 줄줄 쓰고 통째로 암기했는데,
툴킷에서는 조금 요약된 버젼이 나오고,
thunk에서는 리듀서를 쓰지 않고 extra리듀서를 썼고,
리코일에서는 state를 변경해주는 역할을 하는 "단어의 형태"인 "리듀서"가 되었다.

useState를 쓰는것처럼,

const [value, setValue] = useRecoilState()
의 형태를 가지고 value를 state화 시켜서 값을 변경하는 것이다.

이때 setValue가 리듀서가 된다.

useRecoilState() 괄호안에 들어가는 것이 전역으로 관리되는 페이지에서 선언된 변수명인데,

import 해와서 넣어줘야 한다.

전역관리 페이지는 곧 Store인데, 여기서는 {atom}을 import해와서
export const 변수명 = atom({key : "", default:""})

의 형태로 써준다.
그래서 useRecoilState를 통해 value에 담기는 값은 default가 된다.

이해를 하고 있으면 쉬운 이야기 인데,
블로그들마다 어렵게 쓰여있고 ㅠ
나는 쉽게 풀어서 쓰고 싶은데, 막상 쓰려니 쉽지가 않다.

쿼리도 화면을 보면서 이해하면 쉬운데, 블로그에 잘 정리할 자신이 없어졌다...

지난주 까지는 thunk로 작업을 했지만,
이번주는 query와 recoil을 써서 작업을 하고 있다.

전역으로 쓸 데이터가 있는지 없는지 여부를 작성해보지 않고 확인하기 어려운 코린이 상태..

어디에 어떤 값이 들어가야 하는지도 몰라서 막막했던 상태가 아주 많이 개선되지는 않았다. 여전히 이게 뭐죠? 여긴 뭐죠? 이런 질문 받으면 머릿속이 백짓장처럼 하얘진다 ㅋㅋㅋㅋ

이제서야 매개변수, 의존성배열, 객체 등등의 용어들이 귀에 들어오고 코드를 봤을때 어떻게 진행이 되는건지 대충 알아가고 있는데 ...ㅠ

갈길이 멀어도 너무나 멀다.

게다가 이번주엔 모달창까지 띄우다보니 데이터의 흐름을 장악하지 못하면,
화면에 아무것도 뜨지 않는 비극이 기다리고 있겠지...

쿼리가 꽤 간결하기에 망정이지 다시 thunk나 리덕스로 작성하라고 하면 못할것 같다... ㅠ

그럼에도 불구하고 나아간다.
신에게는 아직 56일이 남았사옵니다 ㅠㅠ

어제 새벽 5시 넘어까지 있었더니... 체크아웃이 날아가서 시간이 이상하게 등록되었다. 거의 21시간 한거 같은데... ㅠㅠ 아까비.. 뭐, 밥먹는 시간 뭐하는 시간 빼고..몇시간 누락되긴 했지만,

계획대로 주 100시간 이상은 채웠으니 그걸로 되었다.

profile
코딩하고 글씁니다

0개의 댓글