FrontEnd
![[JS] 행렬과 연산](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbEy4zv%2FbtsHaeBCdvR%2F6duhwYaQsdH1vucO5SKFIk%2Fimg.png)
[JS] 행렬과 연산
Deque를 활용하여 해결하였다. https://school.programmers.co.kr/learn/courses/30/lessons/118670 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.kr 문제 자체는 단순했다. 행렬을 밑으로 밀어내거나 시계방향으로 회전하는 기능을 구현하면 되었다.단, 시간복잡도를 생각해야 하는 문제이다. 행렬을 밑으로 밀어내는 것 자체는 어렵지 않다. Deque로 쉽게 구현할 수 있다. 시계방향으로 회전하는 기능또한 Deque로 구현할 수 있다. 이 두가지를 동시에 할 수 있게 하기 위해 Deque를 아래와 같이 조금은 특이하게..
![[JS] 매출하락 최소화 (2021 카카오)](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fn9XBV%2FbtsG4Bdh7JH%2FIKTG9FAiCrfapcekaqZNt0%2Fimg.png)
[JS] 매출하락 최소화 (2021 카카오)
tree + dp로 해결할 수 있는 문제였다. https://school.programmers.co.kr/learn/courses/30/lessons/72416 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.kr 트리구조와 DP를 활용하면 해결할 수 있는 문제이다. 문제를 처음 읽었을때의 생각은 선택을 했거나, 안했거나를 나누어서 계산을 하는 거였다.(결과적으로 완전 틀린 접근은 아니었음) 다만 완전탐색으로 이를 해결하기에는 300,000명까지 사원이 있기에 불가능 했다. 주의를 둘 점은 트리구조이기 때문에 1번노드에서 단방향으로 퍼져나가는 구조라고 생각할 ..
![[React] 리액트 19 beta 변경점 알아보기](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fvy1SQ%2FbtsGYyPHR2V%2FPfhCKYmyURZXLHnkRZCET1%2Fimg.png)
[React] 리액트 19 beta 변경점 알아보기
리액트 19 Beta 버전이 4.25일 이틀전에 나왔다! 리액트 팀에서 19에 어떤 변경사항을 적용할지 알아보자. 본 글은 리액트 팀블로그를 참고했다.https://react.dev/blog/2024/04/25/react-19#improvements-in-react-19 React 19 Beta – ReactThe library for web and native user interfacesreact.dev 먼저 크게 보면 아래 항목들을 중점적으로 개발한 것 같다. 1. 비동기 작업의 편의성 ( 동시성에 초점을 둔게 느껴진다 )2. ref 개선3. 성능 개선 1. useTransition에서 비동기 함수 지원useTransition은 startTransition으로 감싼 상태변화의 우선..
[JS] 사칙연산
까다로운 DP문제였다. https://school.programmers.co.kr/learn/courses/30/lessons/1843# 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.kr 이전부터 느낀거지만 이런 유형의 DP가 정말 까다로운 것 같다. 문제에서 제공한 1번예제를 분석해보면서 풀이를 생각해보자. ["1", "-", "3", "+", "5", "-", "8"] 먼저 i,j를 왼쪽부터의 인덱스라고 생각해보자. 예를들어 i : 0, j : 1 이라면 1-3까지를 나타낸다고 생각해보자. 그리고 i와 j의 차를 step이라고 생각해보자. ij수0011..
![[React] 부모, 자식 컴포넌트 리렌더링 관계 (props,state)](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbAaJk9%2FbtsGBgtgXsE%2F0RZyjKKd2Lz2F0yOBxcR1K%2Fimg.png)
[React] 부모, 자식 컴포넌트 리렌더링 관계 (props,state)
리액트는 보통 부모 -> 자식 방향의 단방향 정보전달의 구조를 이루고 있다. 따라서 자식 컴포넌트에서 정보가 변하지 않고 부모 컴포넌트에서만 값이 변해도 자식 컴포넌트가 같이 렌더링 되는 불필요한 과정이 있다. 이를 해결하기 위해서 memo, useMemo, useCallback 등을 사용할 수 있는데 실제로 리랜더링을 얼마나 막아줄 수 있는지와 props로 객체가 전달되었을 경우에 대한 이해를 여러가지 케이스들을 실험해 보며 정리해 보자. 1. 세팅 먼저 간단한 프로젝트를 CRA를 활용해서 만들어 보았다! npx create-react-app react-render --template typescript components라는 폴더를 만들고 간단하게 부모 컴포넌트, 자식 컴포넌트를 만들어준다. //Ap..
![[JS] 지형 이동](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FlSmTW%2FbtsF9CLdyBg%2Fc9pJgqgxwI6XrFA8tGAz80%2Fimg.png)
[JS] 지형 이동
union-find를 응용해서 해결하였다. https://school.programmers.co.kr/learn/courses/30/lessons/62050 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 사실 어느정도 문제에서 힌트(?)가 있다. 아래와 같이 일종의 팀을 짜는 것이 중요하다. 즉, 서로 건너건너서 사다리 없이 갈 수 있는 공간을 한 팀이라고 생각했다. 이런경우 바로 떠오르는 방법이 유니온-파인드 알고리즘이었다. 따라서 문제푸는 방법자체는 아래와 같이 간단하게 정리되었다. 1. 유니온-파인드로 팀분리하기 2. 팀에서 다른팀으로 넘어가는 최소..