[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
현재 Auth module에 있는 AccessTokenGuard 등을 보면 만약 어떤 사용자가 로그인했을 때 그 form에 있는 정보를 email:password로 받고 그것을 인코딩하여 서버로 전달하는 방식일텐데 결국 요청시에 base64로 잘 인코딩을 하여 보냈음에도 결국 Guard를 통과하면 req.user = user로 user에 대한 정보를 요청에 담은 후에 요청을 보내는 방식인 것 같은데 이러면 결국 요청에 user에 대한 정보가 담겨지는 것이고 이러면 보안상 문제가 생기는 것 아닌가요?
[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
현 강의에서 postPost에 UserGuard를 하기 위해 posts.module.ts에 UsersModule, AuthModule을 import해주었는데 이 UsersModule은 AuthModule에서 사용하기 때문에 import를 해줘야하는건가요? 그리고 실제로 깃헙에선 AuthModule에서 AuthService를 export했는데 postPost 매서드에서 사용하는 것은 AuthService가 아닌 auth 모듈의 guard 폴더 안에 있는 ts 파일인데 왜 AuthService를 export하는건가요?
import React from "react"; const Viewer = ({ count }) => { return ( <div> <div>현재카운트 : </div> <h1>{count}</h1> </div> ); }; export default Viewer; 이걸 했을떄 .. import React from "react"; const Viewer = ( count ) => { return ( <div> <div>현재카운트 : </div> <h1>{count}</h1> </div> ); }; export default Viewer; 두개 차이가 멀까요 계속 해깔리는데 이거.. 구조 분해형태인거 까진 알겠는데 부모에서 import logo from "./logo.svg"; import "./App.css"; import Viewer from "./component/Viewer"; import Controller from "./component/Controller"; import { useState } from "react"; function App() { const [count, setCount] = useState(0); const onClickButton = (value) => { setCount(count + value); }; return ( <div className="App"> <h1>Simple Counter</h1> <section> <Viewer count={count} /> </section> <section> <Controller onClickButton={onClickButton} /> </section> </div> ); } export default App; GPT 물어보니 ({ count }) : 이 방식은 구조 분해 할당 을 사용한 것입니다. 함수의 인자로 객체를 받고, 그 객체의 count 라는 속성을 변수로 바로 할당합니다. 예를 들어, Viewer 컴포넌트가 { count: 5 } 라는 객체를 인자로 받으면, count 변수는 바로 5가 됩니다. (count) : 이 방식은 구조 분해 할당을 사용하지 않은 것 입니다. 함수의 인자로 객체를 받고, 그 객체를 count 라는 이름의 변수로 할당합니다. 따라서 count 는 객체가 되며, count 객체의 속성에 접근하려면 count.count 처럼 접근해야 합니다. 이렇게 하면 const [count, setCount] = useState(0); 에서 count는 객체가 아니라 그냥 변수 아닌가요 ??? <button onClick={() => { onClickButton(-1); }} > <button onClick={ onClickButton(-1);} > 이거 2개의 차이가 멀까요 저는 onClick이 함수니까 함수를 전달해줘야 한다고 생각해서 { } 안에 바로 함수를 넣었거던요 ..후자 . 근데 보니까 ()=>{ } 여기다가 함수를 넣는건 onclick의 매개 함수의 리턴값으로 함수를 넣는건데 ..두개의 차이가 뭔지좀 궁금합니다.
강의 12.13 마지막에서 메인컨테이너가 화면 끝까지 안내려 오는 문제를 해결하기 위해서 index.css의 body 태그 스타일에 flex 를 주셔서 해결하셨는데요. 그 원리를 조금 더 설명해 주실 수 있나요? flex는 요소들을 한줄에 배치하기 위해서 사용 하는데 여기선 요소가 다음 줄 까지 덮도록 쓰여진것 같아 좀 헷갈립니다.
07-27 관계를 표현하는 모델 필드 - models.ManyToManyField 커스텀 관계 모델로 이전하기 (실습) 2분 18초쯤에 오류 예시를 보여주셨는데 혹시 에러가 나는 이유가 뭔지 알 수 있을까요? 기존 M2M 필드에 through를 바로 추가할 수 없기 때문인가요?
FetchBoardsCount는 search를 입력 받아 검색 결과에 대한 개수를 가져오는데 FetchUsedItemsISold는 내가 등록한 상품에 대한 전체 개수만 반환하고 있어 검색 결과에 대한 page 개수를 가져오지 못해 pagination에 검색 결과가 1개여도 내가 등록한 상품의 전체 개수를 한 page가 표시 됩니다. 검색 결과에 대한 refetch를 게시글이 없을 때까지 해주고 그걸 토대로 page 구성하기는 아닌 것 같아서 API의 search의 Count에 의존 하지 않고 page를 해결할 수 있는 방법이 있을까요?
[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
socket 은 현업에서 사용해본적이 거의 없다가 개념만 이해하고 이번에 다시 강의로 공부를 하고있습니다. 실제로 사용하게 된다면 조금 더 정리하는게 다가올것같긴한데 그러면 socket.io 로 모든 요청과 응답을 구현해도 될것같은데 ? 라는 생각을 했습니다. 아니면 비용적인 측면때문에 rest api 로 요청때마다 응답을 보내도록하고 socket 은 정말 양방향으로 필요할때만 구현하고 있는걸까요 ??
[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
3000번 포트가 사용중이라고 에러가 나와서 main에서 3001 번으로 바꿔서 사용중 입니다. 코딩을 그대로 진행했고 포스트맨에서 /users [post] 하여 Body에서 잘 입력하여 { "nickname": "study", "email": "study@naver.com", "password": "123123", "id": 10, "role": "USER" } 로 출력이 됩니다. 그대로 GET 방식으로 http://localhost:3001/users 를 입력했는데 [] 만 출력이 되고 여태 저장한 값들이 나오지가 않습니다. 오른쪽 위에는 초록색으로 200 OK 로 나옵니다.. 왜그런걸까요?
WebStorm으로 작업하신다고 하시고 프로젝트 처음에 불러오는 과정이 안나와서 짐작으로 frontend/ch02_start폴더를 만들고 cmd콘솔에서 npm install react-router-dom진행했거든요. 근데 강사님이 실습하는 폴더구조가 다르거든요? 이 과정이 생략되어있어서.. src폴더, public폴더가 자동으로 안생기는데 임의로 src폴더 만들고 그냥 하는건가요? 중간 과정 생략된걸 짐작으로 따라하려다보니 확신이 안들어서 여쭤봅니다
tailwind를 실제로 product에 적용해본 경험이 없어서 질문드립니다. 공통된 스타일은 global.css 로그인 페이지 스타일은 login.css 회원가입 페이지를 스타일을 signup.css로 @layout components를 나눠서 작성했을때 코드 스플릿팅이 되나요? 제대로 테스트를 못해봤지만 login.css 작성한 @layout components 클래스를 signup에서 쓰려면 써지는것 같더라구요 안썻을때 빌드시 코드 스플릿이 되는지 궁금합니다. jit 모드 라는게 있던데 프로젝트가 엄청 커졌을때 해당 기능으로 페이지 별로 어느정도 최적화가 되는지 궁금합니다.
import React from 'react'; import Counter from './components/Counter'; // Counter 컴포넌트의 경로를 정확히 입력 function App() { return ( <> <Counter /> </> ); } export default App; 이런 오류가 뜹니다 버전이 달라서일까요? 노드는 최신버전을 쓰고있습니다.
1. 강사님께서 올려주신 답변들을 봤습니다. " 공식 문서에서 클라이언트 컴포넌트를 트리의 끝에 보내라고 권한다. 서버 컴포넌트를 최대한 활용하기 위한 권장 사항이라고 이해하시면 좋다. "이라고 봤는데 프로젝트를 서버 컴포넌트의 비중을 늘린다면 이점은 무엇인가요? 2. 서버 컴포넌트의 비중을 늘리면 번들 크기의 감소로 사용자 경험을 최적화 하는 것이라서 next.js를 사용하는 것인가요?
