reactjs (3) 썸네일형 리스트형 React, 절대 경로 import 리액트를 사용하다보면 만들어 놓은 컴포넌트를 import 할 때default 값이 상대경로이기 때문에 다음과 같은 경우를 마주하게 됩니다,,import { Button } from '../../components'; 디렉토리 구조가 복잡해질 경우 경로를 일일이 계산하는게 번거롭기 때문에절대경로로 사용하는 편이 간단할 때도 있습니다. 절대경로로 설정하는 방법은 의외로 간단합니다. 1. JavaScript1. 프로젝트 루트 디렉토리에 jsconfig.json 파일 하나를 먼저 만듭니다 (보통 만들어져 있다).{ "compilerOptions": { "baseUrl": "src" }, "include": ["src"]}2. 생성한 json파일 안에 compilerOptions key 값에 "base.. JWT, NodeJS와 React를 통해 구현해보기 (2) Installation Packagesnpm install axiosnpm install jsonwebtokennpm install express라이브러리 설치 이외에 쿠키 설정할 때 잘 되지 않는다면 Cookie parser 미들웨어를 사용하고환경변수를 사용하기 위해서는 dotenv 미들웨어를 사용하면됩니다.SecretKey인터넷에서 해쉬 생성기를 통해 임의로 생성하거나Crypto 라이브러리를 이용해 임의의 SecretKey를 생성하고일반적으로 .env파일에 환경변수로 저장하여 사용합니다.Login Page, ReactJSimport React from 'react';import axios from 'axios';import { useRef } from 'react';const Login : React.. ReactJS, Redux 개념 및 동작원리 What is Redux Redux는 Actions이라 불리는 이벤트를 통해 상태관리 라이브러리이자 패턴이다. Redux는 중앙집권화된 store를 통해 어플리케이션 전역상태를 관리하는 방식이다. Why Should I Use Redux?일반적으로 컴포넌트에서 props를 통해 데이터를 자식 컴포넌트에게 넘겨주는데자식의 자식의 자식의 자식의 자식의 자식의 자식...이런 과정이 백 번 반복되어서 데이터를 전달해줘야한다면,,? 전역 변수처럼 사용할 수 있는 데이터들이 있다면 이러한 문제가 쉽게 해결되지 않을까라는 것에서 기인한 것입니다. Redux FlowRedux Store Redux Store는 내 어플리케이션의 전역 상태를 가지고 있는 유일한 컨테이너입니다. Store는 하나의 오브젝트와 몇가지 기능을.. 이전 1 다음
