묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
[섹션30 인터셉터] 마지막 강의
안녕하세요 선생님[섹션30 인터셉터] 마지막 영상이 [섹션29 트랜섹션] 마지막이랑 겹쳐요!따로 제보할 곳이 없어 질문 게시판에 올립니다.!
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
[BaseModel 적용하기] BaseModel에 작성된 id 프로퍼티를 OneToOne Relation의 외래키로 지정할 수 있나요?
// Base.entity.ts export abstract class BaseEntity { @PrimaryGeneratedColumn('increment') id: number; @CreatedDateColumn() createdAt: Date; @UpdatedDateColum() updatedAt: Date; } // User.entity.ts @Entity() export class User extends BaseEntity { @Column({ unique: true, }) email: string, @Column() password: string, @OneToOne(() => UserGrade, (userGrade) => userGrade.id) @JoinColumn() grade_id: number; } // UserGrade.entity.ts @Entity() export class UserGrade extends BaseEntity { @Column() grade: string; } BaseModel이 되는 BaseEntity가 있고, User와 UserGrade가 각각 BaseEntity를 상속받고 있는 형태입니다. 따라서, 각 엔티티의 기본키가 되는 id를 BaseModel에 생성되어 있습니다. 제가 궁금한 점은, User 엔티티 내에 `grade_id` 라는 프로퍼티를 만들고, 이것을 UserGrade의 id와 OneToOne 관계를 맺어주고 싶은데 id 프로퍼티를 찾지 못해 연결을 못했습니다. 제가 시도했던 방법은 추상 클래스가 아니라 생성자를 통해 자식 클래스(엔티티)로부터 id 값을 받아오는 방식을 사용해서 아래와 같이 작성해 봤습니다. 말은 안되지만 이런저런 시도를 해보았는데, 각각 연결이 안되었습니다... export class BaseEntity { constructor(obj: BaseEntity) { this.id = obj.id; this.createdAt = obj.createdAt; this.updatedAt = obj.updatedAt; } @PrimaryGeneratedColumn('increment') id: number; @CreatedDateColumn() createdAt: Date; @UpdatedDateColum() updatedAt: Date; } // User.Entity.ts @Entity() export class User extends BaseEntity { constructor(obj: User) { super(obj); Object.assign(this, obj); } ...... 생략 @OneToOne(() => UserGrade, (userGrade) => userGrade.id) @JoinColumn() grade_id: number; }// UserGrade.Entity.ts @Entity() export class UserGrade extends BaseEntity { constructor(obj: UserGrade) { super(obj); Object.assign(this, obj); @OneToOne(() => User, (user) => user.grade_id) super.id } } 혹시 이렇게 BaseEntity에서 공통되는 프로퍼티들을 관리하는 경우에, id 값을 외래키로 지정해서 연결해줄 수 있는지 궁금합니다.
-
해결됨백엔드 개발자에 의한, 백엔드 개발자들을 위한 프론트엔드 강의 - 기본편
강의 누락
안녕하세요 Thymeleaf vs HTML + RestController 주제를 듣던 중 의아한 부분이 생겨 글을 작성하게 되었습니다.해당 강의에서 Thymeleaf 에 대한 설명을 진행하던 와중, 도중 강의가 갑자기 끝나는 듯한 느낌을 받았습니다.강의 페이지를 보니, 이후 설명되야 할 내용처럼 보이는 것을 발견했습니다. 혹시 중간에 강의가 누락된 것인지 확인 부탁드립니다.
-
해결됨자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
스택과 불린을 이용해서 솔루션해봤는데 괜찮을까요?
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요.강의를 듣기 전 풀어봤는데, 설명해주신 방법도 숙지하겠습니다.function solution(s) { let answer = ''; let stack = []; let contain = false for (let ele of s) { if (ele === '(') { contain = true stack.push(ele) } if (!contain) { answer += ele } if (ele === ')') { stack.pop() if (stack.length === 0) contain = false } } return answer }
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
안녕하세요. 강의를 보기전 제 스스로 풀어 보았는데, 어떤가요?
항상 감사합니다function solution(question) { let answer = ""; if (question.length > 100) return; const oddNumber = question.length % 2 === 1 ? true : false; const MiddleLength = Math.floor(question.length / 2); let count = 0; for (const z of question) { if (oddNumber) { if (MiddleLength === count) { answer += z; } } else { if (MiddleLength - 1 === count || MiddleLength === count) { answer += z; } } count++; } return answer; } console.log(solution("study")); //"u"
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
store.js와 각 컴포넌트 간 역할에 대해 질문드립니다
store.js는 mutations 속성에 DB(or localStorage)에 접근해서 실제로 데이터를 CRUD하는 함수를 정의하고, 각각의 컴포넌트들의 methods 속성에는 $store.commit을 통해 store.js로 상태들을 모아주는 역할을 하는 것이라 이해를 했습니다. 여기서 궁금한 부분은, 데이터를 가공하는 로직이 필요할 경우 각 컴포넌트의 methods에서 가공 후 store로 넘기는 방법일단 데이터를 다 받은 뒤 store의 mutations에서 가공&저장을 하는 방법저는 각각의 컴포넌트에서 가공한 뒤 가공된 데이터를 store로 넘기는 게 맞다고 생각이 되는데, 뭐가 더 나은 방법일지 궁금해서 문의드립니다.
-
해결됨[코드캠프] 훈훈한 Javascript
display:flex의 의미
제가 섹션4까지 듣고 카운트다운 코드를 다시 보며 복습하고 있는데 style.display = flex가 이 섹션 4까지의 코드에서 어떤 맥락으로 사용됐는지가 이해가 잘 가지 않아 이 부분을 여쭤보고 싶습니다. 자바 스트립트 관련 여러 문서들을 참고하니 자바스크립트에서 flex의 의미는 css에서와 크게 다르지 않게 요소의 display 속성(인라인or블록 요소인지 등등)을 설정한다는 것을 이해했습니다. 그러나 아래의 코드 부분을 보다가 의문이 생겼습니다. if (remaining <= 0) { container.style.display = 'none'; messageContainer.innerHTML = '<h3>타이머가 종료되었습니다.</h3>'; messageContainer.style.display = 'flex'; setClearInterval(); return; } else if (isNaN(remaining)) { container.style.display = 'none'; messageContainer.innerHTML = '<h3>유효한 시간대가 아닙니다.</h3>'; messageContainer.style.display = 'flex'; setClearInterval(); return; }display:none은 요소를 숨겨준다는 의미로 이해하기 쉬웠지만 display = flex의 뜻을 알고 보니 messageContainer.style.display = flex는 어떤 의미로 사용된 것인지 감이 잘 안 잡힙니다 ㅠㅜ. 위에 innerHTML에 값을 할당한 것으로 충분하다고 생각했는데 왜 flex가 선언되는지 이유를 알고 싶습니다!
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
트랜잭션 사용 유의점
안녕하세요. 지난번 질문에 빠른 답변감사합니다. 트랜잭션 공부 중 주의사항에 대한 블로그 글을 짧게 봤는데요, 트랜잭션은 꼭 필요한 최소의 코드에만 적용하는 것이 좋다는 내용이었습니다. 결제 부분만 트랜잭션을 사용하고 나머지 게시판, 채팅 등 다른 기능 구현시 굳이 트랜잭션 사용 안해도 되는거죠?
-
미해결생활코딩 - 자바스크립트(JavaScript) 기본
배열관련 질문드립니다.
아래와 같이 함수로 리턴 값을 배열로 출력했을 때 변수로 따로 선언하지 않고 사용하는 것을 지양하는 건가요? function get_members(){ return ['egoing', 'k8805', 'sorialgi'];}alert(get_members()[1]);
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
포트폴리오는 몇개가 좋을까요?
프론트 엔드 강의에 있는 포트폴리오 1개백엔드 강의에 있는 포트폴리오 1개이 강의에 총 포트폴리오가 2개 있는데2개 다 하는게 좋을까요?
-
해결됨[코드캠프] 시작은 프리캠프
안녕하세요
안녕하세요, 강사님!수업 너무 잘 듣고있습니다.다름이 아니라 제가 모르고 싸이월드 만들기 피그마에서 협업 요청 버튼을 눌렀는데 어떡하죠..?ㅠㅠ거절해주실 수 있나요..?
-
해결됨웹 애니메이션을 위한 GSAP 가이드 Part.02
[3D 텍스트효과(2)] GSAP을 위한 애니메이션 Timeline flow"기획", 이렇게 하면 될까요?
안녕하세요,애니메이션 Timeline을 기획(정의)하는 법(방식)?에 대해 문의드립니다! 섹션, "3D 텍스트효과(2)" 에서인터벌 단위로,duration, stagger, pause, 각각의 value 계산 법을 알려주셨는데요 강좌에서 나온 예시 SVG 이미지 보면서,저렇게 애니메이션을 정의하면 되겠다,인사이트를 얻었습니다. 문득, 범쌤께서는 어떻게 애니메이션 flow를 정의 하시는지,관점이나, 포인트가 궁금해졌습니다!(이미 강의에서 SVG 이미지로 보여주셨지만, 혹시 더 있을까봐서요,,,) 강의 내용처럼,애니메이션을duration,stagger,pause,delay 단위로 배치하면, GSAP을 적용하는데 용이 하다 라고 이해하면 될까요?! 블럭 맞추듯 척척, 애니메이션이 구현되는 과정이 신기하네요! 감사합니다!
-
미해결Node.js로 웹 크롤링하기
크롤링 자바스크립트 exe파일
안녕하세요!! 크롤링 강의 너무 잘들었습니다!!이 강의를 듣고 더 무언가를 해보고 싶어, 질문드립니다!!강의 내용 중 unsplash사이트에서 이미지를 가져오는 내용이 있는데요.이 코드를 돌리는데 명령어가 아닌 js파일을 exe실행 파일로 만든 후 exe파일을 눌었을 경우 코드가 실행되기 위해서 npm의 pkg를 사용하여 만들었는데 실행이 안되서요..ㅠ강의자님은 js파일을 exe실행 파일로 만들으셔서 사용하실 때 어떤 방법을 이용하시나요?!
-
해결됨[코드캠프] 입문자를 위한 Javascript 알고리즘 이론+실습
혹시 심화강의는 계획이 있으신가요?
안녕하세요 강의 잘 듣고 있습니다 입문자들이 듣기에 참 좋은 강의 같아요 혹시 자바스크립트 입문자들을 위한 알고리즘 강의인데 이보다 높은 난이도를 수업하는 강의가 생길까요?
-
해결됨[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
Basic 토큰을 API 서버가 받아서 어떤식으로 검증을 하는지 궁금합니다
안녕하세요 코드팩토리님!! Flow chart보다가 궁금증이 생겨서 질문드립니다~ 토큰 발급 과정에서 클라이언트가 "username:password" 정보를 인코딩 후 API 서버로 전송하면 API 서버는 Basic 토큰을 받아서 디코드 후 "username:password" 정보를 추출해서 사용자가 유효한지 검증한다고 하는데플로우 차트 보면 데이터베이스에 사용자 정보를 요청하지 않는데 API 서버가 어떤 방식으로 지금 이 사용자가 유효한지를 검증하는 건가요?
-
해결됨입문자를 위한 자바스크립트 기초 강의
배열 메소드 2편 질문 드립니다.
const tw = ['나연','사나','지효','다현']; tw.forEach(function( member, index ){ const p = document.createElement('p') p.textContent = `${index+1} 번째 멤버는 ${member}` document.body.appendChild(p); }) 위처럼 작성을 했는데요. 아래처럼 에러가 발생합니다. 제가 어디가 틀렸는지 감이 안 잡혀서요 ㅠUncaught TypeError: Cannot read properties of null (reading 'appendChild') // 크롬 버전 : 버전 118.0.5993.118(공식 빌드) (64비트)
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
ElasticSearch 개념 내용은 어디서 볼 수 있나요?
ElasticSearch 개념을 학습할 수 있는 부분이 검색 섹션에 있을 거 같은데 보이지 않아 여쭤봅니다.
-
미해결애플 웹사이트 인터랙션 클론!
특정 타이밍 스크롤 애니메이션 적용하기 섹션 수강중입니다.
초반부 messageA_opacity_in 을 콘솔로 찍었는데요,partScrollStart보다 currentYOffset이 작을때는rv에 values[0] 즉 '0'을 리턴해야하는데,그러지 않고 -1부터 0까지 쭉 커지다가 css가 적용되는 구간부터 1로 점점 커집니다...const sceneInfo = [ { //0 type:'sticky', heightNum:5,//브라우저 높이의 배수 세팅 scrollHeight:0, //각 씬의 스크롤 높이 objs:{ container: document.querySelector('#scroll-section-0'), messageA: document.querySelector('#scroll-section-0 .main-message.a'), messageB: document.querySelector('#scroll-section-0 .main-message.b'), messageC: document.querySelector('#scroll-section-0 .main-message.c'), messageD: document.querySelector('#scroll-section-0 .main-message.d') }, values:{ messageA_opacity: [0, 1, { start: 0.1, end: 0.2}], messageB_opacity: [0, 1, { start: 0.3, end: 0.4}] } }, { //1 type:'normal', heightNum:5,//브라우저 높이의 배수 세팅 scrollHeight:0, //각 씬의 스크롤 높이 objs:{ container: document.querySelector('#scroll-section-1') } }, { //2 type:'sticky', heightNum:5,//브라우저 높이의 배수 세팅 scrollHeight:0, //각 씬의 스크롤 높이 objs:{ container: document.querySelector('#scroll-section-2') } }, { //3 type:'sticky', heightNum:5,//브라우저 높이의 배수 세팅 scrollHeight:0, //각 씬의 스크롤 높이 objs:{ container: document.querySelector('#scroll-section-3') } } ];function calcValues(values, currentYOffset){ let rv; const scrollHeight = sceneInfo[currentScene].scrollHeight const scrollRatio = currentYOffset / scrollHeight if(values.length === 3){ // start ~ end 사이의 애니메이션 실행 const partScrollStart = values[2].start * scrollHeight; const partScrollEnd = values[2].end * scrollHeight; const partScrollHeight = partScrollEnd - partScrollStart; if(currentYOffset => partScrollStart && currentYOffset <= partScrollEnd){ rv = (currentYOffset - partScrollStart) / partScrollHeight * (values[1] - values[0]) + values[0]; } else if (currentYOffset < partScrollStart){ rv = values[0]; } else if (currentYOffset > partScrollEnd){ rv = values[1]; } } else { rv = scrollRatio * (values[1] - values[0]) + values[0]; } return rv; } function playAnimation(){ const objs = sceneInfo[currentScene].objs; const values = sceneInfo[currentScene].values; const currentYOffset = yOffset - prevScrollHeight; switch (currentScene){ case 0: let messageA_opacity_in = calcValues(values.messageA_opacity, currentYOffset) objs.messageA.style.opacity = messageA_opacity_in console.log(messageA_opacity_in) break; case 1: break; case 2: break; case 3: break; } } 도와주세요 ㅠ
-
미해결Javascript ES6+ 제대로 알아보기 - 초급
프로토타입 체이닝에 대해서
프로토타입 체이닝에 대해서 보면서 느끼는건, 마치 객체지향의 오버라이딩과 같은 느낌이 들어서요!둘의 차이가 궁금합니다.
-
해결됨Javascript ES6+ 제대로 알아보기 - 초급
react 사용할 때 destructuring assignment라고 하는거 진짜 많이 사용 했는데 신기합니다.
const { name : name, age : age } = { name: '재남', age: 30 } console.log(name, age) 원래 이게 정석이었는데, shorthand properties 덕분에 축약 해서 사용 할 수 있게 된건지 몰랐네요. 감사합니다!