안녕하세요 강사님 강의를 복습하면서 SSR과 CSR에 대해서도 같이 공부를 하는 와중에 궁금증이 생겨서 질문을 올리게 되었습니다. 궁금한 것과 질문이 많아서 최대한 대답하기 쉽게 번호를 먹여서 적었습니다. 대답을 잘 들어보고싶어 꽤 오랜시간 고민하며 작성했네요 ㅠ 바쁘시겠지만 답변부탁드립니다.. 2. 본 프로젝트에서 CSR과 SRR의 의미에 대해서 생각을 해보았는데 혹시 이 것이 맞는지요? 2-1. 우리 프로젝트의 경우 CSR 에서는 프론트 서버(CRA), 벡 엔드서버(익스프레스)로 구성된다고 할때, 브라우저가 요청을 보내면 프론트 서버는 브라우저의 요청을 처리한 후 브라우저에게 필요한 HTML, JS, CSS, 기타 정적파일(이미지, 비디오..)를 보내준다. 그리고 브라우저는 이를 해석해서 렌더링한다 2-2. 만일 우리 프로젝트가 SSR이라면 SSR 에서는 프론트 서버(NEXT), 벡 엔드서버(익스프레스)로 구성된다고 할 때, 브라우저가 요청을 보내면 프론트 서버가 온갖 처리를 다 한후에 최종적으로는 HTML과 기타 정적파일(이미지, 비디오..)만을 보내게 된다. HTML을 받은 브라우저는 이를 화면에 띄운다. 본인이 렌더링하진 않는다. 3. 저는 SSR이 HTML만을 결국엔 보내게 된다는 것을 이해했는데 사실 리액트를 통한 프로젝트를 할 때 구글 개발자 도구 network tab을 보면 그렇지가 않은 것 같습니다. index.js(next의 경우) 또는 0.chunk.js(cra의 경우)라는 파일과 잡다한 것들도 같이 보게 됩니다. 즉 html과 js와 css는 어디갔느냐 이 말입니다.. 위에 있는 index.js, 0.chunck.js과 같은 파일이 html과 js와 css를 하나로 통합한 파일인 겁니까? 이 과정에서 리액트가 하는 역할을 무엇이죠? 5. 마지막으로 제가 그린 그림이 있는데요 ( 아래첨부) 여기에서 노란색 박스에 대한 질문이 해결이 안됩니다.. ㅠ 요청에 대한 응답으로 SSR과 CSR에서 보내는 것이 리액트를 사용했을 때와 사용하지 않았을 때의 차이와 그것을 브라우저에서 해석하는 방법에 대한 답을 얻어 볼 수 있을까요? 양질의 강의 항상 감사드립니다. 긴 글 읽어주셔서 감사합니다.
CSR와 SSR의 의미를 공부해보면서 느낀게, 우리 프로젝트의 정확한 아키텍쳐가 어떤지에 대해서 이해가 잘 가지않습니다.. 궁금한 것과 질문이 많아서 최대한 대답하기 쉽게 번호를 먹여서 적었습니다. 바쁘신 제로초님께 대답을 잘 들어보고싶어 꽤 오랜시간 고민하며 작성했네요 ㅠ 바쁘시겠지만 답변부탁드립니다.. 1. 서버가 모든 페이지를 그려서 던져주는 것이 SSR 이라고 하셨고 우리는 SRR 프레임워크인 NEXT를 쓰니 우리 프로젝트는 2번째 구조가 맞나요? 2. 본 프로젝트에서 CSR과 SRR의 의미에 대해서 생각을 해보았는데 혹시 이 것이 맞는지요? 2-1. 만일 우리 프로젝트가 CSR이라면 CSR 에서는 프론트 서버(CRA), 벡 엔드서버(익스프레스)로 구성된다고 할때, 브라우저가 요청을 보내면 프론트 서버는 브라우저의 요청을 처리한 후 브라우저에게 필요한 HTML, JS, CSS, 기타 정적파일(이미지, 비디오..)를 보내준다. 그리고 브라우저는 이를 해석해서 렌더링한다 2-2. 본 프로젝트의 경우 SSR 에서는 프론트 서버(NEXT), 벡 엔드서버(익스프레스)로 구성된다고 할 때, 브라우저가 요청을 보내면 프론트 서버가 온갖 처리를 다 한후에 최종적으로는 HTML과 기타 정적파일(이미지, 비디오..)만을 보내게 된다. HTML을 받은 브라우저는 이를 화면에 띄운다. 본인이 렌더링하진 않는다. 3. 저는 SSR이 HTML만을 결국엔 보내게 된다는 것을 이해했는데 사실 리액트를 통한 프로젝트를 할 때 구글 개발자 도구 network tab을 보면 그렇지가 않은 것 같습니다. index.js(next의 경우) 또는 0.chunk.js(cra의 경우)라는 파일과 잡다한 것들도 같이 보게 됩니다. 즉 html과 js와 css는 어디갔느냐 이 말입니다.. 위에 있는 index.js, 0.chunck.js과 같은 파일이 html과 js와 css를 하나로 통합한 파일인 겁니까? 이 과정에서 리액트가 하는 역할을 무엇이죠? 4. 생각해보면 SSR이 더 손해라는 생각이 들어요. 물론 APP의 특성에 따라 다르겠지만, CSR은 첫 로딩의 패널티가 있지만, 그 후에는 더 빠르고 좋은 사용자 경험을 주는 것 같거든요. NEXT를 쓰면 매번 요청을 보내면 서버의 상황에 따라서 굉장히 느릴 수도 있고, 올때까지 오매불망 기다려야 하는 문제가 있습니다. NEXT는 그러면 그런 문제에 대해서는 어떤 대책을 내놓고 있죠 ? 혹시 첫 페이지를 로딩한 후 부터는 CSR을 적용하는 방식도 가능한가요? 5. 마지막으로 제가 그린 그림이 있는데요 ( 아래첨부) 여기에서 노란색 박스에 대한 질문이 해결이 안됩니다.. ㅠ 요청에 대한 응답으로 SSR과 CSR에서 보내는 것이 리액트를 사용했을 때와 사용하지 않았을 때의 차이와 그것을 브라우저에서 해석하는 방법에 대한 답을 얻어 볼 수 있을까요? 양질의 강의 항상 감사드립니다. 어렵지만 매일 성장하는 기분이 들어서 좋습니다. 긴 글 읽어주셔서 감사합니다.
as-is : todoItem.completed = !todoItem.completed; to-be : this . todoItems [ index ] . completed = ! this . todoItems [ index ] . completed ; 컨테이너에서 관리하는 배열 요소에 접근해서 변경하는거랑 todoItem에서 직접 변경하는 차이가 명확히 이해가 안돼요.. props로 내린 데이터를 이벤트버스로 받아서 다시 변경하면 좋지 않다...컴포넌트간 경계를 확실히 하기위해서 ~ 그래서 배열 요소에 접근하는게 좋다. 이렇게 1차적으로만 이해가 되는데 아리송하네요ㅠ 나중에 vuex? 부분을 학습하면 왜 그런지 알게 되는건지..
3번째 파트 시작하고 bright and contrast 2 까지 내용이 맞고 bright&contrast3 부터 level이라고 나와요 이거 하나씩 앞으로 당겨저서 업로드 된건가요? 그래서 curve1 에서 curve2가 나오고 curve2에서 hue&saturation이 나와요
학부때 자바를 공부하긴 했으나, 빌드 툴, 메이븐, 그래들에 대한 개념이 많이 없는데, 선생님 입문 강좌의 기본 요구 지식을 보니 빌드 툴에 대하여 이해하는 것을 전제한다고 하셔서요, 혹시 저런 것들을 모른 채로 수강하기엔 버거운 강의일까요?? 그리고 저런 빌드 툴에 대해서는 어떤 공부를 하면 많이 다뤄볼 수 있을까요??
해당 강좌를 진행하던 중 처음 w_connect window 창에서 접속하기 버튼을 누르면 NameError: name 'sock' is not defined 이라는 에러가 발생하더라구요. 이유를 찾다보니 send_button의 인자 중 command=send_message() 로 작성되어있어 에러 발생하였던 것이고 command=send_message 로 수정하니 에러 발생 없이 동작을 합니다. command=send_message() command=send_message 어떤 차이점이 있으며 해당 예제에서 각각 어떻게 동작을 하는건지 궁금합니다.. 에러를 수정하긴 했으나 왜 위에는 안되고, 밑에는 되는지 이해가 잘 가지 않아 질문드립니다.. ㅠㅠ 항상 친절한 답변 감사드립니다.
질문 1: 컴포넌트가 클래스의 집합 이니까 컴표넌트 변수도 클래스 변수라고 생각해도 될까요? 질문 2: float speed=10f; Rigidbody MyRigidbody; void start { MyRigidbody.AddForce(0,500,0); } 이러한 스크립트를 하이어라키 창의 Player(오브젝트)에 넣은 다음 Player 내부에서 Rigidbody( 컴포넌트)를 MyRigidbody (컴포넌트 변수)에 할당하는 장면을 보고 , 컴포넌트(클래스) 변수는 컴포넌트(클래스)를 통해 오브젝트를 가리키는 화살표 라고 생각을 했는데 이렇게 생각해도 될까요?