업데이트되는건 우리가 하는 게임 버전뿐만이 아니고, 언어도 업데이트되며 지속적으로 기능이 추가된다. 각설하고.. 23년에 새로 생긴 JS의 신 기 능 들에 대해서 알아보도록 하겠다. (해당 글은 이미 유명하신 노마드코더님의 영상을 통해 따로 정리한 글입니다.) Array.toReversed / Array.toSorted / Array.toSpliced 우리가 기존에 사용하던 Array.reverse() / Array.sort() / Array.splice() 가 이미 존재하는데 대체 뭐가 다른건가 ~ 싶을 수 있다. 위에 함수를 써본사람이라면 다 알겠지만 해당 함수들은 원본 배열도 변경시킨다는 특징 또한 가지고있었다. const a = [0, 1, 2]; const b = a.reverse(); cons..

이전에 TOSS 문제에서 처참히 수준을 깨닫고 나중에 다시 풀어보겠다고 말을 했었다. 그리고 이번 스터디에서 단순 완성한 코드를 피드백받았는데,, 내 생각대로(?) 무수한 피드백을 받았다. 내 코드 자체가 워낙 다듬어지지도 않았고, 내가 봐도 굴러가기만 하는 누더기와도 같은 상태였기때문에 많은 피드백들을 받을 마음의 준비는 끝마쳐진 터라 사실 큰 충격을 받진 않았었고 오히려 저 날카로운 26개의 피드백이 나에게 너무 큰 도움이 되었다. 겸사겸사 피드백 주신분들의 코드를 보면서 이렇게도 짤 수 있겠구나 하는 아이디어도 많이 얻었던 것 같다. 지금은 1차 리팩토링을 마치고 수정점이 조금 남았는데 (근시일내로 마무리 지을 예정) 이번에 리팩토링하면서 느낀점들을 까먹지 않게 기록해보려고 한다. 리팩토링하면서 수..

토스 넥스트 시험을 봤습니다. 어차피 잘 풀거라고 생각하지는 않았었고 해서,, 과제 테스트는 처음이기도 하니 그냥 문제만 잘 보고 할수있는만큼만 풀어보자는 생각으로 시험을 시작했던거같습니다. 시험시간은 2시간 반, 오후 2시부터 오후 4시 반까지였구 저는 한 4시쯤에 gg치고 손 놨던 것 같네요 문제를 업로드하면 당연히,, 걸리기때문에 후기와 제가 부족했던점을 적어보려고 합니다. 문제 후기 문제 자체는 키패드 구현하는 문제였고, 주는 Api 잘 받아서 쓰면 되는 문제였습니다. 얼마나 더 이야기 할 수 있는지는 잘 모르겠어서 이정도만.. 부족하다고 느꼈던 부분들 1. 타입스크립트 숙련도 이슈 가장 먼저 느낀 부족한 점 이었습니다. 타입스크립트로 코딩을 많이 하지 않았어서, 여기저기서 터져나가는 오류를 잡는..

저번에 프로젝트를 하면서 어떻게하면 사이트를 더 최적화할 수 있을까에 대해서 고민하다가 유용한 팁을 발견해서 공유드리려고 합니다. 사실 노마드코더님 영상이라 볼 분들은 다 봤겠지만은... 우리는 흔히 html에서 사진을 넣고 싶을 때 그냥 태그를 많이 사용합니다. 뭐 물론 img 태그 쓰는게 틀리진 않았다지만.. 더 좋은 방법이 있습니다 1. Lazy Loading 사용하기 태그에 lazy loading을 설정하는 것 만으로도 최적화에 도움을 줄 수 있습니다. lazy loading은 이미지를 처음에 다 불러오는게 아니라, 유저가 실제로 이미지를 볼 때 로딩하는 기법입니다. 처음에 모든 사진을 로딩하지 않으니 초기 로딩속도가 증가하겠죠? 2. 사용하기 사실 이렇게 쓰는것과 img 태그를 그냥 쓰는것의 퍼..

한학기동안 학교 기초캡스톤 과목을 수강하며 13명(사실 5명정도)이 만든 프로젝트... (달리 api가 쓰면 돈나가서, BE 맡으신분에게 달리 지갑 닫혀있냐고 물어보고 링크 올리겠습니다) 물론 생각보다 좀 덜 개발된 부분도 있었고, 오류도 있었고 했으나 전체적으로 봤을 때 성공적인 프로젝트였다고 생각합니다. (입상은 못해서 너무 아쉬웠어요) FE단은 리액트로 내가 거의 다 만들었고, (PM하는 친구가 웹 풀스택이었기에 도와줬습니다) 그렇기에 아쉬움이 좀 남네요. 사실상 두 번째로 하는 프로젝트였고, 이전에 썼던 툴과는 다른 툴을 썼습니다 (redux -> recoil, axios -> react query) 새로운 툴을 배워간다는 생각으로 시작했던 프로젝트여서 사실 완성도가 좀 떨어질거라고 생각은 했으나..

리액트는 엄청나게 다양한 hook들이 있습니다. 이 글을 쓰고 있는 지금도 제가 모르는 훅들이 정말 많구요, 이번 프로젝트를 하면서 유용하게 사용했던 useParams에 대해서 포스팅해보고자 합니다. 준비 사용하기 위해서는 react-router-dom 을 설치해야합니다. npm install react-router-dom 자바스크립트 개발자라면 개나소나 다 알고있는 npm을 사용하셔도 되고, yarn을 쓰셔도 됩니다. 사용 저같은경우는 이런식으로 route에다가 : 기호를 달아놓고 이후에 값을 지정해줬습니다 가령 /post/:postNum은, /post에서 파라미터로 postNum을 붙인다는거죠 /mypage/:userId도 마찬가지입니다, /mypage에서 파라미터로 userId를 받아오게 되는거죠 ..