stonesy

React Router단계1. react router 설치npm install react-router-dom 2. src/main.jsx 또는 src/main.tsx 파일을 열어 React Router의 BrowserRouter로 애플리케이션을 감싼다.import React from 'react'import ReactDOM from 'react-dom/client'import { Provider } from 'react-redux';import { store } from './app/store';import { BrowserRouter } from 'react-router-dom'import App from './App.jsx'ReactDOM.createRoot(document.getElementById..

Custom HookCustom Hook은 다음과 같은 경우에 사용하면 좋다고 한다.재사용성: 여러 컴포넌트에서 동일한 로직을 반복해서 사용하는 경우, Custom Hook으로 분리하면 코드를 재사용할 수 있어 유지보수가 용이하다.컴포넌트 가독성 향상: 컴포넌트 내부에 비즈니스 로직이 많아지면 가독성이 떨어질 수 있다. Custom Hook으로 로직을 분리하면 컴포넌트가 더 깔끔하고 이해하기 쉬워진다.단일 책임 원칙: 컴포넌트가 한가지 책임만 가지도록 하기 위해 Custom Hook을 사용해 로직을 분리하면 좋다. 이렇게 하면 각 컴포넌트가 명확한 역할을 가지게 되어 코드의 유지보수가 쉬워진다.상태 관리와 부수 효과 처리: 복잡한 상태 관리나 부수 효과(side effects)를 처리할 때, Custom..

CRA란 JavaScript로 구성된 Webpack(웹팩)을 사용하는데 속도가 느린편이다. 코드의 양이 많아질수록 느린 속도를 체감할 수 있다. 위의 단점을 해결하기 위해 Esbuild를 기반으로 만들어진 빌드툴인 vite를 사용한다.*Esbuild: Go 언어로 작성된 JavaScript 빌드툴, 속도가 빠름 📌Webpack과 Vite의 차이점개발서버Webpack: 소스 코드와 모든 종속 관계의 모든 번들링 후 서버가 준비된다.Vite: Esbuild로 미리 번들링한 모듈을 필요할 때 동적으로 가져오기 때문에 즉각적으로 서버가 구동된다.프로덕션 빌드Webpack: 각 모듈을 범위마다 함수로 매핑하여 결합한다.Vite: 하나의 파일에 모든 종속 모듈을 전역 범위로 선언하여 결합한다. 중복을 제거하기 때..

🔎재사용 가능한 & 일관성 있는 컴포넌트 만들기버튼 컴포넌트를 재사용 가능하게 + 일관성 있게 만들어보자. 1. 목표/요구사항1) 버튼의 shape은 항상 동일해야 한다.버튼의 전체적인 모양은 변하지 않아야 한다. 즉, 어떤 크기를 갖든, 어떤 색을 갖던지 간에 border-radius, padding 값에 대한 속성들은 고정되어 있어야 한다. 2) variant props을 통해 preset된 색상을 선택할 수 있어야 한다.일관성 있는 디자인을 구현하기 위해 제한적으로 props를 통해 정의된 스타일을 적용할 수 있도록 만든다.미리 정의된 색을 variant라는 props을 이용하여 선택할 수 있도록 만든다. 3) size props를 통해 preset된 크기를 선택할 수 있어야 한다.색상과 마찬가지..

package LinkedList;import java.io.BufferedReader;import java.io.InputStreamReader;import java.util.StringTokenizer;class Solution_1230_D3_암호문3 { public static int N; public static int M; public static Node head; public static Node tail; public static BufferedReader br = new BufferedReader(new InputStreamReader(System.in)); public static StringTokenizer st; public static clas..

다익스트라 알고리즘최단경로 → 다익스트라(Dijkstra) 알고리즘다익스트라 알고리즘은 한 정점에서 각 정점까지의 최단경로를 찾는 알고리즘으로 우선순위큐를 사용하는 경우 O(MlogN)의 시간복잡도를 가진다.(이때, N: 정점의 개수, M: 간선의 개수)  로직초기화시작 정점까지의 거리는 0으로 초기화후, 우선순위 큐에 넣음시작 정점 외의 다른 정점까지의 거리를 무한대로 초기화(dist 배열)인접한 정점의 거리 update우선순위큐에서 정점을 뽑아, 현재 정점으로 설정현재 정점에서 인접한 정점까지의 거리 update(시작 정점 → 인접한 정점까지의 거리보다 현재 정점을 거쳐서 가는 경우가 더 빠르다면, dist 배열을 초기화하고 우선순위큐에 넣음)우선순위큐가 빌때까지 2번을 반복 코드import java..

처음에는 슬라이딩 윈도우 기법으로 풀었으나 이 경우 시간복잡도가 O(N^2)으로 N의 최대값이 10^6이기 때문에 시간초과가 발생했다.import java.io.BufferedReader;import java.io.IOException;import java.io.InputStreamReader;import java.util.Arrays;import java.util.StringTokenizer;public class Main { static int N,M; static int[] numbers; static int answer; public static void main(String[] args) throws IOException { BufferedReader br = ..