성장을 위한 기록

git cherry-pick은 다른 브랜치 위에 있는 커밋을 현재 브랜치에 적용시킬 때 사용할 수 있다. main에 있는 커밋 중 D 커밋을 feature 브랜치에서 cherry-pick 하여 반영한 그림이다. cherry-pick 사용법 git chery-pick { 커밋 해시 }해당 커밋이 현재 브랜치에 불러와 진다. git cherry-pick 417ebbd git chery-pick { 커밋 해시 } { 커밋 해시 }2개의 커밋이 현재 브랜치에 불러와 진다. git cherry-pick 415ebbd b4a48fb git chery-pick { 커밋 해시 }..{ 커밋 해시 }커밋이 연속적이라면 앞에 커밋부터 뒤에 커밋까지 현재 브랜치에 불러와 진다. git cherry-pick 415ebbd....

stash (스테이시) 사용하는 이유 [ 1 ] 커밋 없이 pull, checkout 등을 사용하기 위해 코드를 작성하다보면 작업 중 pull, checkout 등을 할 필요가 있다. 하지만, 커밋을 하지 않을 경우 위 명령을 수행할 수 없을 뿐더러 단순히 브랜치를 옮기기 위해 커밋을 하는 건 바람직하지 않다. ( 커밋 메세지는 히스토리를 남길 수 있는 중요한 요소 ) 위 상황에서 스테이시를 통해 변경사항을 저장하고 다른 작업후 돌아와 이어 코드를 작성할 수 있다. [ 2 ] 잘못된 브랜치에서 작업했을 경우 예를 들어 develop 브랜치에서 작업을 했어야 했지만, 실수로 main에서 작업하고 있던 경우가 있다. 이때 스테이시를 통해 잘못된 브랜치에서 작업한 내용을 저장하고 develop브랜치로 이동하여..

add 란 ? 수정한 코드를 가지고 커밋을 날리기 위해서는 어떤 파일을 포함할 지 정해야한다. 여기서 git add 명령어를 통해 원하는 파일만 포함시킬 수 있다. git add 사용법 git add 특정 파일을 선택해 스테이징 영역에 넘길 때 사용할 수 있다. 추가하고 싶은 파일에 경로를 작성한다. 작성한 경로 하위에 속한 모든 파일을 추가한다. git add . “.”이란 경로는 현재 경로를 말한다. 즉 현재 경로 하위 모든 파일을 추가한다. 현재 디렉토리 이하 변경된 내용 모두를 스테이징 영역에 넘길 때 사용한다. 현재 디렉토리 상위 변경사항은 넘기지 않는다. git add -A 작업하는 디렉토리 상 모든 변경사항을 스테이징 영역에 넘긴다.

이론적인 내용만 정리. 예시 코드는 하단 벨로퍼트 링크에 아주 잘 명시되어 있다. redux는 자바스크립트 상태관리 라이브러리이다. redux 본질은 node.js 모듈이다. redux 기본 개념 단일 소스 동일한 데이터는 항상 같은 곳에서 가지고 나온다. (store) 즉 스토어라는 공간은 하나만 존재한다. 읽기 전용 액션이라는 객체를 통해서만 상태를 변경 할 수 있다. 순수 함수로만 변경이 가능하다. 즉 reducer는 순수 함수여야 한다. store 스토어는 상태가 관리되는 하나만 존재하는 공간이다. 컴포넌트와 별개로 스토어라는 공간이 있어서 필요한 상태를 담는다. 필요한 컴포넌트에서만 스토어에 접근을 한다. action 주문서라고 볼 수 있다. 액션은 앱에서 스토어에 운반할 데이터 다르게 보면 저..

실전 프로젝트 마무리하며 실전 주차가 마무리되고 이제 지원 주차에 들어왔다. 실전 프로젝트를 돌아보는 시간을 갖고자 한다. 왜 stockhub인가? 리더님에 아이디어였다. 나는 별다른 아이디어도 없었고, 프로젝트에 아이디어가 단순 게시판 형식만 아니면 됐다. 주식을 주제로 하다 보니 차트 구현 등 재밌는 그림도 있을 것 같아서 그대로 진행하기로 했다. websocket만 추가 의견을 냈다. 사용 기술 몇 가지만 살펴보자면 cloudFront 배포, reactquery, recoil 정도 있는 것 같다. CloudFront배포는 사실 욕심이였다. 처음에는 Amplify로 배포했었다. CloudFront로 변경한 이유는 자동으로 https 환경으로 배포가 되기 때문에 백엔드에서 https로 배포하기 전까지 ..

노마드 코더를 보며 typescript 버전으로 정리한 내용 tpyescript 이해도가 부족해 완벽한 내용은 아닐 수 있습니다 훅 export const useInput = ( initialValue: string,validator?: ((value: string) => boolean) | any => { const [value, setValue] = useState(initialValue); const onChange = ( event: ChangeEvent | ChangeEvent) => { let willUpdate = true; if (typeof validator === "function") { willUpdate = validator(value); }//else { ..... 함수가 아닌 다..

이번 주를 진행하면서 기술적으로 막혔던 부분 도메인 주소와 S3 주소에 버전이 다른 이슈 문제 상황 소켓 테스트를 위해 몇몇 컴포넌트를 주석으로 변경하여 배포를 한 후 동작하는 것을 확인하고 완성된 파일을 build 하여 S3에 배포하였다. 도메인에서는 변경사항이 제대로 반영되지 않았고, s3 도메인에서는 변경사항이 반영됐다. 문제 원인 가설 1. 도메인까지 연결되는 시간이 걸림으로 기다려야 한다. 가설 2. s3 배포를 할 때 도메인에도 올리기 위해서는 추가적으로 어떤 행동을 해야 한다. 가설 확인 가설 1 확인 . 단순히 기다려봤다. 가설 2 확인 . 가설 1을 확인하기 위해 기다리면서 검색을 진행했다. s3와 도메인에 차이에는 route 53과 cloudfront에 영향을 받았고, 만일 두 버전에 ..

실전 프로젝트를 진행하며 기술적으로 막혔던 부분 특정 상황에서 useQuery로 API 요청하기 자세한 정리는 github 링크로 대체 GitHub Issue 실제로 사용하지는 않았지만, 사용하기 위해 다양한 방법으로 많은 시도를 한 주제이다. 단순히 react-query를 사용하지 못하는 것일 수 있으나, 내가 찾은 공식 문서에 옵션과 지금까지 습득한 지식을 가지고 해결하기 위해 많은 노력을 했다. 물론 해결방법은 구글링을 더 깊게 한다면 금방 찾을 수 있을 것 같다. 고민하게 된 이유는 옵션을 하나 찾았을 때 충분히 배운 지식으로도 더 좋은 방법이 아닐 수는 있지만, 구현 할 수 있다는 생각이 들었고, 내가 지금 수준에서 할 수 있는 방법 중에 어떤 방법이 제일 효율적일지 찾기 위해 다양한 방법으로 ..

recoil 설치 명령어 npm install recoil yarn add recoil recoil vs redux 이번 프로젝트에서 상태관리 라이브러리를 선택하는 과정에서 여러 고민을 했었다. 그 동안 사용했던 익숙한 redux를 사용하는가, 새로운 recoil을 사용해보는가 결과는 처음에는 redux였고, 이제는 recoil이다. 처음 redux를 선택한 이유 개인적으로 상태관리 측면에서만 본다면 원툴이라 생각할 정도로 확실한 상태관리를 할 수 있다. 또한 지금까지 사용하면서 익숙하기 때문에 코드를 빠르게 작성할 수 있다. 그럼에도 recoil로 갈아탄 이유는 ? 우선 전역 상태관리를 해야하는 데이터가 거의 없었다. 클라이언트 데이터도 거의 없고 아직까지 서버 데이터는 없다. 이런 상황에서 비교적 무..