comment 작성한 코드 github에 없습니다.

감사합니다 ㅎㅎ

11분 즈음에 실행할 때 다음과 같은 오류가 발생합니다.

구글링 해본 결과 npm i express-session express-formidable를 입력하면 정상 작동합니다. 참고: https://github.com/SoftwareBrothers/adminjs-nestjs/issues/23

Nuxt의 target과 mode & router 에 대해서 질문드립니다.

안녕하세요 ㅎㅎ 용수님, 저도 얼마 전에 이 부분에 대해서 공부했는데요, 완벽하지는 않지만 도움이 되실 것 같아 이렇게 답변 남깁니다. 1, 2번에 대해서 결론부터 말씀드리면, 1. ssr 옵션 값 자체는 변하지 않습니다만 더이상 런타임 때 서버와 클라이언트에서 렌더링을 하지 않습니다. 2. ssr: false일 때는 target: static이 적용되지 않습니다. 1번에 대해 설명 드리면, universal 모드(ssr: true)에서는 앱에 첫 접근시 SSR로, 페이지 간 이동은 CSR로 진행합니다. SPA 모드(ssr:false)에서는 말 그대로 SPA모드라 CSR로 진행합니다. 차이가 어떻든 두 모드는 사용자가 요청을 하면 그 때서야 정적 HTML을 렌더링하는 공통점을 가지고 있습니다. target을 server로 할 경우 설명한 것처럼 런타임 때 요청에 맞춰 정적 HTML을 렌더링합니다. 반대로 static을 할 경우 사용자가 요청도 하기 전인 빌드 때 미리 정적 HTML을 만들어 놓습니다. 그렇기 때문에 렌더링할 곳을 서버로 할지 클라이언트로 할지 정할 필요가 없어집니다. 사용자가 요청을 하면 이미 렌더링이 끝난 정적 HTML을 주기만 하면 되기 때문에 반응속도도 빠르고 SEO에도 무척 유리합니다. 2번의 경우 아래의 링크를 참조하시면 좋을 것 같습니다. https://stackoverflow.com/questions/63336570/whats-the-real-difference-between-target-static-and-target-server-in-nuxt 3번은 저도 잘 모르겠네요. 라우팅이 자동으로 만들어지기 때문에 depth가 dash로 표현된다는 얘기를 얼핏 들은 것도 같습니다. 예를 들면, pages/auth/user.vue이면 name이 auth-user로 되는 것 같습니다. 이건 테스트를 해봐야지 알 것 같네요. 혹시 위에서 잘못된 설명이 있다면 꼭 알려주세요! 감사합니다 용수님 ㅎㅎ

nuxt axios를 사용하지 않는 이유가 있을까요?

참조하시면 좋을 링크 공유합니다. https://joshua1988.github.io/vue-camp/nuxt/nuxt-axios.html

장바구니 추가를 반복적으로 하다 보면 가끔 500에러가 발생합니다.

1번은 v-for가 key값으로 고유한 string을 원하기 때문에 발생하는 일이구요. 보통은 작성자님처럼 index 쓰면 해당 오류가 발생하지 않더라구요. 2번은 장바구니에 같은 물건을 담았을 경우에 백엔드에서 오류를 뱉어내도록 설정한 것으로 보입니다. Post /carts로 요청했는데 201이오면 정상적으로 담겼고, 500인데 에러 메세지가 Inser failed, duplicate id면 이미 담겼구나라고 생각하시면 됩니다.

checkbox 에서 하위 컴포넌트를 v-model 로 넘기는 게 궁긍합니다~

오... 이런 편리한 기능이 있는 줄 몰랐네요

npm run build 이후.. 자바스크립트 오류..

뭔가 산 넘어 산이네요. 캡틴께서 올려주신 코드 참조해서 바꿨는데 더 이상 exports 에러는 뜨지 않습니다. 혹시 이후에 CORS에러가 생기시는 분들은 live server가 http인데 요청하는 api가 https여서 생긱는 문제이니 요청할 api 주소를 http로 바꿔주세요. 그럼 데이터는 잘 받아오는데 이후에 다른 에러들이 생깁니다.(사진)

키값을 사용한다고 말씀하셨는데 그럼 밸류값은 어떤방식으로 사용할 수 있을까요?

저도 처음에 헷갈렸어요. 왜 getShoppingItemOption을 호출할 때 제네릭에 타입을 명시하지 않고 'name'을 적는지 이해할 수 없었는데 조금 검색하고 이해할 수 있었습니다. getShoppingItemOption을 정의할 때 적은 extends keyof를 포함한 제네릭이 이전과 같이 타입 명시를 위해서쓰인게 아니라 단순히 T를 타입으로 가지는 변수에 들어갈 값을 제한하는거였어요. T 타입의 변수는 ShoppingItem의 키값만 값으로 받을 수 있다는 얘기인거죠. 키는 원래 string이기 때문에 그래서 'name', 'price', 'stock'만 들어갈 수 있었던거죠. ShoppingItem 인터페이스 안에 명시된 프로퍼티들의 value 값들, string,number는 정말 상관없는거였는데 이 부분이 조금 혼란을 줬던 것 같습니다.

주석에 NOTE

넵 감사합니다 ㅎㅎ

data 객체 안 객체에서 this 사용하기

아하! 안그래도 사연 보내려고 했습니다. 코드는 나중에 멘토링 신청해서 확인 받을게요 ㅎㅎ 감사합니다!