https://www.acmicpc.net/problem/1450우선 그리디 문제임을 빨리 파악하지 못했다. 부분 문제들이 있고, 같은 데드라인 사이에서 어떤 컵라면을 선택할지 골라야하고, 결국 누적 합을 알아내는 문제라 DP 문제라고 생각했다/하지만, 현재
https://www.acmicpc.net/problem/1450시간 복잡도를 개선할 아이디어가 부족했다.현재 가방 들어간 물건들의 현황을 알고 있어야하고, 현재 물건을 넣은 경우, 넣지 않은 경우로 분리해서 그 다음 케이스를 고려해야하기 때문에 결국 모든 케
https://www.acmicpc.net/problem/12956\-> 한 정점에서 모든 정점으로 가기 때문에 플로이드-워셜로 해결하려고 시도함. \-> 플로이드-워셜로 테스트 케이스는 모두 통과 했지만 시간 초과 발생 \-> 플로이드-워셜의 시
https://www.acmicpc.net/problem/16118BFS + 최단 누적 거리를 계산했다. → 최단 거리인 경우에는 가중치가 주어지고 그 경우에는 heap을 통해 큐를 정렬하며 최소 가중치를 먼저 계산하는 것이 바람직하다. 늑대 연산시 1차원
우연한 기회를 통해서 실시간 통신 방식들을 서로 비교해봐야할 상황이 생겼다.실시간과 관련해서는 거의 경험이 없다시피 했고, 대충 WebSocket 개념 정도..? 만 알고있었다.언제가되든 실시간과 관련된 기능을 꼭 한 번 경험해볼 날이 올 것 같아 다양한 방식들을 알아
프로젝트를 진행하면서 팔로우/좋아요 버튼에 낙관적 업데이트를 처음 적용해보았고, 그 과정에서 관련 자료들을 찾아보고, 낙관적 업데이트에 대한 생각들이나 초기 코드를 리팩토링하는 과정을 적어보았다.useMutation의 동작에 따라 onSuccess는 mutateFn이
최근 프로젝트에서 PWA 기능을 구현 하거나, MSW를 통해서 백엔드 데이터를 mocking한 경험들이 있었다.두 가지 경험을 하면서 공통적으로 나왔던 용어가 있었는데 바로 Service Worker 다.Service Worker라는 개념이 여러번 나오다보니 조금 더
프로젝트 서비스 소개 페이지를 구현하면서 소개 리스트와 목차 컴포넌트를 구현하고, 목차 컴포넌트를 클릭했을때 특정 소개 영역으로 이동하도록 하는 요구사항이 있었다.간단한 구현이라고 생각했는데 그 과정에서 알게된 부분들이 몇가지 있어 구현 과정을 정리해보았다.위 이미지
최근 두 개의 프로젝트를 병행하고 있다. 항상 프로젝트를 하면 icon을 많이 활용하게 된다.앞서 시작한 프로젝트에서 icon을 관리하고 호출하는 방식을 이후 시작한 프로젝트에 적용해보면서 더 나은 방식이 있을 것이라는 생각이 들어 개선 과정을 정리하게 되었다.우선 모
프로젝트에서 로그인 회원가입 관련 로직을 전담하게 되었는데, 초기 구현을 끝내고 그냥 넘어가기에는 개선해볼 수 있는 사항이 너무 많아보여서 중간에 다른 구현은 제껴두고 리팩토링 시간을 가지게 되었다.처음 작성했던 이메일 Input 컴포넌트인데 보기에도 상당히 복잡해보인
리액트 19버전 출시를 앞두고 있는 지금, 어떤 기능들이 추가되는지 알아보기 위해 개인적으로 번역하며 읽어보았습니다. > RC? Release Candidate의 약자로, 소프트웨어 개발 주기에서 최종 출시 전에 공개되는 버전을 말한다. 안정성과 기능이 최종 버전에
오래된 사이드 프로젝트 에러들을 잡는 과정에서 다음과 같은 경고 문구가 나왔다.찾아보니 styled-component를 위해 넘겨준 props가 걸러지지 않고 DOM Element의 attribute에 넘겨졌고, DOM Element에서는 props에 해당하는 attr
우테코 프리코스를 진행 중 코드리뷰를 해드리면서 static 메서드와 인스턴스 메서드 중 어느 것이 적합한지에 대해 고민하게 되어 이를 정리해 보았다.의문을 가지게 된 코드는 다음과 같은데,사용자 입력을 담당하는 InputManager 클래스의 getCarName이 각
사이드 프로젝트를 다시 보면서 이미지 관련해서 적용해보고 싶은 것들이 있어 다시 건드리게 되었다.현재 API에서 모든 포켓몬은 1035마리로 각 포켓몬은 앞/뒤 모습을 이미지로 보여주고 있다. 뒷 모습의 경우 마우스를 호버해서 보여주지만 앞모습의 경우 모든 포켓몬의 이
기본값을 선언하기 위해 useState()의 인수로 원시값을 넎는 경우 가 일반적이다. useState의 인수로 함수를 넘겨줄 수 있다. 이를 게으른 초기화(Lazy Initialization)이라고 한다.일반적으로 이렇게 작성하는 경우 위 실행 화면 처럼 리랜더링이
우테코 프리코스를 보다 효과적으로 보내기 위해서 스터디를 만들었다. 다양한 활동 중에 매일 22시에 데일리 회고를 작성해서 올리기로 했는데, 22시마다 놓쳐 짧은 기간의 스터디 동안 참여율이 저조할 것 같아서 디스코드 알림 봇을 만들어 보기로 했다.기존에 만들어져 있는
useEffect 훅의 타입 정의는 아래와 같다.useEffect에서 EffectCallBack 함수 타입을 가지는 effect 인자는 아무것도 반환하지 않거나 Destructor를 반환한다고 한다.만약 effectCallBack 함수가 비동기로 쓰이게 되면, 콜백함
매일 면접 연습하기 > 웹 성능을 최적화하기 위한 핵심 지표(LCP, FID, CLS 등)에 대해 설명하고, 이러한 지표를 개선하기 위해 프로젝트에서 어떤 방법들을 사용했는지 구체적인 사례를 들어 설명해 주세요. 측정 척도 First Contentful Paint
가상 DOM의 동작 원리를 설명하고, 실제 DOM과의 차이점을 설명해 주세요. 또한, Virtual DOM을 사용하는 React의 렌더링 성능 최적화 방식에 대해 설명하고, shouldComponentUpdate 또는 React.memo와 같은 기법이 어떤 역할을 하는
Q. 자바스크립트의 event loop와 call stack의 동작 방식을 설명하고, microtask와 macrotask 큐의 차이점을 설명해 주세요. 이를 통해 비동기 코드가 실행되는 순서에 대해 설명해 주세요.→ 자바스크립트 함수가 호출되면 Call Stack에