주특기 회고
Q1. s3 버킷에 배포한 뒤, 어떤도메인.com이 아닌 어떤도메인.com/login 등 페이지로 이동하면 왜 오류가 날까요?
- 리액트의 라우팅 방식이 전통적 링크 방식이 아니기 때문. (전통적 링크 방식의 경우 주소창에 적힌대로 html 파일을 받아 보여준다면, SPA는 하나의 html을 두고 주소창에 적힌 대로 내용을 갈아끼우는 방식)
- s3 버킷의 정적 웹사이트 호스팅은 /login 경로에 맞는 html을 찾는 거고, 해당 html파일이 없기 때문에 404 에러가 나는 것.
- 에러 해결 방법은? s3가 어떤 상황이건 index.html을 보도록 설정해주는 것
Q2. 리액트에서 각 페이지 컨텐츠에 맞는 미리보기(사이트 이미지, 사이트 설명 등)를 띄워주려면 어떻게 해야할까요?
- 메타 데이터를 직접적으로 index.html에 추가하는 방법이 있지만, 이는 SPA인 리액트에서 조건에 따라 동적으로 변경하기 어려운 단점이 있다.
- 따라서 react-helmet 라이브러리를 사용하여 조건에따라 동적으로 메타 데이터를 변경시켜 각 페이지의 컨텐츠에 맞는 미리보기를 띄워준다.
Q3. 리덕스에서 미들웨어 청크의 역할은 뭘까요?
- 비동기 작업을 처리할 때 사용하는 미들웨어로 이를 사용하면 액션 객체가 아닌 함수를 디스패치 할 수 있게 된다.
Q4. 프로미스는 정확히 말하면 비동기가 아닙니다. 비동기와 프로미스는 각각 무엇일까요?
-
비동기(Asynchronous)적 처리는 작업을 요청하지만 결과는 그 자리에서 꼭 받지 않아도 되는 데이터 처리 방식이다.
-
Promise는 비동기적으로 실행하는 작업의 결과(성공 or 실패)를 나타내는 객체이다. 여기서 주목해야 하는 점은 객체 라는 것인데, 비동기의 결과를 객체화 시킨다는 점이 Promise의 가장 큰 장점이자 특징이 된다.
- Promise 성공시 then 메소드가 실패시 catch 메소드가 실행된다.
-
비동기는 데이터 처리 방식이고 promise는 비동기 작업의 단위.
Q5. TDZ(Temporal Dead Zone/일시적 사각지대)란?
- 우선 선언을 하면 실행 컨텍스트가 내용을 훑는데 여기서 초기화 작업이 일어난다. 초기화 작업은 메모리에 변수에 들어갈 공간을 미리 확보해 놓는 것이다. 때문에 변수가 선언되기 전에 사용한다는 것은 메모리 공간을 확보하기 전에 사용한다는 것이고 그렇기에 ReferenceError가 난다. 이렇게 변수가 선언되기 전, 호출할 수 없는 공간을 TDZ라고 부른다.
동기와 비동기
- 동기는 요청과 결과가 동시에 일어난다.
- 직렬 구조를 가지고 있고 요청 후 결과를 받아야만 다음
동작이 일어난다.
- 결과가 주어질 때까지 아무것도 못하고 대기를 해야하는 단점이 존재한다.
- 비동기는 요청과 결과가 동시에 일어나지 않는다. 시간이 걸리더라도 그 사이에 다른 작업이 가능하여 자원을 효율적으로 쓸 수 있는 장점
- 비동기에서의 블록은 결과를 계속 기다리는 것, 논블록은 다른 작업을 하면서 기다리는 것
리덕스를 왜 쓰는지
- 리덕스를 왜 쓰는지에 대해 깊게 생각하지 못하다가 진성님이 해주시는 말을 듣고 다시금 왜 생각하게 되었다.
- 부모 컴포넌트에서 자식의 자식의 ... 자식 컴포넌트에 props를 넘겨주는걸 리덕스를 사용하면 한 번에 줄 수 있다는 것 왜 이걸 잊고 있었을까 싶다~~
오늘의 TMI
- 이 코드가 어디서 오고 어디서 쓰이고 어디로 가는지에 대해 생각을 해야하는 연습을 하자. 감사합니다 승민님
- 혜원님의 실력이 하위권이라는 것은 부정할 수 없겠지만 실력에 굴하지 않고 다른 사람의 의견을 듣기위해 사람들 앞에서서 발표를 한다는 것에서 큰 감동을 먹었다.
- 하나의 function은 하나의 목적