에이미의 성장기록

오늘은 리액트 모달창 위에 리액트 모달창을 올리는 걸 하려고 했다. 안되길래 찾아보니까 multiple modal은 안된다는 글들이 많고, 무슨 라이브러리를 또 설치해야한다고 해서 바닐라 자바스크립트로 팝업창을 구현하다가 안될리가 없는 것 같아서 z-index를 주어봤다ㅠ 그래도 안되길래 안되나 했는데 overlay (모달창 배경)에 z-index를 주니까 모달1 위로 모달2가 올라왔다. 오.. 모달 2개가 되는구나. 찾아보니까 모달에 z-index 줄 때, content 뿐만 아니라 overlay에도 z-index를 줘야 위로 올라온다고 했다. 결론, react-modal 라이브러리 모달 2개 됨 (3개도 될까,,?) pull request가 무엇인지, 어떻게 쓰는지에 대해 알게되었다. pull req..

공부 내용을 블로그에서 노션으로 적기 시작했다. 입사 동료랑 배운 내용을 회사 코드를 바탕으로 서로 알려주고(?) 공유하기로 했기 때문이다. 리액트르 공부할까 뭘 할까 하다가 회사코드 보면서 어려운거 서로 공부하거나 물어보면서 알아가자고 방향을 잡음 그래서 블로그에 글쓰는 것들이 부쩍 줄었지만 그래도 기록의 느낌으로 쓰고싶어서 퀄은 떨어졌지만(?) 그래도 쓰고 있다. 오늘은 일을 뺏??겼다?ㅠㅠ 여튼... 내가 제대로 못해서 내가 하던 일을 결국 사수님이 뒤 엎으셨다... 그것 때문에 우울했는데, 티가 나나보다 ㅠㅠ 슬프다. 나도 잘하고 싶은데 아직 안되나보다. 급 기본적인 부모 컴포넌트에서 자식 컴포로 props 넘기는것도 헷갈리기 시작했다... 리액트 지식이 너무 부족한 것 같다. 공부를 더 해야겠다..

저번주는 체력 제로였다.ㅠ 백신에 생리통 같이오고 장염증상까지 와서 주말에 앉아있질 못했었다. ㅠㅠ 어어어어아ㅡ아악 이번주도 고통의 연장선이지만 열심히 버티고 있다..ㅠㅠㅠ 흐 할수있다~~~~ 나레기야 죽지말자 this 현업 코드에서 this와 직접적으로 마주칠 일이 생기게 되었다... 두근... 코어 자바스크립트야 내게 힘을 주련 파라미터를 넘겨서 넘겨서 할 필요 없이 리스터에 있는 콜백함수에서 this를 찍으면 콜백함수를 호출한 놈이 this가 된다는 것을.... 다만 역시 콜백함수로는 애로우 펑션을 쓸 수 없었다. arrow function은 this는 상위 환경의 this를 계승하기 때문에 bind 도 안먹는다 걍 정적으로 가지고 태어난 놈이라 일반 함수를 써주었다. 그리하여 리스너의 호출하는 놈..

이번주는 TIL을 쓴 적이 별로 없었다. 왜냐하면 이번주도 또 멘탈이 바사삭 되었기 때문이다. 맨날 멘탈이 바사삭 나는 것 같아 보이지만 이번주는 특히 누가 밟은 쿠크다스 같았다ㅋㅋㅋ 부정적인 기운들을 계속 TIL에 담는 것같아 속상해서 블로그에 들어오기 싫었다ㅠㅠ 근데 이상하게 어제 이후로 독기가 더 오르는 느낌이다,, 역시 나는 나를 채찍질 해 가면서 힘을 얻나보다ㅠ 항해에서 모집하는 로켓단 1기도 신청했다. C#으로 게임을 개발한다고 하는데 재밌을 것 같다 여튼 오늘은 어떤 특정 기능을 구현하는 과정에 대한 것을 써보고자 한다. 수첩을 캡처해서 올리고 싶은데 회사 코드의 내용이라 올리기는 애매해서 그냥 대충 글로 정리해보고자 한다. 1) 코드를 읽는다. (물론 남이 짠 코드라 1도 모르는 상태임) ..

월요일두 역시나 23시 퇴근을 했다. 도대체 나보다 늦게 가시는 분들은 집에 어떻게 가지..? 라는 물음표를 가지고 퇴근했다. 예전에 삼성역에서 직장 다닐때 우리집이 멀다고 생각한적이 단 한번도 없었는데, 여기 다니니까 우리집이 너무 먼것같다는 생각을 했다,, 11:30분 기준으로 집가는 길을 찾아봤는데 내일 6시 도착이 뜬다^^ 아니 네이버 길찾기는 저런 루트는 왜 알려주는건데.... 😩😩😩😩ㅎ 여튼 오늘은 리덕스 툴킷을 써봤다. CreateSlice로 액션과 리듀서를 한번에 만들었는데 세상에 너무 편하다....;; 툴킷 최고다. 툴킷이 immer와 middleware없이 쓸수있다고 하는데 시간될때 어떤 부분이 이 두개의 역할을 하는지 꼭 공부해야겠다. 오늘은 Css늪에 빠졌다. Calc(100%-20..

드디어 금요일이다~~~~ 무야호~! 어제는 재택을 했는데, 재택이 더 피곤해서(?) 뻗었다. 혼자 하려니 더 힘들고 막막했음...흑흑... 병아리 신입... 지금도 졸리긴 하지만, 오늘 배운것을 꼭 쓰고 가려고 노트북을 다시 켰다!!!! 매일매일 배우는 것은 너무 많지만 짧게 간략하게만 기록의 느낌으로 쓰고 자야겠다. 다 하고 주말에는 앞으로 같이 입사한 동료분과 cs개념(computer science) 스터디를 하기로 했다. 책 한권 사서 읽어가는 느낌으로 아침마다 가볍게 진행해보고자 한다. 그래서 주말에는 어떤 책으로 공부하면 좋을지 찾아봐야겠다. 1) You provided a `value` prop to a form field without an `onChange` handler. This wil..

오늘은 동료 두 분의 코드 리뷰를 참관..? 엿듣기? 했다. 불필요한 코드를 줄이고, 효율적인 코드를 만들어내는 과정이 너무 좋아 보였고 배우고 싶었다. 대화의 한 50% 정도만 알아들은 것 같은데 언젠가는 다 알아듣는 날이 오겠지..? (코드좀 틈틈히 봐야겠다. 그 중에서도 오늘 불변성 관리에 대해서 좀 다시 알게 되었어서 그 부분을 정리해보고자 한다. 리액트에서 state는 불변성을 유지해줘야한다고 배웠다. state의 변화를 감지하고, 변화에 따라 리렌더링이 되기 때문이다. useState를 사용할 때, const [user, setUser] = useState(""); 라는 코드가 있고, user를 바꿀때, setUser(userA) 이런식으로 바꾼다. 만약 state의 일부만 바꾼다면, 아래처럼..

리팩토링이란? - 외부 동작을 바꾸지 않으면서 내부 구조를 개선하는 방법 왜 해야할까? - 코드 가독성 증가 - 성능 최적화 - 중복제거 어떻게 해야할까? - 적당한 갯수로, 적당한 크기로 - 브라우저 시각을 넘어가지 않는 정도의 길이 -> 지각, 인지 up 리팩토링을 하지 않은 코드는 특정 부분을 찾기가 어렵다. 수정이 어렵고 디버깅이 힘들다. div로 만든 태그를 컴포넌트로 바꿔주고, 중복된 코드를 함수로 만들어 주는 형태로 리팩토링을 할 수 있다. 깔끔한 코드를 쓰고싶어서 찾다가 이런 블로그 글을 봤다. 리팩토링과는 크게 상관없지만 클린코드를 쓰기에 유용한 팁들이 많아서 좋았다. 나중에 다시 봐야지 https://jae04099.tistory.com/entry/React-%EB%A6%AC%EC%95..

git 현재 상태 확인 git status 어떤 수정사항들이 적용됬는지 볼때 사용 git diff 커밋 내용들을 보여준다(커밋 히스토리) git log 원하는 파일을 깃 레포지토리에서 삭제 git rm 로컬 branch 확인 git branch -l 전체 branch 확인 git branch -a 리모트 저장소 branch 확인 git branch -r 로컬 branch 정보와 마지막 커밋 내용을 같이 확인 git branch -v 로컬에 새로운 브랜치 생성 git branch 브랜치명 이미 존재하는 로컬 브랜치가 원격 브랜치를 트래킹하도록 설정 git branch --set -upstream origin 브랜치명 로컬에 새로운 브랜치 생성과 동시에 이동 git checkout -b 새 브랜치이름 그냥 ..

https://www.youtube.com/watch?v=3H4umWD5bwI 우아한 형제들 CEO 김범준 대표님의 뽑고 싶은 개발자에 대한 10분짜리 영상을 봤다. 코딩을 적게하면 좋다. 문제 해결력이 중요하다 예전에 개발자로 일하기 전에 인터넷에 돌아다니는 밈에서, 개발자가 키보드 치는 소리가 나면 카톡하는 소리다 라는 글을 본적이 있다. 내 상상속 개발자는 타자 900타를 넘어가는데 뭔솔,,? 했던 내가 오늘,, 오늘 모니터만 째려봤다. ㅠ 구현해야하는 기능을 대체 어떻게 구현하지..? 이렇게 하면 될까..? 저렇게..? 음.. 다시 고민 의 반복이었다. 이걸 왜 해야하고, 어떻게 해결해야하는지에 초점을 맞춘 개발자가 되는것이 중요하다. 단순히 코딩만 하는것이 개발자가 아니라는 공감이 되는 말씀이었..