분류 전체보기

로그인을 성공하면 서버에서 accesstoken과 refreshtoken을 응답 헤더로 넘겨준다.프론트에서는 이 토큰들을 recoilPersist를 통해 sessionStorage에 저장해 사용자가 다른 페이지로 이동할때에도 토큰들을 사용하여 인증된 사용자 요청을 보낼 수 있도록 하였다.(recoilPersist를 이용하지 않고 저장하면, 페이지를 새로고침하거나 다른 페이지로 이동할때 저장한 토큰들이 다 날아가버린다.) 1.  토큰 상태 생성State폴더 안에 Atom.ts파일을 만들어서 관리하였다.persistAtom에 저장된 토큰들을 모두 sessionStorage에 저장한다.localStorage와 sessionStorage의 차이점은 페이지를 닫을 때 데이터들이 사라지는지의 여부이다. 진행 중인 ..

현재 진행중인 프로젝트에서 간단한 회원가입 양식을 Axios를 통해 서버로 POST요청을 보내보았다.프로젝트는 Styled-component와 Vite를 사용해 TypeScipt로 구현하고 있다. POST요청시에 발생했던 CORS에러를 클라이언트에서 처리하는 방식도 간단히 언급해보려고 한다.   먼저 기본적인 회원가입 데이터를 입력하는 양식을 아래 코드와 같이 작성하였다.// 회원가입 양식return( 이름 아이디 비밀번호 ..

useCallback보통 React 컴포넌트의 렌더링이 일어날 때, 함수형 컴포넌트 내부의 함수들은 매 렌더링 시 새롭게 생성된다. 이는 불필요한 자식 컴포넌트들의 재랜더링으로 이어질 수 있는데 useCallback은 이러한 문제를 해결하기 위해 사용된다. usecallback은 함수를 캐싱해서 재사용한다. 따라서 컴포넌트가 재실행 될때, 함수 내의 변수들이 초기화(새롭게 생성)되지 않는다.usecallback을 사용하면 함수 메모리의 주소가 객체에 할당된다. 컴포넌트가 렌더링될때 새로운 주소가 할당되는 것이 아니라 이전에 저장했던 주소가 계속 사용되는 것이다. useCallback(() => { }, []); : 기본적으로 콜백함수와 의존성배열을 인자로 받는다. const [category, setCa..

인터럽트란 ? CPU가 특정한 이벤트에 대응하기 위해 발생하는 신호이다. 인터럽트는 CPU가 효율적으로 일을 하기위해 발생한다. 특정 프로세서가 "내 영역에서 해야할 일은 끝났어, 이제 CPU의 도움이 필요해!"하며 CPU에게 작업을 처리해달라고 인터럽트 신호를 보내면 CPU가 하던 일을 잠시 멈추고 요청받은 인터럽트를 처리하게 된다. 인터럽트의 종류 인터럽트의 종류는 크게 2가지로 분류된다. 하드웨어 생성 인터럽트: 입출력 완료와 같이 하드웨어 장치가 CPU에게 작업처리를 요청하는 인터럽트이다. 소프트웨어 생성 인터럽트: 0으로 나누기 또는 유효하지 않은 메모리 접근와 같은 예외(exception)나 트랩(trap) 혹은 시스템 콜이 있다. 인터럽트 구동방식 일반적으로, 각 장치 컨트롤러에는 장치드라이..

https://leetcode.com/problems/single-number/  Single Number - LeetCodeCan you solve this real interview question? Single Number - Given a non-empty array of integers nums, every element appears twice except for one. Find that single one. You must implement a solution with a linear runtime complexity and use only constantleetcode.comGiven a non-empty array of integers nums, every element appears ..

백준 1157 결과 단순한 문제인데 접근을 아스키 코드를 사용하는 방식으로해서 빙빙 돌아간것 같다. 게다가 파이썬의 함수를 익히지 못한결과 매우 1차원적인 코드를 작성했다.. 시간 차이가 5배라니.. 잘 짜여진 다른 사람의 코드를 참조하는건 필수인 것같다. c언어로 짠 것 같은 첫번째 코드 s = input() cnt = [0]*26 # A-Z까지 빈 배열 생성 # 대소문자 구분없이 알파벳 사용횟수 저장 for i in range(len(s)): if( ord(s[i])>96): index = ord(s[i])-97 cnt[index] += 1 else: index = ord(s[i])-65 cnt[index] += 1 max_index =cnt.index(max(cnt)) # 최댓값 중복 확인 for ..

알고리즘 배낭의 최대가치를 결정하는 과정은 크게 두 가지의 경우로 생각할 수 있다. 배낭의 무게보다 물건의 무게가 더 크면 물건을 넣지 않는다. 그렇지 않다면 배낭의 가치를 측정한다. (이전 물건이 있으면 전부 빼고) 새로운 물건을 넣는다. 그리고 배낭의 무게에서 새로운 물건의 무게를 뺐을 때의 배낭의 최대 가치를 고려한다. 새로운 물건을 넣지 않고 이전 배낭을 그대로 가져간다. 어떤 자료구조를 사용해야 할까? 일단, 배낭에 물건을 넣거나 빼면서 배낭의 최대가치를 결정해야 하므로 각 물건의 무게와 가치를 저장할 2차원 배열이 필요하다. i \ j 0 1 0 a의 무게 a의 가치 1 b의 무게 b의 가치 2 c의 무게 c의 가치 이를 obj[i][j]로 정의하겠다. 그리고 배낭의 무게와 물건에 따른 배낭의..

진행중인 프로젝트에 react router v6.4를 사용하면서 createBrowserRouter와 에 대해 정리해보았다. createBrowserRouter()와 간단히 설명하면, createBrowserRouter에서 경로를 모두 지정하여 RouterProvider의 router에 전달하는 방식이다. import { createBrowserRouter, RouterProvider,} from "react-router-dom";const router = createBrowserRouter([ { path: "/", element: , loader: rootLoader, children: [ { path: "team", element: , ..