묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
액세스 토큰 재발급 관련하여 질문이 있습니다.
안녕하세요 강의 잘 듣고 있습니다.액세스 토큰이 만료되었다고 가정했을 때 프론트에서 특정 API(예시. post 조회)를 호출하면 토큰이 만료되었다는 에러 메시지를 받죠.그러면 앱에서 토큰만료 리스폰스가 도착하면 토큰을 재발급 받은 후 다시 post를 조회하는 API를 호출하는건가요??고객의 입장에서는 위 내용을 알 필요가 없을 것 같아서요.(c. 클라이언트, s.서버)C.API 호출 -> [ S.만료되었다는 익셉션 -> C.재발급 요청 -> S.토큰 재발급 -> C.다시 API호출 ] -> S.응답 반환위 순서도에서 대괄호 친 부분은 클라이언트에서 알아서 다시 처리하는건지 궁금합니다.
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
섹션26 FileIntercepter 업로드 파일 질문
다른것은 다 문제가 없다만, 업로드 public/post파일에 이미지가 안들어옵니다일부러 폴더이름과 변수명은 다르게 했습니다@Module({ imports: [ TypeOrmModule.forFeature([Event]), MulterModule.register({ fileFilter: (_req, file, cb) => { extname(file.originalname) return cb(null, true) }, storage: multer.diskStorage({ destination: (_req, _res, cb) => { cb(null, EVENT_IMG_PATH) }, // 파일 이름이 겹치지않게 고유한 uuid값을 이미지 고유 이름 앞에 붙여줌 filename: (_req, file, cb) => { cb(null, `${uuid()}${extname(file.originalname)}`) } }) }) ], controllers: [EventController], providers: [EventService] }) export class EventModule {} import { join } from 'path' //서버 프로잭트 루트 폴더 export const ROOT_PATH = process.cwd() // 외부에서 접근가능한 파일들 모아둔 폴더 이름 export const PUBLIC_FOLDER_NAME = 'upload' //위클 이벤트 사진들이 저장된 폴더 이름 export const EVENT_FOLDER_NAME = 'event' //실제 공개폴더의 실제 위치 export const PUBLIC_FOLDER_PATH = join( ROOT_PATH, PUBLIC_FOLDER_NAME ) //위클 이미지를 저장할 폴더 export const EVENT_IMG_PATH = join( PUBLIC_FOLDER_PATH, EVENT_FOLDER_NAME ) // upload/event/이미지 export const EVENT_PUBLIC_IMG_PATH = join( PUBLIC_FOLDER_NAME, EVENT_FOLDER_NAME )
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
섹션26 FileIntercepter
@Module({ imports: [ TypeOrmModule.forFeature([Event]), MulterModule.register({ fileFilter: (_req, file, cb) => { extname(file.originalname) return cb(null, true) }, storage: multer.diskStorage({ destination: (_req, _res, cb) => { cb(null, EVENT_IMG_PATH) }, // 파일 이름이 겹치지않게 고유한 uuid값을 이미지 고유 이름 앞에 붙여줌 filename: (_req, file, cb) => { cb(null, `${uuid()}${extname(file.originalname)}`) } }) }) ],
-
미해결풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
removeEventlistener 를 왜 해주어야 하는지
안녕하세요.강의를 듣고 지난달부터 필요한 웹화면을 만들어서 거의 완성을 했습니다. 현재는 테스트버전으로 만든 상태이나 그럭저럭 동작들이 잘 돌아가기는 하는데 코드도 좀 지저분하다는 생각이 들고.. 여러모로 관련이 있는 강의부분들을 다시 들어보며 가다듬고 있습니다. 처음 들었을 때는 무작정 주입식으로만 생각하고 받아들였었는데...직접 만들면서 고민을 했던 부분들이 강의내용에 있는 것들이었네요.. 역시 다시 들어볼 수록 그때는 무슨 말인지 잘 모르고 넘어갔었는데 이제사 이해가 가면서 새삼 명강의라는 걸 느낍니다.암튼... 궁금한 게 있습니다.promise . then .catch 구문에서 promise를 생략하고 .then .catch 를 해도 돌아가기는 하는데 혹시 이러면 문제가 있을까요??
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
local에서는 이상없이 되는데 vercel 배포 이후에 아무것도 없을 때가 보입니다.
현재 vercel에 정상 배포한 후 확인해보았는데 src/pages/Diary.jsx 에 존재하는 if (!curDiaryItem) { return <div>데이터 로딩중...</div>; } 이렇게 설정한 부분만 보이고 기존에 보여져야 할 것들이 모두 안보이는데 이유를 모르겠습니다 ㅠ 그리고 <meta property="op:image" content="/thumbnail.png" /> 로 지정해주었는데 왜 이것만 잘 안되는지 모르겠습니다.. 현재 vercel 주소입니다.https://emotion-diary-sable-theta.vercel.app/github repo주소입니다.https://github.com/jjacksang/one-bite-react-v2
-
해결됨비전공자의 전공자 따라잡기 - 자료구조(with JavaScript)
연결 리스트 구현 숙제 리뷰 부탁드려봅니다
// 숙제1 next가 아닌 이전것 prev를 구하기 // 숙제2 삽입이 시간복잡도가 O(n)인데 O(1)으로 변경하기 (hint tail) class Node { constructor(value) { this.value = value; this.next = null; this.prev = null; } } class LinkedList { constructor(length = 0) { this.length = length; this.head = null; this.tail = null; } add(value) { const newNode = new Node(value); if (this.head === null) { this.head = newNode; this.tail = newNode; } else { /* 수정 const [prev] = this.#search(this.length - 1); this.tail.prev = prev; this.tail.next = newNode; newNode.prev = this.tail; this.tail = newNode; */ newNode.prev = this.tail; this.tail.next = newNode; this.tail = newNode; } this.length++; return this.length; } search(index) { return this.#search(index)[1]?.value; } prevSearch(index) { return this.#search(index)[0]?.value; } currentAndPrevNode(index) { return this.#search(index); } #search(index) { let count = 0; let prev; let current = this.head; while (count < index) { prev = current; current = current?.next; count++; } return [prev, current]; } remove(index) { const [prev, current] = this.#search(index); if (prev && current) { if (!current.next) { // 마지막 노드 삭제일경우! prev.next = null; // 마지막 노드 삭제일때 이전 노드의 next를 null로 만들어주면 끝 this.tail = prev; // 마지막 노드를 삭제 했기 때문에 tail을 이전 노드로 바꾸어주어야 한다. } else { // 중간 삭제 일때 prev.next = current.next; current.next.prev = prev; // 현재 노드의 next노드의 이전 노드 prev를 prev 노드로 변경 } this.length--; return this.length; } else if (current) { // index 0일 때 this.head = current.next; this.length--; return this.length; } else { // 삭제하고자 하는 대상이 없을 떄 // 아무것도 안함 } } } const linkList = new LinkedList(); linkList.add(1); // 삭제 linkList.add(2); linkList.add(3); linkList.add(4); linkList.add(5); // 삭제 linkList.add(6); linkList.add(7); linkList.add(8); // 삭제 console.log(linkList.search(6)); // 7 console.log(linkList.prevSearch(2)); // 2 console.log(linkList.tail.prev.value); // 마지막 꼬리의 이전이니까 7 console.log(linkList.remove(0)); // 첫번째 삭제 7 console.log(linkList.prevSearch(2)); // 3 console.log(linkList.tail.prev.value); // 마지막 꼬리의 이전이니까 7 console.log(linkList.remove(6)); // 마지막 삭제 6 console.log(linkList.tail.prev.value); // 삭제후 꼬리 이전이니까 6 console.log(linkList.tail.next); // null console.log(linkList.remove(3)); // 5 const [prev, cur] = linkList.currentAndPrevNode(3); // 첫번째 튜플은 이전노드 두번째 튜플은 현재 노드 console.log(prev.value); // 4 console.log(prev.next.value); // 6 console.log(cur.value); // 6 console.log(cur.prev.value); // 4::) prev와 tail을 추가 하였고 add 메서드와 remove 메서드를 수정 하였습니다.질문1) 연결리스트 구현 숙제에 해당하는 정답 코드인지 리뷰 부탁드려도 될까요?질문2) tail만 사용 했을때는 O(1) 시간복잡도를 가지게 add 메서드를 구현했었는데 prev가 추가되면서 const [prev] = this.#search(this.length - 1); 로직을 추가하여 prev를 구해서 O(1)가 아니게 된것 같은데 무언가 더 좋은 방법이 있을것 같습니다! (저는 고민 해봤는데 모르겠습니다)
-
미해결김일한의 리액트(React) 개발자를 위한 실습을 통한 입문 과정
강의교재문의
시중 서점에 판매되는 책중에, 이 강의를 따라 배우며 같이 볼 수 있는 교재 있으면 알려주시면 좋겠습니다.
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
relation Selection 관련
Image 의 특정 컬럼만 select 하고 싶어서 find 옵션에 아래와 비슷하게 적용했더니, transform 데코레이터가 적용이 되지 않네요. chatGPT 에게 물어보니 transform 데코레이터 적용을 받으려면 QueryBuilder 를 쓰라는데, 가독성이 떨어질 것 같아서 찜찜하네요. 다른 방법은 없을까요? 아니면 일단 그냥 인강대로 쭉 진행한 다음 Prisma 로 빠르게 마이그레이션 한 다음에 이런 고민을 진행하는 게 나으려나요? export const POST_FIND_OPTIONS: FindManyOptions<PostsModel> = { select: { id: true, ..., images: { path: true } }, relations: ['images', 'author'], };
-
해결됨[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
public/posts가 붙는이유
좋은 강의 감사합니다! DB에는 파일명만 저장되어있고 post POST 요청보낼때도 파일명만 보내는데, 어떻게 post get요청을할때 public/posts가 붙는건가요?
-
미해결Only Javascript만으로 배우는 하이브리드앱 패키징
onesignal 연동 시 black screen
window.plugins.OneSignal.setAppId(); 위 코드 입력 시 화면이 black screen으로 표시됩니다. 하지만 onesignal 연동도 잘되고 푸시 메시지 발송되 잘 됩니다. 원인이 무엇일까요? android 구버전과 최신버전 모두에서 그렇습니다.
-
미해결[코드팩토리] [입문] 9시간만에 끝내는 코드팩토리의 Javascript 무료 풀코스
혹시 공부한 내용을 개인 블로그(티스토리 등)에 요약해서 올려도 될까요 ?
제목 그대로입니다. 출처 명시하여 요약된 내용을 정리해서 올려도 될까요 ?
-
해결됨[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
yarn add express 를 해도 Cannot find module 이슈
yarn add express 을 여러번 하고,구글링을 통해 현재는 node_modules 가 생성되지 않는 것까지 파악했습니다.{ "name": "NestJS", "packageManager": "yarn@4.2.2", "dependencies": { "express": "^4.19.2" } } 현재 의존성이 다음과 같이 세팅되어 있는데 맨 위 사진처럼 cannot find modules 가 나오는데, 방법이 있을까요? - 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.코드팩토리 통합 링크https://links.codefactory.aiFlutter 강의를 구매하시면 코드팩토리 디스코드 서버 플러터 프리미엄 채널에 들어오실 수 있습니다! 디스코드 서버에 들어오시고 저에게 메세지로 강의를 구매하신 이메일을 보내주시면 프리미엄 채널에 등록해드려요! 프리미엄 채널에 들어오시면 모든 질의응답 최우선으로 답변해드립니다!
-
미해결[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문
5강 async/await으로 가독성 높이기에서
async/await 그리고 promise 에 대한 부분이 윗부분 강의에서 나오지 않았는데 어디를 먼저 듣고 와야하는 걸까요 ?아니면 이 부분은 제가 따로 책으로 공부하고 들어야하는 건가요 ?
-
해결됨[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
기간별 조회가 안되고 있습니다.
안녕하세요. 강의 잘 듣고 있습니다.막히는 부분에서 부분별로 강의를 들으면서 하는데, 개념 잡기에는 좋은데.. 실무에서 변형하면서 사용하려니 막히는 부분이 생기네요.. ㅡ.ㅜ; 우선 주문 데이타를 기가별로 조회를 하려고 하는데, 안되고 있습니다.구글링과 스택쪽을 찾아봐도 딱히 잡히는것도 없고.. gpt가 알려준대로 해도 안되네요.. db는 postgreSQL로 최신버전이며.. 구성은 nest.js + prisma + swagger + graphQL로 구성되어 있으며, 버전은 최신버전으로 현재 구성된 상태입니다.// schema.prisma model Order { .... order_date DateTime? } // orders.controller.ts async getOrdersByDateRange( @Query('start_date') start_date: string, @Query('end_date') end_date: string, ): Promise<Order[]> { const startDate = new Date(start_date); const endDate = new Date(end_date); if (isNaN(startDate.getTime()) || isNaN(endDate.getTime())) { throw new BadRequestException('날짜 형식이 잘못되었습니다.'); } return this.ordersService.getOrdersByDateRange(startDate, endDate); } // orders.service.ts async getOrdersByDateRange( start_date: Date, end_date: Date, ): Promise<Order[]> { const orders = await this.prisma.order.findMany({ where: { order_date: { gte: new Date(start_date.setHours(0, 0, 0, 0)), // 시작일 00:00:00 lte: new Date(end_date.setHours(23, 59, 59, 999)), // 종료일 23:59:59.999 // gte: start_date, // 이것도 안됨 // lte: end_date, // 이것도 안됨 }, //order_date: Between(start_date, end_date), }, }); if (!orders || orders.length === 0) { throw new NotFoundException( `기간 내에 주문 데이터가 없습니다.`, ); } 디비쪽 데이타를 이와 같습니다. 입력 값은 start_date : 2024-05-01end_date : 2024-06-05이렇게 전달해서 조회하는데, 아무런 데이타를 못 가져오고 있습니다.request url : http://localhost:3000/orders/dateRange?start_date=2024-05-01&end_date=2024-06-05response body:{ "message": "Order with ID dateRange not found.", "error": "Not Found", "statusCode": 404 }이처럼 출력되고 있습니다.아무리 해 봐도 안되어서 질문 드립니다.알려주시면 감사하겠습니다.. ㅜ.ㅜ
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
선생님 그러면 만약에 도커로 백엔드 실행하지말고 구냥..
만약 도커로 백엔드 실행하기싫고,내 로컬에서 백엔드 실행한다고하면 mongoose .connect("mongodb://my-database:27017/mydocker") .then(() => { console.log("DB 연결 성공"); }) .catch((err) => console.log("DB 연결 실패", err));connect부분을 로컬호스트:27017로만 변경하면 되는거는 알겠는데..너무 번거로운거같은데 혹시 .env에 설정하는 방식같은게 없을까요? 예를들면 프로덕션, 개발모드에 따라서env를 바꿀수있잖아유그런것처럼 도커컨테이너 환경 혹은 그냥 로컬에서 백엔드 실행했을때환경 이런걸 구분할수있는 방법은없나유?
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
강의제공자의 답변을 원합니다 AI 답변만 있고 더이상 직접 답변을 안해주시네요?
AI 답변이 어느정도 편리할 수 있단 건 인정하지만, 질문 답변도 강의서비스에 포함된 것인데 어느 순간부터 강의제공자님의 직접답변은 달리지 않고 AI 답변만 달리네요. 그것만으로 전혀 충분하지 않은데 말이죠그리고 AI 답변은 기존 데이터가 없으면 답변을 못해줍니다. 강의제공자로부터 피드백을 받을 수 있을 것을 기대하고 강의를 수강하는데 이렇게 질문답변 조차 제대로 해결이 되지 않고 있는 것은 문제라고 봅니다.몇년 동안 강의를 걸어놓으 실 거면, 그리고 여러 API를 사용하실 거면 적어도 일년에 한번은 UI나 기능에 변화나 업데이트 가 있는지 확인하고 강의에 반영해주셔야 할 것 같은데 아직도 2022년 버전을 그대로 강의에 걸어두셔서 현재 UI와 완전달라 강의 진행이 제대로 안되고 있습니다.이게 정말 제대로 되고 있는게 맞나요? 무료 강의도 아니고 돈내고 듣는 강의에서 기본적인 내용 업데이트 및 강의에 포함된 질문 답변조차 제대로 진행 되지 않는다는 건 매우 실망 스럽습니다.강의 제공자님의 빠른 직접 답변과 피드백 부탁드립니다.
-
해결됨시나브로 자바스크립트
번들러를 꼭 사용해야하나요?
안녕하세요!저는 리액트 컴포넌트 라이브러리를 도전해보고 있습니다. 대부분은 Rollup, Microbundle 등의 번들러를 활용한다는 것을 알게 되었습니다. 그런데 조사해보니 굳이 번들러 없이도 컴포넌트 라이브러리를 만들 수 있다는 것을 알게 되었습니다.tsc 컴파일을 통해 TypeScript 환경과 JavaScript 환경 둘 다 지원하는 라이브러리를 만들었고, 샘플 프로젝트에서 설치해본 결과 잘 작동합니다.이런 상황에서 번들러가 왜 필요한지 잘 모르겠습니다.번들러의 역할에 대해서는 알고 있습니다. 폴리필을 제공하기도 하고, 하나의 자바스크립트 파일로 만들어서 네트워크 요청 횟수를 줄여주기도 하지요.하지만, 이 번들러를 컴포넌트 라이브러리에 꼭 사용해야 하는지 궁금합니다. 제가 만든 이 컴포넌트 라이브러리를 배포하고, 한 샘플 프로젝트에서 이 라이브러리를 npm install 했다고 가정해보겠습니다. 이 프로젝트는 Vite를 번들러로 사용하고 있습니다. 결국 배포할 때 번들링을 하게 될 텐데, 그러면 컴포넌트 라이브러리도 자동으로 함께 번들링에 포함되지 않나요? 어차피 프로젝트에서 번들링 될 건데, 미리 번들링할 필요가 있을까요?
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
defaultProps 사용이 이제 불가해진다고 경고문이 왔습니다
내용을 찾아보니 defaultProps에 대한 지원은 향후 주요 릴리스의 함수 구성 요소에서 제거될 예정이고, 대신 JavaScript 기본 매개변수를 사용하세요. 라고 나와있는데defaultProps 를 사용하지 않으면 기본값은 어떻게 설정해야 할까요??
-
미해결mongoDB 기초부터 실무까지(feat. Node.js)
Schemaless 특성을 재생시 검은화면이 나와요
Schemaless 특성을 재생시 검은화면이 나와요 새로고침해도 같은 현상이 나오네요 ㅠ
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
map을 이용한 EmotionItem 렌더링 질문
강의 14:00 쯤에 작성하신 map 함수를 이용한 EmotionItem 렌더링 파트에 질문이 있습니다. 강의에서는 아래처럼 작성하셨는데emotionList.map((item) => { <EmotionItem key={item.emotionId} {...item} /> });저는 map 내부 콜백함수에서 return 을 붙이지 않으면 화면에 렌더링 되지 않더라구요. 특별히 다른 이유가 있을까요?