코로 넘어져도 헤딩만 하면 그만

리덕스 개념이 영 안 잡히길래 팀원이 추천해준 강의를 들어보았다. 그 결과, store에서 dispatch를 통해서 action객체를 보내고, 이 action이 reducer에 들어온 뒤 return 된 값이 새로 store의 data가 된다는 일련의 흐름을 이해하게 되었다. 가벼운 예제를 만들어보면서 흐름을 살펴보니(그것도 vanilla js로!) 쉽게 이해가 되는 부분이 있었다. 이건 무료로 제공되는 강의니까 리덕스가 대체 어떻게 돌아가는지 감이 안 온다면 한번쯤 들어보는 것을 추천. #0.1 ❤️ 무료 강의 ❤️ – 노마드 코더 Nomad Coders All Courses – 노마드 코더 Nomad Coders 초급부터 고급까지! 니꼬쌤과 함께 풀스택으로 성장하세요! nomadcoders.co 우선..

es7 검색하면 나오는 아래와 같은 익스텐션을 깔아주면 rfce 네 글자만 입력해도 컴포넌트 기본 세팅이 생성된다! 직접 해보니 rafce는 화살표 함수로 나오고, rfce는 그냥 함수로 나온다. 이 외에도 명령어에 따라 여러 버전이 있으니 편한 걸로 쓰면 될 것 같다. 리액트에서 새 컴포넌트 파일 만들 때마다 일일이 써주는 것이 은근히 귀찮던데 어느 영상에서 쓰는 거 보고 바로 유용해보여서 깔아봤다. 직접 파일명과 똑같은 컴포넌트를 만들어주니 반복 작업을 안 해도 되어서 시간이 절약된다.

Typescript는 javascript 개선한 업그레이드 버전이라고 보면 된다. 따로 타입을 지정 안 해도 되는 포용력이 과하게 높은 자바 스크립트보다, strict하게 에러를 잡아주는 타입 스크립트의 중요성이 높아진다. 1) 자바스크립트는 dynamic typing 가능하기 때문에 5-'3'도 계산이 가능하다. 그러나 프로젝트 사이즈가 커지게 되면 이러한 자유도는 단점이 될 뿐이다. 타입 스크립트에서는 type error을 쓰면 이상하다고 말해준다. 2) 타입 스크립트로 엄격하게 타입을 체크하면서, 에러 메세지의 퀼리티가 올라가게 된다. "자바스크립트가 아직까지 살아 남은 이유는 타입 스크립트가 산소 호흡기를 붙여두었기 때문이다." -개발자 선배님 왈 🚩Typescript 적용하기 1) 파일은 무조건..

출시되자마자 사용했던 발표가 있다기에 적극적으로 신청했다. 누가, 어떤 방식으로, 어떤 사람들이 모여 재미난 프로젝트를 진행했는지 궁금했고 sns를 통해 전해 들었던 문제의 해결방식도 궁금했기 때문이다. 그때 한창 악성 공격 때문에 서버비를 폭탄 맞으셨다는 소식이 들려 안타까워했는데.....크리스마스를 맞아 따뜻한 마음을 전하고 싶다는 선의에서 시작한 프로젝트가, 악의로 망쳐진다는 점에 몹시 화가 났던 기억이 있다. 그러나 오늘 뵌 개발자분들은 그 당시 경험을 딛고 일어서서 3년차에 접어든 프로젝트를 즐겁게 진행 중이신 것 같아서 마음이 한층 놓였다. 발표 내용을 짧게 간추려 요약하자면 다음과 같다. 2021년-2022년을 거치며 개선된 점 아이디 잊어버리는 문제(나도 이 문제가 핫했던 기억이 난다. 다..

프로젝트 처음부터 styled-component로 하는 습관을 들이려고 react를 깔자마자 함께 깔아줬는데, npm run start를 시켰더니 아예 화면이 먹통이 되면서 Babel 에러라는 게 잔뜩 뜨는 현상이 발생했다. 그런데 에러를 해결하려 찾다가 문득 돌이켜보니 일전에 이 현상에 관해 동기분들이 얘기 나누던 걸 스치듯 본 기억이 났다. 급하게 스터디 방에 들어가서 검색했고, 이제 전과 달리 styled-component를 쓰기 위해서 npm install styled-components@latest 꼭 이 명령어로 깔아줘야 한다는 것을 깨달았다. ...언제 또 바뀔 지 모르겠지만... 적어도 지금은... https://github.com/styled-components/styled-compone..

금요일 밤을 기념으로 개인 프로젝트를 좀 만지다가 갑자기 이런 의문이 떠올랐습니다. 작년에 리액트를 처음 깔았을 때부터 왜 설치가 끝난 뒤 마지막에 'Happy Hacking!'이라는 인삿말이 따라 붙는지 궁금했는데요... 잠도 오지 않겠다, 한번 찾아보기로 합니다. 찾아보기만 하면 혼자 알고 그만이니까 포스팅도 해봅니다. 언젠가 누가 같은 의문을 느끼고 묻는다면 명쾌하게 답해주기 위해서요. 개발자가 절대 잃지 말아야 할 덕목이 호기심이라고 하지 않던가요.(며칠 전에 들은 말을 거창하게 써보기) npx create-react-app 새로 만들 프로젝트명 흔히 npm으로 리액트를 깔기 위해서는 위와 같은 명령어를 씁니다. yarn으로 까는 방법도 소개하던데 일단 익숙한 방식을 사용해보기로 합니다. 그러면 ..

최근 들어 리액트의 심화된 동작 방식과 훅에 관해 조금 더 깊은 학습을 해보았습니다. 직접 커스텀 컴포넌트 훅을 만들어보고, 이후 React.lazy를 써서 코드를 최적화 시키는 작업을 수행했습니다. 개인적으로 코드를 최적화시킨다는 개념이 굉장히 재밌어서 다른 챕터보다도 즐겁게 공부했는데요. 반복되는 로직은 컴포넌트를 훅으로 만들어 사용하며, 데이터를 초기에 데이터를 받는 속도를 감소시키는 방식들이 매우 효율적으로 느껴졌기 때문입니다. 🚩React와 가상돔(Virtual Document Object Model) 리액트를 설명할 때 가상의 문서 객체 모델인 Virtual DOM을 빼놓을 순 없을 겁니다. 가상돔은 실제 돔의 가벼운 사본인데, 리액트는 가상돔 객체에 접근해서 이전의 가상돔과 비교한 뒤, 바뀐..

이번 세션은 왜 유난히 빠르게 지나간 느낌이죠? 점점 더 눈 깜짝할 새에 시간이 흐르는 기분이 드네요. 기분 탓이면 좋겠는데. 81일 정도 남았다는 말에 화들짝 놀랐습니다😥 말도 안 돼. ⭕잘한 점 1. 지난 세션에 원치 않게 지각을 찍은 것과 달리, 이번 세션은 힘내서 출석하고 있습니다. 알람을 바꾸길 잘 했네요. 2. 운동 꾸준하게 다니고 있습니다. 전보다 체력이 낫나 싶지만, 아직 허리는 아픕니다. 잉... 거의 고질병...ㅠㅠ 3. 기술 면접을 세션 2보다 편한 마음으로 본 것 같습니다. 오늘처럼만 차근차근 답할 수 있다면 좋을 것 같아요. 4. 사이드 프로젝트 아이디어(ㅋㅋ)관련해서 페어분이랑 대화를 좀 나눴었는데 이후에 관련 자료를 모으다보니 꽤 재밌더라고요... 하나씩 구체화해보려 합니다. ..