ref 란 무엇인가 ? 간단한 사이드 프로젝트인 countdown-game을 제작하면서 dialog 와 timer를 전달을 위해 useRef를 사용하였다. >useRef는 렌더링에 필요하지 않은 값을 참조할 수 있는 React Hook입니다.(React공식문서) J
24년도 첫번째 공채 준비를 하게 되었다. 나한테도 살면서 이력서를 써내려가며 다듬고 수정을 거치는 과정을 거칠줄은 몰랐다. 물론 급하게 이력서를 썻던것도 아니다. 23년도 마지막 학기를 다닐 때 부터였나..어느정도 '이력서' 라는 틀을 갖고 조금씩 채워가긴 했다. 이
📚 들어가며 오늘 면접 스터디에서는 리플로우와 리페인팅에 대해 설명 및 예상 면접 질문들을 만들어 팀원들에게 소개하였다. 우선, 리플로우와 리페인팅 설명 전에는 브라우저 렌더링의 대해 간단하게 설명하는게 좋다고 생각하여 렌더링 설명을 추가하였다. 또한 블로그에 한번
CS지식 면접 스터디에서 SPA/CSR/SSR 에 대한 정의와 각각의 차이점을 정리하여 팀원들에게 발표를 하였다. 하지만 남에게 제대로 이해시키면서 설명을 한것이 아님과 동시에 지식이 아직 부족하다고 느꼈기에, 개인적으로 조금 더 깊이 알아보면서 공부하고 싶다는 생각이
요즘 들어 자소서와 코테에만 신경을 쓰며 살았다. 너무 개발을 놓다보니 무언가를 만들고 싶었고, React의 기본기가 부족하다고 생각하여 최근에 공식문서를 읽으며 천천히 기본기를 다지자는 마음이 생겼다. 때문에 공식문서에 나오는 틱택토 게임을 만들면서 조금씩 진행하고
리액트 개념들을 탄탄히 다지면서 개인 프로젝트를 진행하고 있다. 진행중에 있어서 data.js 라는 파일 안에 객체 배열이 들어있다. 각 항목들을 컴포넌트에 전달하는 데 전개연산자를 사용하여 컴포넌트에 속성을 전달해 주다 머릿속으로 잘 그려지지 않아 글을 쓰게 되었다밑
JSX를 반환하는 것은 주로 React 컴포넌트 내에서 사용되지만, 조건에 따라 다른 곳에서도 사용될 수 있다. return을 사용하기 전, JSX 코드는 반환되지 않기 떄문에 컴포넌트 코드 아무 곳에서 일반적으로 사용 가능하다. 즉 변수나 상수에 저장해서 쓸 수 있다
자료구조를 본격적으로 공부하려고 이 글을 써보려고 합니다. 자료구조를 제대로 공부해야만 훗날 근무를 할 때, 혹은 더 좋은 코드를 작성할 수 있다고 생각하기 때문입니다. 자료구에 대해 깊이 있는 개발자가 되기 위해 공부해보겠습니다.Hash function: 임의 길이
이번에 기회가 되어 싱크톤 공모전을 나가게 되었다. 개발단계에서 지도API를 사용하여 Map을 띄우는 부분을 맡게 되었다. map을 띄우는건 react-kakao-maps-sdk 를 사용하여 띄웠는데 문제가 생겼다. map이 초기에 렌더링이 되지 않고 페이지가 나온것
원티드 프리온보딩 과제를 해결하면서 나에게 의문점이 하나 들었다. 'REST API 를 진정으로 이해하면서 코드를 작성한건가?' 사실 이런 의문점이 든 이유는 짧은 기간안에 기업 과제물을 완성하여 제출해야 하다보니 다른 사람들의 코드를 많이 참고하였고, 완성된 코드를
깃허브에서 Next를 공부하는 레포지토리를 생성하였다. 새로운 것을 공부하려고 만든 목적인 레포지토리 이기에 API 중 하나인 GraphQL을 배워 간단한 개념과 초기셋팅 방법을 적어보려고 글을 작성하게 되었다. Graph QL(이하 gql)은 Structed Quer
프리온보딩 인턴쉽 과제를 하던 도중, 무한스크롤 기능을 넣으라는 조건이 있었는데 당시 제출기한이 너무 짧았고,무한스크롤의 대한 이해도와 코드가 어려운 탓에기능을 완전하게 끝내지 못하고 제출하였기 때문에 리펙토링을 하면서 이 글을 쓰게 되었다! Github API를 활용
들어가며 😃 대체 이 글을 왜쓰냐! 특정 레파지토리 Issue List 들을 가져오던 중, 계속해서 property type error 오류 메시지를 만났기 떄문이다. 프로젝트 제출 기한이 짧고, 빠르게 제출해야 해서 옵셔널 체이닝을 사용하고 난 후 그냥 넘어갔지만
GitHub REST API를 활용하여 특정 깃헙 레파지토리의 이슈 목록과 상세 내용을 확인하는 웹 사이트를 구축하는 프로젝트를 진행 중 아래와 같이 날짜 형식이 원하는 대로 출력이 되질 않아 찾아보다 moment.js 라는 것을 알게되어 이 글을 쓰게 되었다😎mom
여지껏 팀 프로젝트를 진행하면서 prettierrc.cjs 파일 형식으로 진행을 하였는데 이번 새로운 팀 프로젝트를 들어가기 전, 팀원들과 소통을 하다 prettierrc.cjs 와 prettierrc.js 의 차이점을 이야기 하게 되었다. prettierrc.js 파
TodoList를 만드는 도중 input 태그 안에 value 의 기본값을 defaultValue 라고 주었더니 나온 오류이다. value 의 들어가있는 기본값은 state 값의 문제결론부터 말하자면 value 속성은 제어 컴포넌트로서 입력 요소의 상태를 React가
원티드 프리온보딩 과제를 진행중 무한 리렌더링이 발생하여 글을 적게 되었다. 기능구현 중 회원가입 후 로그인을 하게 되면 localStroage 에 token 값을 저장하여 TodoPage로 넘어가게 코드를 설정해놓았다. 하지만 todo 페이지로 넘어가기 전, 화면 렌
모노레프 팀 프로젝트를 첫 진행과 동시에 겪은 오류 메시지다.다른 팀원들은 nvm 설치가 원활하게 되었지만, 필자는 오류때문에 애를 먹었다.이 글은 zsh 기준으로 설명을 하겠다.꼭 vim 이 아니여도 되지만, 필자는 vscode 에서 해보았지만 되질 않아서 vim으로
혼자 진행하는 React 프로젝트 중에서 find 매서드를 사용하다가 알게되었다.find 매서드를 사용하려 했던 이유는 이미지 클릭 시 그에 맞는 이미지에 맞춰서 페이지를 불러오게끔 하려 했다. 만약 밑에 있는 이미지를 클릭 했을 시 ! 이미지에 맞는 페이지를 띄우는
React 팀 프로젝트 활동 당시 vite로 환경설정을 하게 되어 vite 방식대로 CRA의 절대경로를 설정해 보았더니 제대로 작동이 되질 않아 찾아보다 글을 쓰게 되었다.기본적으로 CRA는 React 공식 홈페이지에서 제공하는 절대 경로 설정 방법(https: