게시글
질문&답변
3.1.3 14:00 정도부터 영상이 조금 이상합니다...!!
영상 편집 중에 잘못된 부분이 있었네요. 바로 수정했습니다. 제보해 주셔서 정말 고맙습니다. 다음 수업에도 이상한 점있으면 언제든 말씀 부탁드려요.
- 1
- 2
- 26
질문&답변
MyReact를 IIFE(즉시실행함수)로 설계하신 이유
함수 스코프 안에 관련 코드를 담으려고 즉시실행함수를 사용했습니다. 아래 ai 답변의 특징을 참고하시면 좋을 것 같습니다.하지만 프로젝트에서 웹팩을 사용하고 있어서 직접 ECMAScript 모듈 문법 시스템을 활용해도 될것 같습니다.// MyReact.js export function createContext() {} // 혹은 const MyReact = { createContext } export default MyReact
- 0
- 2
- 22
질문&답변
[4.4장 메모이제이션 훅] 4.4.3 memo 참조 비교
맞습니다. 수업에서는 JSX문법을 사용하기 때문에 프롭 인자 전달 값이 잘 보이지 않는데요. 자바스크립트로 바뀌면 이런 코드가 됩니다.// React.createElement(FilteredPosts, {posts: filterdPosts} )함수를 호출할 때마다 { posts: filteredPosts } 란 리터덜 표현식에 의해 새로운 값이 생성되는데요. 이 때문에 캐시한 프롭 객체와 다른 값으로 판단하는 것입니다.
- 0
- 1
- 37
질문&답변
class와 constructor를 이용한 객체 지향 프로그래밍
일종의 추상화 입니다. 우리가 어떤 사물이나 현상을 언급할 때 때 특성과 동작을 모두 설명할 수 있는데요. 간단히 이름을 사용해 표현할 수 있습니다. 가령 "코가 길고 귀가 크고 덩치가 큰 네 발 달린 초식 동물" 보다는 "코끼리"라는 이름을 사용하는 것처럼 말이죠. 리셋 버튼을 표시하고 사용자 입력을 처리하는 것을 SearchFormView라는 클래스로 추상화했습니다. 이러한 역할을 사용할 때 매번 해당 코드를 직접 작성하는 것보다는 이 역할을 담당하는 객체를 사용하면 훨씬 효율적입니다. 사람은 구현된 코드 보다는 추상화된 이름을 사용할수 있어서 좀 더 큰 규모의 로직을 다룰 수 있는 이점이 생깁니다.관련되서는 절차지향 프로그래밍과 객체지향 프로그래밍에 대해 공부하시면 도움이 되실 겁니다.
- 0
- 2
- 34
질문&답변
mvc 패턴 질문
사실 둘 다 사용하긴 합니다. 역할 별로 파일을 나눠서 쓰기도 하고요. src/ ├── controllers/ │ ├── controller1/ │ └── controller2/ ├── views/ │ ├── view1/ │ └── view2/아니면 페이지별로 파링르 나누고 각 페이지 안에서 역할에 해당하는 파일을 구성하기도 해요.src/ ├── page1/ │ ├── page1-controller/ │ └── page1-view/ ├── page2/ │ ├── page2-controller/ │ └── page2-view/ 상황에 따라서 둘 중 하나를 선택하거나 섞어서 사용하기도 하는데요. 가장 중요하건 본인한테 편한 방식이라고 생각합니다. 혹은 팀에서 협의한 방식을 지키는 것이 협업에 유리합니다.
- 0
- 2
- 43
질문&답변
eslint
이것도 사용하신 패키지 버전이 수업에서 사용한 것과 다른 게 원인 같습니다.수업에서 사용한 패키지 버전과 비교해 보시고 다르다면 이 버전으로 맞춰서 시도해 주세요.https://github.com/jeonghwan-kim/lecture-frontend-dev-env/blob/master/package.json
- 0
- 3
- 72
질문&답변
도와주세요!
현재 사용하시는 패키지 버전을 먼저 확인해 보세요. 수업에서 사용하지 않은 최신 버전을 사용하면 이런 현상이 있을 수 있습니다. 수업에서 사용한 패키지 버전입니다.https://github.com/jeonghwan-kim/lecture-frontend-dev-env/blob/master/package.json만약 버전이 다르다면 수업에서 사용한 버전으로 맞춰서 다시 시도해 보시기 바랍니다.
- 0
- 2
- 39
질문&답변
useRef 관련하여 질문드립니다
useRef()로 만든 ref2는 {current: undefined} 값이 할당됩니다. 이 값을 input의 ref 속성에 전달하는데요. react-dom 에서 제공하는 이 특별한 ref 에 의해 ref2.current 에 돔 앨리먼트가 할당되어서 접근할 수 있습니다. 아래 ai 답변도 참고하시면 도움이 될 것 같습니다.
- 0
- 2
- 41
질문&답변
렌더 프롭 관련하여 질문드립니다
컴포넌트의 역할을 1) 상태 관리와 2) 리액트 앨리먼트 관리라고 볼 수 있는데요. 이런 경우도 있을 것 같습니다. 상태를 관리하지만 리액트 앨리먼트는 다른 경우. 컴포넌트가 상태 관리하는 역할만 하는 거죠.이러한 상황은 리액트 컨택스트에서도 마찬가지인데요. 이벤트 에미터의 상태는 관리하지만 이 값을 가지고 렌더링하는 로직은 외부에 두고 싶습니다.컴포넌트가 직접 앨리먼트를 만들어 렌더링 하지 않고 외부로 위임할 때 리액트 앨리먼트를 반환하는 함수를 프롭으로 사용할수 있는데요. 이를 렌더 프롭이라고 부릅니다. 아래 AI 답변과 리액트 문서를 참고하시면 도움이 되실겁니다.
- 0
- 2
- 57
질문&답변
delegate, emit 필요한 이유
delegate는 하나의 요소에 이벤트 핸들러를 설정해 여러 자식 요소에서 발생하는 이벤트를 관리하는 역할입니다. 각 요소에 직접 바인딩하는 기법에 비해 한번에 여러 요소의 이벤트를 처리할 수 있는 장점이 있습니다. emit는 요소에게 이벤트를 전달하는 함수인데요. 보통 객체 간의 값을 전달하려면 함수를 호출하는 게 일반적입니다. 객체를 직접 참조할 수 있는 경우에는 이렇게 함수 인자로 전달할 수 있습니다. 하지만 멀리 떨어진 경우에는 함수를 호출하지 못하는데요. 이벤트를 사용하면 시점, 객체 거리와 상관없이 호출할 수 있는 유연함이 있습니다. 아래 ai 답변도 참고하시면 이해하시는데 충분히 도움이 될 것 같습니다.
- 0
- 2
- 61