묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨@시코 - TypeScript 제대로 배우기(초중급)
교재와 git 링크 문의
강의 소개에 교재와 git 링크를 제공한다고 적혀있어서 찾아봤는데 어디에 있는지 못 찾았습니다. 어디에서 확인할 수 있는 걸까요?
-
해결됨웹 프론트엔드를 위한 자바스크립트 첫걸음
명언 설정하는데 위치설정 오류가 있어요!
⚠질문 작성법세션 7 - 4.API를 사용해 명언 강사님처럼 명언을 검색바 밑으로 보여지게 출력하고 싶은데요, 저는 오른쪽으로 명언이 출력되요! 명언바 위치 설정을 어떻게 해야 하는 지 궁금해요?!const API_URL = "https://random-quote.hyobb.com/"; const quoteElement = document.getElementById("quote"); const quoteItem = localStorage.getItem("quote"); const nowDate = new Date(); const month = nowDate.getMonth() + 1; const date = nowDate.getDate(); const setQuote = (result) => { let quote = { createDate: `${month}-${date}`, quoteDate: result }; localStorage.setItem("quote", JSON.stringify(quote)); quoteElement.textContent = result; }; const getQuote = async () => { try { const data = await fetch(API_URL).then((res) => res.json()); const result = data[1].respond; setQuote(result); } catch (err) { console.log(`err:${err}`); setQuote("작은 기회로 부터 종종 위대한 업적이 시작된다. - 데모스테네스"); } }; getQuote();
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
getStringedDate month , date 변환 질문
안녕하세요! 이정환님 강의 정말 재미있게 잘 보고 있습니다. 😊 New 페이지 구현하기 2.기능 강의 중에const getStringedDate = (targetDate) => { let year = targetDate.getFullYear(); let month = targetDate.getMonth() + 1; let date = targetDate.getDate(); if(month < 10) { month = `0${month}`; } if(date < 10) { date = `0${date}`; } return `${year}-${month}-${date}`; }로 날짜 변환 함수로 강의에서 언급 해주셨는데요! 혹시 이건 어떨까요?const getStringedDate = (targetDate) => { return `${targetDate.getFullYear()}-${String(targetDate.getMonth() +1).padStart(2,0)}-${String(targetDate.getDate()).padStart(2,0)}`; }결과는 동일하게 나올 수 있을 것 같아 상관은 없지만 보통 저런 경우에는 조건문을 애용하시는 편이실까요? 어떤 방식으로 짜는 것을 더 선호 하시는지 정말 호기심에 질문을 드립니다! 😆
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
기존 mock data는 그룹이 따로 만들어지는데 뭔가 잘못된 건가요?
이게 제 console인데요아래 mock data는 자기들끼리 따로 그룹지어서 나오는데 선생님 콘솔에는 그냥 다 개별로 나오거든요...뭐가 문제일까요? import { useReducer, useRef } from "react"; const mockData = [ { id: 1, createDate: new Date().getTime(), emotionId: 1, content: "1번 일기 내용", }, { id: 2, createDate: new Date().getTime(), emotionId: 2, content: "2번 일기 내용", }, ]; function reducer(state, action) { switch (action.type) { case "CREATE": return [action.data, ...state]; } } function App() { const [data, dispatch] = useReducer(reducer, [mockData]); const idRef = useRef(3); const onCreate = (createDate, emotionId, content) => { dispatch({ type: "CREATE", data: { id: idRef.current++, createDate, emotionId, content, }, }); }; return ( <> <button onClick={() => { onCreate(new Date().getTime(), 1, "Hello"); }}> 일기 추가 테스트 </button> </> ); } export default App; 제 코드도 첨부해봅니다,,,
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
카운터앱 기능구현하기 - 스테이트 리프팅이 헷갈립니다.
강의 설명 중 10분06초 부분 에서 설명해주신 " State Lifting (State끌어올리기 ) "이라는 개념이 아직 애매모호해서 좀더 확실하게 설명 부탁드려도 될까요 ?부모컴포넌트에서 state관리 해야하는 건 인지하고 있습니다. ( 단방향으로 흘러가는 React의 특성 때문에 ) 끌어올린다? 라는 키워드가 확실하게 팍! 하고 이해하기가 조금 어렵네요 ...
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
Header 컴포넌트에 div 말고 애초에 button은 안 되나요?
궁금한 점이 2가지 있는데요1. Header 컴포넌트에 div 말고 애초에 button를 넣으면 안 되나요?Header.jsxconst Header = ({ title, leftChild, rightChild }) => { return ( <header className="Header"> <button className="header_left">{leftChild}</button> <div className="header_center">{title}</div> <button className="header_right">{rightChild}</button> </header> ); };App.jsx<Header title={"Header"} leftChild={"Left"} rightChild={"Right"} />이런 식으로 헤더 컴포에 처음부터 버튼 태그를 넣으면 될 것 같은데 왜 div로 감싸는 건가요?음.. 그냥 css 편의상 이유일까요? 2. 저는 css를 배울 때 처음에 charset "utf-8"; 을 항상 입력하라고 배웠는데 리액트 강의에서는 항상 안 사용하시더라구요. 리액트에서는 원래 안 쓰는건가요, 아니면 그냥 강의에서는 굳이 필요없어서 쓰지 않는건가요?
-
미해결애플 웹사이트 인터랙션 클론!
[크로스브라우징] safari에서 동영상 영역 미노출
안녕하세요.공유해주신 자료를 보다가 보니 사파리 브라우저에서는 첫번째 동영상 영역이 크롬 브라우저와 다르게 영상이 없거나, 화면 스타일이 다르게 노출되는 것 같아서요. 오류인지 문의드립니다.apple-clone-v11/@simple-version/index.htmlapple-clone-v11/@ipad-stroke-effect/index.html
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
@nestjs/serve-static
안녕하세요 강사님, 'Static File Serving에서 옵션 추가하기' 강좌에서 @nestjs/serve-static 설치하는 과정에서 버전 문제 때문인지 의존성 충돌 문제가 일어나는 것 같습니다.혹시라도 다른 분들도 저와 같은 문제 겪으실까봐 글 작성합니다.-----------------------------------npm add @nestjs/serve-static 실행------------------------------------ 오류: npm add @nestjs/serve-static npm error code ERESOLVE npm error ERESOLVE unable to resolve dependency tree npm error npm error While resolving: cf_sns@0.0.1 npm error Found: @nestjs/common@10.4.17 npm error node_modules/@nestjs/common npm error @nestjs/common@"^10.0.0" from the root project npm error npm error Could not resolve dependency-----------------------------------2. npm install @nestjs/serve-static@4.0.0 // 버전 맞춰서 설치------------------------------------ 브라우저 오류 발생: {"message":"Cannot GET /public/44f57f3f-7afa-4262-b2a3-13ee7053f920.jpg","error":"Not Found","statusCode":404}- npm run start: dev 오류 : no such file directory ~~\.index.html// 정확하지는 않지만 index.html 파일까지 찾아서 jpg 파일을 찾는 것 같아서 claude에게 물어봤더니...------------------------------------ 해결: @Module({ // 다른 모듈을 불러올 때 사용 imports: [ PostsModule, ServeStaticModule.forRoot({ rootPath: PUBLIC_FOLDER_PATH, serveRoot: '/public', serveStaticOptions: { index: false } }),이렇게 하니 해결 됐습니다... 이게 맞는건지 궁금합니다!! 일단 브라우저 요청했더니 jpg 사진은 잘 나옵니다!!코드팩토리 디스코드에 질문하면 더욱 빠르게 질문을 받아 볼 수 있습니다![코드팩토리 디스코드]https://bit.ly/3HzRzUM - 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
-
미해결[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문
고차 함수 작성법과 수업 진도 관련한 질문
안녕하세요. 저는 이전 수업 기초 개념을 다 들었다고 생각했는데, 함수가 함수를 리턴하는 고차함수,그 함수 호출한 내용을 변수에 넣는 것,그걸 리턴값으로 대체하고.. 등등 내용 이해하기가 어렵습니다. 이 장에서 새롭게 배우는 내용이니 학습을 하면 되는걸까요 아니면 제가 이전 진도에서 뭔가 놓치는게 있는걸까요? 후자라면 어떻게 학습을 해야할까요? 감사합니다.
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
dto 필드 기본값 이슈에 대해 질문드립니다.
안녕하세요!다음과 같이GET: http://localhost:3000/posts아무런 파라미터 값 없이 요청을 실행했을 때dto 객체의 기본 상태는 다음과 같고, 응답 결과로 아래와 같은 nextURL을 받을 수 있었습니다. "next": "http://localhost:3000/posts?page=undefined&order__createdAt=ASC&take=20&where__id__more_than=23"cursorPagination 이기 때문에 page를 사용하지 않지만 url에는 조립되는 이유가 로직에 값을 검증하는 부분이 없어서 그런 것 같은데요, 아래와 같이 값(dto[key])를 검증하는 것을 추가하니 문제 없이 동작하였습니다.if ( dto[key] // 값 검증 추가 && key !== 'where__id__more_than' && key !== 'where__id__less_than' ) { nextUrl.searchParams.append(key, dto[key]); }"next": "http://localhost:3000/posts?order__createdAt=ASC&take=20&where__id__more_than=23"그런데 강사님께서는 따로 검증하지 않고 진행하셨음에도 nextUrl 쪽에 page가 따로 붙어나오진 않는 것 같은데요, 어떤 차이에서 발생한걸까요?.. ㅠㅠ
-
해결됨애플 웹사이트 인터랙션 클론!
항상 궁금했는데 크림슨 컬러 선택하셨을때 활용했던 사이트 좀 알려주세요~
항상 궁금했는데 크림슨 컬러 선택하셨을때 활용했던 사이트 좀 알려주세요~
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
schema.gql 질문 드립니다.
entity 등으로 생성된 tpye 에서 강의에서 사용된 코드로 예시를 들면# product.entity.ts @JoinTable() @ManyToMany(() => ProductTag, (productTags) => productTags.products) @Field(() => [ProductTag], { nullable: true }) productTags: ProductTag[];위와같이 nullable 을 사용하여#schema.gql type Product { productId: String productName: String! description: String! productPrice: Int! isSoldout: Boolean! productSalesLocation: ProductSalesLocation productCategory: ProductCategory user: User productTags: [ProductTag!] }productTags: [ProductTag!] 와 같이 할 수 있었습니다.위에서 productTags: [ProductTag!]를 productTags: [ProductTag] 와같이 변경 해보려고합니다.방법이 있나요?@Field(() => [ProductTag, { nullable: true }], { nullable: true })에러는 발생하지 않지만 안됩니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
서버 재실행시 Many to Many
yarn start:dev 를 할 경우Many to Many 로 자동으로 생성되는 table이자꾸 문제를 일으키네요. 서버 재 실행시 기존에 만들어진 중간테이블 강의에서는 상품_상품태그 테이블이 되겠네요.해당 테이블을 삭제후 실행하지 않으면 에러발생시키네요.원인을 찾아보면 아래 코드의 주석된 custom join table 이 문제였는데요.기본 @JoinTable 사용시 문제는 사라집니다. // @JoinTable({ // name: 'PRODUCT_TO_PRODUCT_TAG', // 원하는 중간 테이블명 // joinColumn: { // name: 'PRODUCT_ID', // Product 엔티티 ID를 참조하는 컬럼명 // referencedColumnName: 'productId', // Product 엔티티의 실제 ID 컬럼명 (기본값은 PrimaryColumn 이름) // }, // inverseJoinColumn: { // name: 'PRODUCT_TAG_ID', // ProductTag 엔티티 ID를 참조하는 컬럼명 // referencedColumnName: 'productTagId', // ProductTag 엔티티의 실제 ID 컬럼명 // }, // }) @JoinTable() @ManyToMany(() => ProductTag, (productTags) => productTags.products) @Field(() => [ProductTag], { nullable: true }) productTags: ProductTag[]; 질문 1. 위의 문제를 해결할 수 있는 방법입니다.질문 2.DB 컬럼에는 UPPER_CASE (SCREAMING_SNAKE_CASE) 로 작성하지 않나요?그렇기 때문에 custom / 각 컬럼마다 @Column({ name: 'BOARD_TITLE', type: 'varchar', length: 50, nullable: false, }) @Field(() => String) boardTitle: string;위와 같이 컬럼명을 하나하나 지정해줬습니다.typeorm 또는 요즘 실무 컨벤션에서는 강의에서처럼 카멜표기법으로 사용하나요?Node 강의지만 Java기준 스프링 기본설정에서 카멜케이스조차도 스네이크로 자동 변환하는데 말이죠!msa 구조에서는 테이블은 공통된걸 사용할수도 있으니 궁금해서 질문 드립니다.
-
미해결애플 웹사이트 인터랙션 클론!
vue강의는안하시나요?!
선생님 vue강의는 안하시나여?너무 잘가르쳐 주셔서 프론트엔드쪽도 선생님한테 배우고싶네요!ㅎㅎ
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
챕터 17 배열 강의 듣는 중에 궁금한게 있습니다.
위처럼 콘솔찍었을때,22번째 콘솔에서 arrC 배열 요소를 보면 0번쨰 인덱스에 "hellooo?"가 출력됩니다. 그러나 그다음 콘솔에서는 0번째 인덱스가 1로 찍힙니다.29번째 줄에서 arrC 배열의 0번째 인덱스를 "hellooo?"로 수정한 것이 22번째줄 콘솔에서 보여지는 것 같은데, 실질적인 값은 무엇인지, 이런건 자바스크립트 자체 오류인건지 아니면 원리가 따로 있는지 궁금합니다.
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
12.5 path 경로에 "/diary/:id" 입력시...
스크린샷에서 보는 것처럼 잘못된 페이지라고 나옵니다. "/diary"만 입력하면 문제없는데 id만 입력하면 경로를 찾지 못하는 것 같습니다.
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
직접 생성해서 사용하는 pipe class에 대한 질문입니다.
안녕하세요! DefaultValuePipe와 이번 강의에 나온 인자를 받는 Custom Pipe Class는 반드시 인자를 받아야 하는 구조이기 때문에 무조건 직접 생성해서 사용해야한다. 라고 이해하였는데 맞을까요? 또한, 강의에서 MaxLengthPipe와 MinLengthPipe 각각 @Injectable() 데코레이터를 붙여서 작성하셨는데, 직접 생성해서 사용하는거라면 굳이 필요없지 않을까 생각하여서 빼고 테스트 해보니 문제없이 잘 동작하는 것 같습니다. 특별히 붙여야만 하는 이유가 있는걸까요?!
-
미해결실무에 바로 적용하는 프런트엔드 테스트 - 1부. 테스트 기초: 단위・통합 테스트
통합테스트와 단위테스트 파일 분리
통합 테스트와 단위 테스트를 작성할 때 따로 파일 구분 없이 작성하는게 일반적인가요?
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
Postman 다운로드
지금 강의를 순서대로 듣고 있는데 20강에 들어가보니 postman이라는 걸 사용하더라구요근데 20강 초입에 보면 이전에 다운을 했다고 하는데 혹시 몇 강에 있는지 알려주실 수 있으실까요..?그냥 제가 해보려고 다운을 해보니 계속 문제가 생기더라구요
-
해결됨아바타 커뮤니티앱 만들기 (React Native Expo)
token 관련 질문
로그인 과정에서 refresh token은 강의 편의상 생략한 건가요?! 따로 사용하지 않은 이유가 있는지 궁금합니다.