묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨진짜! 자바스크립트(Javascript) - 기초부터 고급까지
메모리에 변수 생성과 값을 할당할 때
지금 변수와 값을 생성하는 부분을 보고있습니다. 그런데 메모리에 변수와 값들의 주소를 가지는 포인터 변수를 가진다고 하신 부분에서 궁금증이 생겼는데 그러면 메모리의 값들은 이미 메모리 셀에 기존부터 가지고 있는 건가요? 아니면 그때마다 임의로 값을 메모리에 생성하는 건가요?
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
다음 nest강의는 prisma는 사용안하실까요?
현업에서 typeorm 만큼이나 prisma를 많이 사용한다고 하는데 이쪽은 자료때문에 공부하기가 좀 힘들어서요
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
indexOf를 사용해서 반복문 하나 줄여봤습니다
function solution(test) { let answer = 0; let n = test.length; let studentNum = test[0].length + 1; // i는 멘토가 될 수 있는 학생 // j는 멘티가 될 수 있는 학생 for (i = 1; i < studentNum; i++) { for (j = 1; j < studentNum; j++) { if (i === j) continue; let flag = 0; // k는 n차 시험의 결과 for (k = 0; k < n; k++) { if (test[k].indexOf(i) < test[k].indexOf(j)) { flag++; } else { break; } } if (flag === n) answer++; } } return answer; } 각 시험 회차의 인덱스 번호가 학생의 번호다보니까 indexOf를 사용하면 반복문 하나 줄이고도 풀 수 있지 않을까 해서 이렇게 해봤습니다.
-
해결됨만들면서 배우는 리액트: 컴포넌트 설계와 리팩토링
function vs const
App()은 function 키워드를 사용하고 handleClick()은 const를 사용하셨는데 컨벤션 같은게 있을까요?
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
코드리뷰 부탁드립니다!
function addEachDigit(num) { const str = String(num); const addedNum = str.split("").reduce((acc, prev) => acc + Number(prev), 0) return addedNum; } function solution(n, arr) { let answer = 0; for (const i of arr) { const addNum = addEachDigit(i); const maxAddNum = addEachDigit(answer); if (addNum > maxAddNum) answer = i; if (addNum == maxAddNum) { if (i > answer) { answer = i; } } } return answer; } let arr = [128, 460, 603, 40, 521, 137, 123]; console.log(solution(7, arr)); 늘 감사합니다.제가 풀어본 문제 중에서는 처음으로 선생님의 풀이와 완전히 다른 방식이라 이런 방식은 어떨지 견해를 들어보고 싶습니다.
-
해결됨[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
where과 order가 적용안되는
내림차순을 확인하려고 param에 DESC를 넣었는데 내림차순 적용 되지 않길래 디버깅하다 문제에 직면했습니다.* eslint-disable prettier/prettier */ /* eslint-disable @typescript-eslint/no-unused-vars */ import { BadRequestException, Injectable } from '@nestjs/common'; import { BasePaginationDto } from './dto/base-pagination.dto'; import { FindManyOptions, FindOptionsOrder, FindOptionsWhere, Repository, } from 'typeorm'; import { BaseModel } from './entity/base.entity'; import { FILTER_MAPPER } from './const/filter-mapper.const'; import { HOST, PROTOCOL } from './const/env.const'; @Injectable() export class CommonService { paginate<T extends BaseModel>( dto: BasePaginationDto, repository: Repository<T>, overrideFindOptions: FindManyOptions<T> = {}, path: string, // api path의 일반화를 위해 ) { if (dto.page) { return this.pagePaginate(dto, repository, overrideFindOptions); } else { return this.cursorPaginate(dto, repository, overrideFindOptions, path); } } // page기반과 cursor기반 페이지네이션 2가지 만들기 /**page기반 CommonService paginate*/ private async pagePaginate<T extends BaseModel>( dto: BasePaginationDto, repository: Repository<T>, overrideFindOptions: FindManyOptions<T> = {}, ) {} /**cursor기반 CommonService paginate*/ private async cursorPaginate<T extends BaseModel>( dto: BasePaginationDto, repository: Repository<T>, overrideFindOptions: FindManyOptions<T> = {}, path: string, ) { /** * where__likeCount__more_than * * where__title__ilike */ const findOptions = this.composeFindOptions<T>(dto); const results = await repository.find({ ...findOptions, ...overrideFindOptions, }); const lastItem = results.length > 0 && results.length === dto.take ? results[results.length - 1] : null; // 새로운 URL을 생성할 때 새로운 쿼리값을 추가하는 방법 const nextUrl = lastItem && new URL(`${PROTOCOL}://${HOST}/posts`); if (nextUrl) { // dto의 키값들을 loop /** * dto의 키값들을 루핑하면서 * 키값에 해당되는 밸류가 존재하면 * param에 그대로 붙여넣는다. * * 단, where__id_more_than 값만 lastItem의 마지막 값으로 넣어준다. */ for (const key of Object.keys(dto)) { if (dto[key]) { if ( key !== 'where__id__more_than' && key !== 'where__id__less_than' ) { nextUrl.searchParams.append(key, dto[key]); // 나머지는 변경되지 마지막 아이템과 연관없이 동일하니까 } } } // 오름차순인지 내림차순인지 체크 let key = null; if (dto.order__createdAt === 'ASC') { key = 'where__id__more_than'; } else { key = 'where__id__less_than'; } // URL에 추가하니까 string으로 nextUrl.searchParams.append(key, lastItem.id.toString()); } return { data: results, cursor: { after: lastItem?.id ?? null, }, count: results.length, next: nextUrl?.toString() ?? null, }; } private composeFindOptions<T extends BaseModel>( dto: BasePaginationDto, ): FindManyOptions<T> { /** * where, * order, * take, * skip -> page 일때만 */ /** * DTO의 현재 생긴 구조는 아래와 같다 * { * where__id__more_than: 1, * order__createdAt: 'ASC' * } * * 현재는 where__id에 해당되는 where 필터만 사용중이지만 * 나중에 likeCount에 해당되는 추가 필터를 넣고싶으면 * 모든 where 필터들을 자동으로 파싱할 수 있을만한 기능을 제작 * * 1) where로 시작한다면 필터 로직을 적용한다. * 2) order로 시작한다면 정렬 로직을 적용한다. * 3) 필터 로직을 적용한다면 '__' 기준으로 split 했을 때 * 3개의 값으로 나뉘는지 2개의 값으로 나뉘는지 확인한다. * 3-1) 3개의 값으로 나뉜다면 FILTER_MAPPER에서 해당되는 operator 함수를 찾아서 적용한다. * 3-2) 2개의 값으로 나뉜다면 정확한 값을 필터하는 것이기 때문에 operator 없이 적용한다. * 4) order의 경우 3-2와 같이 적용한다. */ let where: FindOptionsWhere<T> = {}; let order: FindOptionsOrder<T> = {}; for (const [key, value] of Object.entries(dto)) { if (key.startsWith('where__')) { where = { ...where, ...this.parseWhereFilter(key, value), }; } else if (key.startsWith('order__')) { order = { ...order, ...this.parseWhereFilter(key, value), }; } } return { where, order, take: dto.take, skip: dto.page ? dto.take * (dto.page - 1) : null, }; } private parseWhereFilter<T extends BaseModel>( key: string, value: any, ): FindOptionsWhere<T> | FindOptionsOrder<T> { const options: FindOptionsWhere<T> | FindOptionsOrder<T> = {}; /** * 예를들어 where__id__more_than * __를 기준으로 나눴을때 * * ['where', 'id', 'more_than']으로 나눌 수 있다. */ const split = key.split('__'); if (split.length !== 2 && split.length !== 3) { throw new BadRequestException( `where 필터는 '__'로 split 했을때 길이가 2 또는 3이어야합니다 - 문제되는 키값 ${key}`, ); } /** * 길이가 2일 경우는 * where__id = 3 * * FindOptionsWhere로 풀어보면 * 아래와 같다 * * { * where: { * id: 3, * } * } */ if (split.length === 2) { // [where, id] const [_, field] = split; // field => id // value => 3 /** * { * id: 3 * } */ options[field] = value; } else { /** * 길이가 3일 경우에는 Typeorm 유틸리티 적용이 필요한 경우 * * where__id_more_than의 경우 * where는 버려도 되고 두번째 값은 필터할 키값이 되고 * 세번째 값은 typeorm 유틸리티가 된다. * * FILTER_MAPPER에 미리 정의해둔 값들로 * field 값에 FILTER_MAPPER에서 해당되는 utility를 가져온 후 * 값에 적용 해준다. * */ // ['where', 'id', 'more_than'] const [_, field, operator] = split; // where__id__between = 3, 4 // 만약에 split대상 문자가 존재하지 않으면 길이가 무조건 1이다. // const values = value.toString().split(','); // field -> id // operator -> more_than // FILTER_MAPPER -> MoreThan 함수 // if (operator === 'between') { // options[field] = FILTER_MAPPER[operator](values[0], values[1]); // } else { // options[field] = FILTER_MAPPER[operator](value); // } options[field] = FILTER_MAPPER[operator](value); return options; } } } 디버깅으로 중단점 눌러가며 확인해봤는데 parseWhereFilter 메서드에서 options은 올바르게 key, value를 생성하고 반환하는데composeFindOptions 메서드에서 밑의 코드를 중단점 확인했을 때 let where: FindOptionsWhere<T> = {}; let order: FindOptionsOrder<T> = {}; for (const [key, value] of Object.entries(dto)) { if (key.startsWith('where__')) { where = { ...where, ...this.parseWhereFilter(key, value), }; } else if (key.startsWith('order__')) { order = { ...order, ...this.parseWhereFilter(key, value), }; } } return { where, order, take: dto.take, skip: dto.page ? dto.take * (dto.page - 1) : null, };order와 where가 빈 객체로 반환되는 것을 확인했는데 어떻게 고쳐야 할까요
-
해결됨[코드캠프] 시작은 프리캠프
2024년 html
2024년에 html이 새로 바뀌었다는 얘기를 들었는데 이 강의를 들어도 되나요?
-
미해결SCSS(SASS)+FLEX 실전 반응형 웹 프로젝트 with Figma
장바구니페이지 관련 질문입니다.
수강신청 장바구니 화면에서 항목중 1개라도 선택이 해제되면 전체선택체크박스의 체크도 풀려야 하는거 아닌가요? 어떤 스크립트를 추가해야 적용이 되나요?
-
미해결mongoDB 기초부터 실무까지(feat. Node.js)
await 관련해서 질문드릴게 있습니다!!
안녕하세요 강사님 !! ㅎㅎ 강의 재밌게 듣고 있습니다. async await 방식이 코틀린의 코루틴과 굉장히 유사하다고 생각이 되는데 그럼 다음과 같이 Promise.all 대신 await를 늦추는 방식으로 풀어써도 똑같이 동작하나요?? async createBlog() => { await Promise.all([ Blog.insertOne({...}), // 1000ms User.UpdateOne({...}) // 1000ms ]) } // 실행시간 : 1000ms // 질문코드 async createBlog() => { const blogPromise = Blog.insertOne({...}) // 1000 ms const userPromise = User.updateOne({...}) // 1000 ms A(await blogPromise, await userPromise) } // 실행시간 : 1000ms(?)
-
미해결Vue.js 시작하기 - Age of Vue.js
뷰 개발자도구 이벤트 타임라인 어느 부분에서 확인가능한건가요
아무것도 안떠서 어디서 확인해야하는지 모르겠어요
-
미해결풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
[모던웹페이지 만들기9](1:40)class-desc 카드부분관련
안녕하세요. 쉽고 자세한 설명해주셔서 즐겁게 잘 듣고 있습니다. 여기까지는 잘 따라왔는데요. 실행시 화면상에 약간의 차이가 있는 부분이 생겨서 문의드립니다. class-container 부분을 하고 있는데요.코드는 강사님 내용이랑 동일한데화면상에서 보이는 카드화면 부분이 제 화면에서는 좁게 나와서요.[강사님화면][제 화면]혹시나 코드가 뭐라도 다른 가 해서 전체적으로 살펴보았고,또 혹시나 해서 강사님 강의자료 ( 05_roadmap_section ) 의 index.html로 golive로 구동을 해보았습니다만.동일하게 좁은 상태인데....class-card 폭은 240px 고정이고요..class-card { width : 240px; /* 요런 건 사이즈를 픽스하는 게 좋다 */ /* box-shadow: 블럭에 그림자를 적용하는 CSS 기능 https://developer.mozilla.org/ko/docs/Web/CSS/box-shadow offset-x | offset-y | blur-radius | spread-radius | color */ box-shadow: 10px 10px 10px -5px rgba(25, 42, 70, 0.2); border-radius: 8px; margin: 0 10px; }개발자 모드로 확인시에도 폭이 240px 이고...혹시 pc의 해상도에 따라서 다른 걸까요??이걸 확인을 어떻게 해야 할 지 모르겠습니다. ㅡㅡ;
-
해결됨실무에 바로 적용하는 프런트엔드 테스트 - 1부. 테스트 기초: 단위・통합 테스트
navigate 관련 테스트에서 질문있습니다!
버튼을 눌렀을 때, navigate 하는 경우를 테스트할 때는 클릭 시 함수가 호출되었는지에 대한 테스트만 하면 되는 건가요??혹시, 특정 경로로 잘 이동되었는지에 대한 테스트를 하는 방법이 있는지 여부와 해당 테스트가 존재한다면 통합테스트인건지 단위 테스트인건지 궁금합니다! 그리고, 그런 테스트가 존재한다면 어떻게 assert할 수 있는지도 알고 싶습니다!
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
코드 이렇게 작성해도 괜찮나요? 혹시 시간 복잡도는 어떻게 되는지 궁금합니다!
string의 slice메소드를 활용해서 다음과 같이 작성해보았는데 이렇게 해도 문제는 없는지, 시간복잡도는 어떻게 되는지 궁금합니다! // 두 문자열 아나그램인지 비교하는 함수 function compareStr(target, str) { // target문자열을 담은 hash 만들기 let targetH = new Map(); for (let x of target) { if (targetH.has(x)) targetH.set(x, targetH.get(x) + 1); else targetH.set(x, 1); } // target과 str이 같은지 비교 for (let x of str) { if (!targetH.has(x) || targetH.get(x) === 0) return false; targetH.set(x, targetH.get(x) - 1); } return true; } function solution(s, t) { let answer = 0; let n = t.length; // target의 길이 for (let i = 0; i <= s.length - n; i++) { let slicedStr = s.slice(i, i + n); // 문자열을 target 길이 맞춰서 잘라주기 // 비교해서 true이면 answer올리기 if (compareStr(t, slicedStr)) answer++; } return answer; } let a = "bacaAacba"; let b = "abc"; console.log(solution(a, b));감사합니다!
-
해결됨[JS] Phaser 게임 제작 - 뱀파이어 서바이벌 클론
hello world 강의 질문이요~
https://labs.phaser.io/assets/skies 여기403 Forbidden뜨고 안들어가져요ㅜㅜ
-
미해결처음 만난 리액트(React)
ReactDOM.render .createRoot 질문 드립니다.
ReactDOM.render( <React.StrictMode> <CommentList /> </React.StrictMode>, document.getElementById('root') )위 내용대로 npm start해서 띄우면 React 18버전부터는 React.createRoot를 사용하라고 나오네요..render대신에 .createRoot로 사용하면 될까여? 만약 .createRoot로 사용시 예제 간단히 알려주시면 감사하겠습니다.
-
미해결[코드팩토리] [입문] 9시간만에 끝내는 코드팩토리의 Javascript 무료 풀코스
Super Keyword 질문 있어요!
${super.sayHello()} 에서 ${this.sayHello}로 바꿔도 함수가 작동되는데 상속 때문인 가요?
-
미해결[코드팩토리] [입문] 9시간만에 끝내는 코드팩토리의 Javascript 무료 풀코스
Static Keyword 질문 있어요!
1번을 출력하면 결과값이 2번째 사진처럼 나오는데요. 콜론이 어디서 지정된 건지 잘 모르겠어요.기본값으로 ":" 콜론이 붙여서 출력되는 건가요?
-
해결됨만들면서 배우는 리액트: 컴포넌트 설계와 리팩토링
컴포넌트 내부/외부에 선언하는 함수 차이
안녕하세요!강의를 들으면 fetchTodos 함수는 App 컴포넌트 밖에 선언하시고 나머지 handleClick, handleInput, handleRemove 함수들은 컴포넌트 내에 선언하시는데 그 차이가 뭔지 궁금합니다.
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
모든 Route 기본 Private로 만들고 IsPublic Annotation 작업하기 강의부분 질문드립니다
안녕하세요 너무 잘듣고있습니다 '모든 Route 기본 Private로 만들고 IsPublic Annotation 작업하기' 수업듣는 중 질문이있어 글남깁니다.POSTMAN에서 DELETE기능을 눌렀을때 에러가 발생합니다 ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ[터미널에 나온 에러 내용][REQ] GET /posts?order__createdAt=DESC&take=5 2024. 3. 6. 오후 7:44:07[REQ] DELETE /posts/122 2024. 3. 6. 오후 7:44:32[Nest] 9576 - 2024. 03. 06. 오후 7:44:32 ERROR [ExceptionsHandler] update or delete on table "posts_model" violates foreign key constraint "FK_40cd89c6655ec7b102842feacab" on table "image_model"QueryFailedError: update or delete on table "posts_model" violates foreign key constraint "FK_40cd89c6655ec7b102842feacab" on table "image_model"at PostgresQueryRunner.query (C:\Users\manjin han\OneDrive\바탕 화면\flutter 폴더 및 파일\cf_sns\src\driver\postgres\PostgresQueryRunner.ts:331:19)at processTicksAndRejections (node:internal/process/task_queues:95:5)at DeleteQueryBuilder.execute (C:\Users\manjin han\OneDrive\바탕 화면\flutter 폴더 및 파일\cf_sns\src\query-builder\DeleteQueryBuilder.ts:77:33)at PostsService.deletePost (C:\Users\manjin han\OneDrive\바탕 화면\flutter 폴더 및 파일\cf_sns\src\posts\posts.service.ts:332:7) [postman 에러 내용]{ "statusCode": 500, "message": "Internal server error" } ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ강의상terminal창에, 이렇게 화면이 나와야하는데해당화면처럼 에러가 나오네요몇일 고민해도 안되서 질문 드립니다
-
미해결자바스크립트 : 기초부터 실전까지 올인원
반복문 문제3 369게임
1부터 50까지 369결과 프린트인데왜 숫자 2인데 박수 짝치죠?