묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
영상을 멈추고 한번 풀어 보았습니다.
//query-runner.decorator.tsimport { ExecutionContext, InternalServerErrorException, createParamDecorator, } from '@nestjs/common'; import { QueryRunner } from 'typeorm'; export const QueryRunnerDecorator = createParamDecorator( (data: unknown, context: ExecutionContext): { qr: QueryRunner } => { const req = context.switchToHttp().getRequest(); if (!req.queryRunner) { throw new InternalServerErrorException('queryRunner가 없습니다.'); } return { qr: req.queryRunner, }; }, ); //posts.controller.ts@Post() @UseGuards(AccessTokenGuard) @UseInterceptors(TransactionInterceptoer) async postPosts( @User('id') userId: number, @Body() body: CreatePostDto, @QueryRunnerDecorator() qr: QueryRunner, ) { .... 중략 }트랜잭션을 interceptor로 관리하는것을 배워서 너무 유익하고 100점 만점의 100점 꿀팁이었습니다.https://www.npmjs.com/package/typeorm-transactional해당 라이브러리를 원래 사용 했으나, 마음에 들지 않았었는데 덕분에 interceptor로 대체 할 수 있을것 같습니다 좋은 강의 만들어 주셔서 감사합니다!
-
해결됨[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
transaction interceptor을 사용할때 validation이 안되는 문제
transaction interceptor을 사용할때 body field validation이 안되는 문제가 발생하여 query runner와 transaction interceptor 두코들 제외 하니 validationdl 다시 되었습니다.혹시 어떤문제인지 알수 있을까요?
-
미해결[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문
html 어디서 가져오나요?
안녕하세요 제로초님 강의를 보면서 느낀게 html 코드들을 어디서 가져오는지 모르겠어서 여쭤봅니다. 2년전 답글에 링크가 있어서 링크 클릭해봤는데 없다고 뜨는데 현재는 html 코드를 못가져오고 하드코딩해야할까요?
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
섹션별로 강의 파일 다운받을 수 있나요?
아는 부분은 제외하고 모르는 부분만 골라서 들으려는데올려주신 깃허브 리포지토리에는 완성본만 남아있더라구요혹시 각 섹션별로 강의 파일을 받을 수 있는 링크가 있을까요?
-
미해결웹게임을 만들며 배우는 인터렉티브웹! JAVASCRIPT
수리검이 날아가지 않습니다
const renderGame에서 keyMotion()까지는 작동을 하는데그 이후 forEach부분부터는 작동하지 않는것같습니다, 왜이럴까요?오타도 없고 아무이상없습니다!혹시 window.requestAnimationFrame이 너무 빨라서 bulletComProp foreach가 씹히는걸까요? ㅠㅠ... 코드 보내드립니다<game.js> const renderGame = () => { hero.keyMotion(); bulletComProp.arr.forEach((arr,i)=>{ arr.moveBullet(); }) window.requestAnimationFrame(renderGame); } <class.js> if(key.keyDown['attack']){ this.el.classList.add('attack'); bulletComProp.arr.push(new Bullet()); } class Bullet { constructor(){ this.parentNode = document.querySelector(".game"); this.el = document.createElement("div"); this.el.className = "hero_bullet"; this.x = 0; this.y = 0; this.speed = 30; this.distance = 0; this.init(); } init(){ this.x = hero.position().left + hero.size().width/2; this.y = hero.position().bottom - hero.size().height/2; this.el.style.transform = `translate(${this.x}px, ${this.y}px)`; this.parentNode.appendChild(this.el); } moveBullet(){ this.distance += this.speed; this.el.style.transform = `translate(${this.distance}px, 100)`; this.el.style.backgroundColor = 'red'; } }
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
안녕하세요 코드 리뷰 부탁드립니다 includes 사용하였습니다
<html> <head> <meta charset="UTF-8" /> <title>출력결과</title> </head> <body> <script> function solution(n, k, card) { let answer; let newArr = []; for (let i = 0; i < n; i++) { for (let j = i + 1; j < n; j++) { for (let k = j + 1; k < n; k++) { if (newArr.includes(card[i] + card[j] + card[k])) { continue; } else { newArr.push(card[i] + card[j] + card[k]); } } } } newArr.sort((a, b) => b - a); answer = newArr[k - 1]; return answer; } let arr = [1, 2, 3, 4]; console.log(solution(10, 3, arr)); </script> </body> </html>
-
해결됨실무에 바로 적용하는 프런트엔드 테스트 - 1부. 테스트 기초: 단위・통합 테스트
screen.findAllByTestId 질문
it('보여줄 상품 리스트가 더 있는 경우 show more 버튼이 노출되며, 버튼을 누르면 상품 리스트를 더 가져온다.', async () => { const { user } = await render(<ProductList limit={PRODUCT_PAGE_LIMIT} />); await screen.findAllByTestId('product-card'); const showMoreButton = screen.getByRole('button', { name: 'Show more', }); expect(showMoreButton).toBeInTheDocument(); await user.click(showMoreButton); expect(await screen.findAllByTestId('product-card')).toHaveLength( PRODUCT_PAGE_LIMIT * 2, ); });여기서 render 이후에 await screen.findAllByTestId('product-card'); 를 하는 이유가 있나요? 저걸 해주지 않으면 버튼이나 상품 아이템을 그리지 못하는 건 아는데... 그려지는 이유를 모르겠어서요 await로 찾을때까지 대기하는 걸로 이해하면 될까요?1. 그렇다면 render 호출 이후 요소를 찾지 않아도 되는 경우에도 await screen.findAllByTestId('product-card');를 해주어야 하는걸까요?2. 아래와 같이 하는거랑 차이가 있나요?it('보여줄 상품 리스트가 더 있는 경우 show more 버튼이 노출되며, 버튼을 누르면 상품 리스트를 더 가져온다.', async () => { const { user } = await render(<ProductList limit={PRODUCT_PAGE_LIMIT} />); const showMoreButton = await screen.findByRole('button', { name: 'Show more', }); expect(showMoreButton).toBeInTheDocument(); await user.click(showMoreButton); expect(await screen.findAllByTestId('product-card')).toHaveLength( PRODUCT_PAGE_LIMIT * 2, ); });
-
해결됨타입스크립트 입문 - 기초부터 실전까지
강의 내용처럼 노란 밑줄이 작동하지 않아서 유사 질문들을 실행해보았는데요
현재 .eslintre.js 가 오류로 범벅되고 밑줄에 커서를 대보면Delete `` eslint(prettier/prettier) 이 뜹니다..module.exports = { root: true, env: { browser: true, node: true, }, extends: [ 'eslint:recommended', 'plugin:@typescript-eslint/eslint-recommended', 'plugin:@typescript-eslint/recommended', ], plugins: ['prettier', '@typescript-eslint'], rules: { 'prettier/prettier': [ 'error', { singleQuote: true, semi: true, useTabs: false, tabWidth: 2, printWidth: 80, bracketSpacing: true, arrowParens: 'avoid', }, ], }, parserOptions: { parser: '@typescript-eslint/parser', }, };를 정상적으로 복사 붙여넣기 했고 어느 부분에서 오류가 생긴건지 모르겠어 가지고 질문을 올립니다 ㅠㅠ 혹시 몰라 package.json 입니다.{ "devDependencies": { "@babel/core": "^7.23.7", "@babel/preset-env": "^7.23.7", "@babel/preset-typescript": "^7.23.3", "@typescript-eslint/eslint-plugin": "^6.18.0", "@typescript-eslint/parser": "^6.18.0", "eslint": "^8.56.0", "eslint-plugin-prettier": "^5.1.2", "eslint-plugin-react": "^7.33.2", "prettier": "^3.1.1", "typescript": "^5.3.3" } }
-
미해결처음 만난 리액트(React)
오류가 뜹니다ㅜ
이거 왜 이런가요ㅜㅜnpm uninstall -g create-react-app 치면 저렇게 돼요ㅠㅠ
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
다른 풀이 리뷰
안녕하세요 제가 강의 듣기 전에 혼자 풀어봤는데요function solution(s) { let answer = 0, stack = [], tmp = 0; // tmp : 잠시 * 개수 저장하는 곳 s = s.replaceAll("()", "*"); for (let x of s) { if (x === ")") { while (stack.length) { let top = stack.pop(); if (top === "*") tmp++; else { // 여는 괄호 나오면 answer += tmp + 1; for (let i = 0; i < tmp; i++) stack.push("*"); // 괄호들은 빼고 *만 넣기 tmp = 0; //tmp초기화 break; } } } else stack.push(x); } return answer; }일단 초반에 레이저 부분은 *으로 바꾸었고 바꾼 s 로 for 문 돌려서 풀었습니다..!(**)와 같이 되면 answer에 별개수+1 을 더하고괄호를 제외한 ** 별들만 다시 stack 에 넣어서 계산했습니다..!혹시 위 코드가 틀리거나 문제점이 있을까요 ???
-
해결됨실무에 바로 적용하는 프런트엔드 테스트 - 1부. 테스트 기초: 단위・통합 테스트
1의 1.2. 올바른 테스트 작성을 위한 규칙에서 "아이템스 풀업스" 용어는 정확히 무엇이고, 어떤 의미인가요?
풀업은 턱걸이에서 듣던 용어인데요.용어를 찾아봐도 없는데, 정확히 전문 용어는 아닌 것 같고,어떤 의미로 사용되었는지 궁금합니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
섹션2 css기본과 싸이월드 실습 1탄
'css정렬' 강의에서 마지막에 회원가입을 숙제로 내주셨는데그거에 대한 자세한 정보들을 어디서 얻을 수 있을까요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
배포 후 글 작성하고 새로고침하면 게시물이 사라집니다.
배포 후 정상작동을 확인하기위해글 작성하고 새로고침을했는데 로컬스토리지에 제대로 저장안되는 문제가 발생합니다. 그리고 components탭을 확인해보니 ye he me le ... 이런식으로 나오는데왜이렇게나오는지 이게 문제의 원인인지 모르겟습니다..!수정이나 삭제 기능은 정상작동합니다. 로컬스토리지에 왜 저장이안될까요...수업보면서 작성한코드와https://github.com/hunffy/emotion_diaryfirebase 배포 주소는https://hunffy-individual-project.web.app/여기있습니다.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
그림 링크 아무것도 안뜹니다.
수업 영상강의처럼 진행하는데 같은 링크를 걸어도 그림이 안뜹니다!!<html> <head> <title>Hello World</title> </head> <body> <h1>Hello World</h1> <h2>Hello World</h2> <h3>Hello World</h3> <h4>Hello World</h4> <h5>Hello World</h5> <p>안녕하세요 그랩입니다.</p> <p>안녕하세요 그랩입니다.</p> <p>안녕하세요 그랩입니다.</p> <br /> <p>안녕하세요 그랩입니다.</p> <a href="https://naver.com">네이버 넘어가기</a> <img src="https://cdn.pixabay.com/photo/2015/03/26/09/47/sky-690293__340.jpg" alt="구름 사진" /> </body> </html>
-
해결됨실무에 바로 적용하는 프런트엔드 테스트 - 1부. 테스트 기초: 단위・통합 테스트
2.4장 마지막 border 스타일 검증 시 질문
강의의 예시와 같이expect(textInput).toHaveStyle({ borderWidth: 2, borderColor: rgb(25, 118, 210) })으로 할 경우 정상적으로 test passed가 되긴 하는데,expect(textInput).toHaveStyle({ borderWidth: 1, borderColor: rgb(25, 118, 210) })처럼 변경할 경우에도 test passed가 되네요. testing-library/jest-dom#toHaveStyle 이나 비슷한 다른 이슈를 좀 확인해보니, 예시처럼이 아닌expect(textInput).toHaveStyle({ borderWidth: '1px', borderColor: rgb(25, 118, 210) })처럼 세팅해야 예상한대로 fail이 되는 것 같습니다. 그래서 border style을 검증하는 쪽 테스트 코드의 expect 부분도expect(textInput).toHaveStyle({ borderWidth: '2px', borderColor: rgb(25, 118, 210) })로 수정이 되어야 하지 않을까.. 조심스레 제안드려봅니다 ㅎ
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
Part2 에 대해서 궁금합니다.
Part 1 에서 웬만한 건 다 배우는 것 같은데 Part 2 는 어떤 내용이고 언제쯤 공개되나요?
-
미해결Vue 3 시작하기
학생할인 쿠폰번호 오류
vue3 강의를 듣고 맘에 들어서vuejs 중급강좌 학생할인을 신청했는데쿠폰번호 쿠폰오류가 뜹니다 ㅠㅠ어떻게 해야 학생할인을 받을 수 있을까요?
-
해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
자바스크립트 특성상 무시해도 되는 경고일까요?
9장 노드버드 만들기의 두 번째 강의 - 데이터베이스 세팅하기에서 경고가 떠서 질문드립니다.models/user.js 입니다.유니티와 c#으로 게임 개발 하다가 비동기 서버를 공부 하려고 제로초님 강의를 듣고 있는데요, 이번에 자바스크립트를 처음 접했습니다. 보통 다른 언어에서는 함수의 매개변수에 자료형을 명시해주는데, 자바스크립트에서는 변수명만 선언하는 거 같더라구요.그래서 db에 User라는 변수가 있는지 알 수 없어서 경고가 뜨는 거 같은데, 무시해도 되는 경고일까요?아무래도 저런 경고가 뜨면 찝찝해서요 ㅠㅠ그리고 필드 검색이 안 되니 자동 완성도 안 돼서 불편한 점도 있네요. index.js에서 User를 비롯한 model들을 직접 선언해주고 초기화 할 때는 저 경고가 안 떴는데, model들을 자동화하도록 코드 수정하시는 부분 따라한 이후에 위 경고가 뜨게 됐습니다.IDE는 Webstorm이고, npm start는 정상적으로 작동합니다.자바스크립트는 참 신기한 언어군요..
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
반례가 있는지 알 수 있을까요?
function solution(arr) { let result = []; const convertArray = arr; for (let i = 0; i < arr[0].length - 1; i++) { const mento = arr[0][i]; for (let j = 0; j < arr.length; j++) { for (let k = 0; k < arr.length; k++) { const menti = arr[k][j]; if (j > i) { break; }; if (j !== k) { if (mento <= menti) { const index = convertArray[k].indexOf(menti); convertArray[k][index] = 'not'; } }; }; }; }; for (let i = 0; i < arr[0].length - 1; i++) { const mento = arr[i][i]; for (let k = 0; k < arr[0].length; k++) { const menti = convertArray[i][k]; if (typeof menti === 'number' && mento !== menti && typeof mento === 'number') { result.push([mento, menti]); }; }; } return result.length; }; 저는 위처럼 풀었습니다.제가푼건 O(n^3) + O(n^2)인 것 같은데제가 푼 방법에서 반례가 있을까요?다른 케이스들로 시뮬레이션 돌렸는데 잘 생각이 나지 않아 질문드립니다.
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
다른 풀이
강의 듣기 전에 혼자 풀어보았는데function solution(board, moves) { let answer = 0, stacks = Array.from({ length: board[0].length }, () => []), moveStack = []; for (let x of board.reverse()) { // [3,5,1,3,1] for (let i = 0; i < board[0].length; i++) { if (x[i] === 0) continue; stacks[i].push(x[i]); } } for (let m of moves) { m--; if (stacks[m].length === 0) continue; // 해당 번호에 인형 다 꺼냈을때 let top = stacks[m].pop(); if (moveStack.length === 0) { // moveStack 에 아무것도 없을때 moveStack.push(top); continue; } let movesTop = moveStack.pop(); if (movesTop === top) answer += 2; else { moveStack.push(movesTop, top); } } return answer; }저는 처음에 board 배열 형태를 pop하기 쉽게 변형한 뒤에 moves 따라 계산했는데이 코드로 짜면 이중 for 문 때문에 시간 효율이 안좋을까요??
