본문 바로가기

전체 글124

[원티드 프리온보딩 9월]1회차 회고 원티드에서 진행하는 프리온보딩에 신청하여 오늘 첫 회차를 진행했다.이번에는 이벤트 루프에 대한 주제로 이야기를 나눠보는데, 프론트엔드 개발자로서 잘 숙지하고 있어야 할 개념이라고 생각해 시작 전부터 매우 기대됐다.  그리고, 1회차 강의인데도 매우 유익한 시간이었다. 1회차기 때문에 기본적인 개념들을 다뤘지만, 그만큼 정확히 알고 설명할 수 있어야하기 때문에 공부가 많이 되었다.  이제 이런 너디한 조크도 만들 수 있게 됐다.오늘의 학습내용이벤트 루프의 정의동기 Synchronous 와 비동기 Asynchronous 블로킹 Blocking 과 논블로킹 Non-Blocking동기/비동기 와 블로킹/논블로킹 차이점Program, Process, Thread 의 정의병렬성 Parallelism 과 동시성 .. 2024. 9. 7.
[포트폴리오 웹페이지]프로젝트 메타인지하기, 마이그레이션 준비 취업 준비 기간동안 작성한 포트폴리오 웹페이지가 있다. 이때는 다른 프로젝트들을 이미 React로 진행했기 때문에 기본기를 다지고, 갖추고 있음을 어필하기 위해 Vanilla JS를 사용하여 웹 페이지를 만들었다. 사실은 이후에 취업하면 마이그레이션 작업을 하려고 했다. 그러나 일로 바쁘다는 핑계로 마이그레이션 작업이 많이 늦춰졌다. 어느새 경력이 1년이 되어가는 시기인지라, 언제까지 Vanilla JS로 웹페이지를 둘 수도 없으니 늦게라도 마이그레이션을 진행하기로 결심했다.프로젝트 메타인지 하기 먼저 프로젝트를 진행하기 앞서 나, 그리고 나아가 프로젝트에 대한 메타인지를 명확히 하기 위해 몇 가지 질문에 대해 스스로 대답을 작성했다.  1. 왜 하는가? 이제 정식으로 개발자가 되어 경력을 쌓아가고 .. 2024. 8. 18.
[React-Query]리액트 쿼리 기본 문법 리액트 쿼리를 왜 써야 하는지 지난 포스팅에서 언급했으니, 이제 기본 문법들을 정리해 보자. 해당 문법들에 대한 설명은 udemy에서 내돈내산한 강의 React Query / TanStack Query: React Server State Management의 내용을 기반으로 하고 있다.QueryClientProvider리액트 쿼리를 사용하기 위한 기본 공급자(Provider) 컴포넌트이다. 비슷한 예시로 ThemeProvider, RouterProvider를 생각하면 될 것 같다. 상위 컴포넌트에서 한 번 감싸서 사용하면 되고, 보통 queryClient라고 선언하는 인스턴스를 client 속성에 할당해주어야 한다. 아래와 같은 형식으로 생성한다. import { QueryClient, QueryClie.. 2024. 6. 24.
[React-Query]리액트 쿼리 Intro 최근 프로젝트들에서 계속 리액트 쿼리(React-Query)를 쓰고 있다. 리액트 쿼리를 써본 적이 없어서 처음 썼을 때 너무 어려웠고, 이후에도 필요에 따른 문법만 띄엄띄엄 대충 보고 작업을 하다보니 관련된 지식이 많이 모자라다는 생각이 자주 들었다. 이에 따라 강의를 듣고 좀 더 제대로 배울 필요가 있다는 생각이 들어 강의들을 찾아 보았다. TanStack Query 공식 문서에서도 정식 강의가 있는데, 가격이 덜덜해서 포기하고 Udemy에 올라와 있는 리액트 쿼리 강의를 선택했다. 디테일한 설명과 미리 준비되어있는 코드들로 필요한 부분들만 code-along 하면서 공부할 수 있어 쾌적하고, 재밌었다. 아직 배웠던 지식을 실무에 많이 적용해보진 않았지만, 강의를 들어면서 흥미롭게 들었던 내용들과 정.. 2024. 6. 21.
[React-Typescript] 프로젝트 기본 설정 및 DaisyUI 드롭다운 구현하기 개발을 업으로 삼은지 8개월이 지난 어느 날. 회사에서 신입 개발자들을 뽑는다는 소식을 들었다. 새로 뽑는 사원의 경우 업무 능력을 보기 위해 라이브 코딩 테스트를 본다고 한다. 주제는, 30분 안에 TODO 리스트 만들기 였다. 수많은 개발자들이 거쳐왔을 너무나도 익숙한 주제였지만, 프로젝트 설정부터 구현까지 30분이라는 조건이 마냥 쉬울 것 같지는 않았다. 시험을 보니 이게 왠걸, 생각보다 더 어려웠다.  나름 경력이 쌓이고 다양한 프로젝트를 했다고 생각한 내게 현실을 깨닫게 해주는 시험이었다. 시작부터 설정에서 실수해서 프로젝트를 지우고 다시 시작하는 희대의 삽질과 함께 30분이 빛의 속도로 지나갔다. 시험의 요구사항 절반도 채우지 못한 내가 그곳에 앉아 있었다. 응시자였다면 떨어질 수 있는 점수를.. 2024. 6. 8.
[Mac]개발자의 맥북 초기화 전 백업 및 초기 설정 최근 일하는 도중 갑자기 맥북이 꺼졌다 켜지는 현상이 발생했다. 순간 놀랐지만, 맥북이 잘 켜져서 괜찮겠구나~ 했는데... 맥북의 키 설정 전반이 꼬여버렸다.  이게 정말 짜증 나는 부분이었던 게 웹스톰을 쓰면 space 키를 누를 수가 없었다. (누르면 탭처럼 작동 - 심지어 인터넷을 비롯한 앱 전반에서도 자꾸 윈도우에서 탭 키를 누른 것처럼 포커스가 잡혔다)  원인은 맥북 키설정과 webStorm의 키설정이 충돌을 일으킨다고 했다. 하지만 맥북 내 키설정도 바뀐 게 없었고, 웹스톰도 설정을 확인해봐도 바뀐 게 없었다. 약 1시간 반가량 검색을 하면서 여러 방법(키보드 교체, 블루투스 연결 재시도, 웹스톰 재설치, 맥북 환경설정 초기화 등등)을 시도했지만, 나랑 완전히 동일한 케이스는 없었고 문제는 해.. 2024. 5. 17.