Next3 [220510] Next.js란? Next.js란? : 리액트 라이브러리의 프레임워크 라이브러리 단순활용이 가능한 도구들의 집합. 직접 들어서 사용하고 제어한다는 느낌이 강함. 프레임워크 소프트웨어의 특정한 문제를 해결하기위해 상호협력하는 클래스와 인터페이스의 집합. 안에 들어가서 사용한다는 느낌이 강함. 사용하는 패턴이 정해져있고 벗어날 수 없다. Next.js의 장점 1. SSR이 가능하다. SSR (Server-Side Rendering) 데이터를 먼저 받고 컴포넌트와 함께 한꺼번에 실행해서 hmtl을 그려냄. 브라우저-프론트-백 통신방법 -> 싱글페이지 어플리케이션 x CSR (Client Side Rendering) 컴포넌트를 먼저 실행하고, 데이터를 나중에 받아서 넣어야할 데이터만 바꿔넣는 방법. 단점 : 검색봇(SEO)에 걸.. 2022. 5. 13. [220504] 미들웨어) redux-thunk 디렉토리 구조 미들웨어란? dispatch가 reducer를 실행시켜서 state를 반환하려고할때 그 중간을 가로막는 함수라고 생각하면 된다. 미들웨어의 종류 - 1. thunk : 함수를 디스패치 해주는 미들웨어 핵심은 10줄짜리인 짧은 코드. 그만큼 사용하기 쉽고 잘못짜면 터짐. 짧은 코드인만큼 기능이 없으면 내가 만들어서 사용해야함. action 객체가 아닌 함수를 dispatch할 수 있음. action에 응답을 줄 수 없다. 미들웨어의 종류 - 2. saga : 특정 작업이 이루어지는 액션에 대한 리스너 thunk보다 길고 규칙에 따라 사용해야해서 자유성이 적다. 하지만 기능이 thunk보다 많고 규칙을 지켜야해서 이슈가 적다. 액션을 모니터링하고 있다가 특정 액션이 발생했을 때, 미리 정해둔.. 2022. 5. 10. [220502] redux로 전역상태 관리하는 기초세팅 state 관리를 위한 redux 액션이란 이벤트를 통해 상태를 관리하고 업데이트하기 위한 패턴 및 라이브러리인 redux. 예측 가능한 방식으로만 업데이트 될 수 있도록 하는 규칙과 함께 전체에서 사용해야 하는 상태에 대한 중앙저장소 역할을 함. Context API와 비슷한데 왜 Redux를 더 많이 사용할까? 1. 전체적으로 사용하는 state가 언제 어디서 어떻게 업데이트 되는지 자세하게 추적이 가능하다. 2. Context API와 다르게 redux는 미들웨어가 있어서 비동기처리가 가능하다. redux의 reducer가 state를 바로 반환하지 못하고, 미들웨어를 거쳐야 반환이 가능하다 예) 로그인 시도 -> 미들웨어 (성공액션, 실패액션, 에러액션) -> 결과에 따른 state 반환 Redu.. 2022. 5. 9. 이전 1 다음
