inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

serivice, controller에서 의존성 주입시 순서보장은 어떻게 유지되나요?

해결됨

[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core

@Injectable() export class AuthService { constructor( private readonly jwrService: JwtService, private readonly userService: UsersService, private readonly configService: ConfigService, ) {} class에서 constructor로 주입받은 의존성을 가져올때 key, value 형식이 아닌 순서대로 가져오는데 어떻게 첫번째에 무슨 의존성이 오는지 확신할 수 있게 되는건가요? 단연한듯이 타입을 지정하고 내가 원하는 서비스를 꺼내오거나 레포지토리를 꺼내오는데 그 아래 어떤 바탕이 있는지 궁금합니다.

  • javascript
  • typescript
  • rest-api
  • backend
grs0412 댓글 2 좋아요 0 조회수 184

버튼이 보이지 않아요

미해결

처음 만난 리액트(React)

유사 다른 질문 참고해도 오타는 없는 거 같은 데 동일 실패가 반복 됩니다.

  • HTML/CSS
  • javascript
  • react
댓글 2 좋아요 1 조회수 336

Factory Constructor를 언제 사용하나요?

해결됨

[코드팩토리] [입문] 9시간만에 끝내는 코드팩토리의 Javascript 무료 풀코스

자바스크립트 class문법에서 Factory Constructor를 언제 사용하나요? 일반 Constructor이 있는데 왜 사용하는지 모르겠어요. 예시가 있을까요?

  • javascript
2145007 댓글 2 좋아요 0 조회수 248

chapter13(promise)부터 이해가 잘 안됩니다..ㅠ

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

설명은 너무나도 잘해주시는데 제가 아직 부족해서 그런지 이해가 잘 되지않습니다.. promise를 실제 프로젝트에서 어떻게 적용하는지도 감이 안잡히고, 어떨 때 사용하는지도 잘 모르겠습니다..ㅠㅜ

  • javascript
  • react
  • node.js
mandoo 댓글 2 좋아요 1 조회수 227

부모에서 자식에게 props 전달할 때

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

Controller.propTypes = { count: PropTypes.number.isRequired, // count가 숫자형으로 필수 buttonClick: PropTypes.func.isRequired, // buttonClick이 함수형으로 필수 }; 전 위와같은 코드를 작성하지 않으면 props가 missing이라는 오류가 뜹니다. 혹시 이유를 알 수 있을까요?

  • javascript
  • react
  • node.js
2145007 댓글 2 좋아요 0 조회수 201

VDM을 몇 번을 다시 했는데 잘 안됩니다.

해결됨

[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스

나머지는 다 잘되는데 마지막 안드로이드 VDM에서 막혀서 연동이 실패가 나고 있습니다 제 나름대로 찾아보고 3번을 다시 했는데 안됩니다. 제가 뭘 놓치고 있는지 모르겠습니다.

  • javascript
  • react
  • node.js
  • react-native
  • typescript
Mr.Everything 댓글 2 좋아요 0 조회수 162

카운터앱 강의 - state대신 ref

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

강의 6.3) 기능구현하기 카운트 컴포넌트를 state로 만들어야 한다고 하셨는데 state대신 ref를 사용하면 어떻게 되나요? ref는 리렌더링을 유발하지는 않지만 dom에 접근이 가능한 걸로 알고 있습니다. 그렇다면 ref를 사용해도 무방하지 않냐는 것이 저의 생각입니다. ref를 사용한다면 ui변경이 가능하지만 리액트가 그 수정을 감지 못하는 문제가 생겨서 state를 사용하는 것인가요?

  • javascript
  • react
  • node.js
2145007 댓글 2 좋아요 0 조회수 185

set에 대해서 궁금증.

해결됨

웹 애니메이션을 위한 GSAP 가이드 Part.02

tl.set('#emart .pick', { opacity: 0 }) .to(map, { scale: 1, x: 0, y: 0 }) .set('#emart .pick', { opacity: 1 }) .fromTo('#emart .path', { strokeDashoffset: 496 }, { strokeDashoffset: 0 }) .to( '#emart .pick', { motionPath: { path: '#emart .path', align: '#emart .path', alignOrigin: [0.5, 0.5], }, }, '<' ); 위 코드에서 맨 처음 set 으로 opacity: 0 을 줘서 pick을 안 보이게 한 다음에 후에 다시 set으로 opacity: 1을 주게 되는데요 궁금한 것이 아직 순서상 motionPath 가 실행될 차례가 아니어서 마트 위치에서 pick 이 보여질 것인데 어째서 강남역 위치에서 부터 보여 지게 되는지 궁금합니다. 아래에 있는 set을 위로 올려서 tl.set('#emart .pick', { opacity: 0 }) .set('#emart .pick', { opacity: 1 }) .to(map, { scale: 1, x: 0, y: 0 }) 이렇게 위치를 바꾸면 그때서야 제가 이해한 형태로 움직이게 되네요. 왜 그런지 궁금합니다.

  • HTML/CSS
  • javascript
  • 인터랙티브-웹
  • gsap
kkamidog 댓글 2 좋아요 1 조회수 212

set에 대해서

해결됨

웹 애니메이션을 위한 GSAP 가이드 Part.02

해당 편 강의를 들어보면 set을 어디선가 사용한 것 같이 설명을 해주시는데 혹시 정확히 어느 파트로 가야 set 사용한걸 볼 수 있을까요?

  • HTML/CSS
  • javascript
  • 인터랙티브-웹
  • gsap
댓글 2 좋아요 1 조회수 171

gsap.set 은 어디에서 처음 배우는가요?

해결됨

웹 애니메이션을 위한 GSAP 가이드 Part.02

안녕하세요. 수업 너무 잘 듣고 있습니다 ^^ gsap.set 은 어디에서 처음 배우는가요? 베이직 편도 다 봤는데 제가 놓친것인지.. 그리고 나중에 svg 편이 새로 출시되는 계획이 있는걸까요~?

  • HTML/CSS
  • javascript
  • 인터랙티브-웹
  • gsap
kkamidog 댓글 2 좋아요 2 조회수 239

resize handler에서 질문이 있습니다.

미해결

인터랙티브 웹 개발 제대로 시작하기

본 강의에서는 resize 핸들러를 사용해서 구성이 되었는데, (function () { const houseElem = document.querySelector(".house"); window.addEventListener("scroll", function () { const maxScrollValue = document.body.offsetHeight - window.innerHeight; const zIndex = (pageYOffset / maxScrollValue) * 880 - 900; houseElem.style.transform = `translateZ(${zIndex}vw)`; }); })(); 이런식으로 scroll 이벤트 내부에 maxScrollValue를 사용하면 화면이 height이 변경되더라도 문제가 없는게 아닐까 생각이 되서요! 여러가지 방법이 있을 수 있겠지만 scroll 이벤트 안에 넣은게 아닌 resize 이벤트에 넣은 이유가 maxScrollValue이 재사용성될 가능성이 있기 때문일까요??

  • HTML/CSS
  • javascript
  • 인터랙티브-웹
서재완 댓글 1 좋아요 0 조회수 135

태그 궁금한 점

해결됨

[코드캠프] 시작은 프리캠프

div와 span 태그 간의 차이점은 알겠는데 p태그와 div,span태그 간의 차이가 있나요? 어떤 기준으로 선택하여 사용하면 될까요? input 태그 내에서 value를 사용할 때 value가 하는 역할이 무엇인지 궁금합니다!

  • HTML/CSS
  • javascript
Erica 댓글 2 좋아요 0 조회수 198

hooks console

미해결

처음 만난 리액트(React)

hook 실습중인데 강의에선 클릭했을때만 콘솔이 찍히는거같은데 저는 console이 계속 찍힙니다. ㅜㅜㅜ

  • HTML/CSS
  • javascript
  • react
ahj0156 댓글 2 좋아요 1 조회수 159

27.함수(리턴) sum 함수 vs sum2 함수

미해결

WEB2 - JavaScript

function sum2(left, right){ return left+right; } document.write(sum2(2,3)+'<br>'); document.write('<div style="color:red">'+sum2(2,3)+'</div>'); document.write('<div style="font-size:3rem;">'+sum2(2,3)+'</div>'); sum2 함수의 출력 결과와 아래 sum1 함수의 출력 결과가 다른 이유를 알고 싶습니다. function sum(left, right){ document.write(left+right+'<br>'); } document.write(sum(2,3)+'<br>'); document.write('<div style="color:red">'+sum(2,3)+'</div>'); document.write('<div style="font-size:3rem;">'+sum(2,3)+'</div>'); sum도 똑같이 출력해봤는데, 중간에 undefined가 함께 출력되더라고요. 확인해보니 리턴값이 없는 경우에 udefined가 출력된다고 하던데, 그 이유가 궁금합니다. 이전 26강 실습에서는 다음과 같이 출력했을 때 아무 문제 없었는데, 무엇이 다른걸까요? 한번 write한걸 다시 write하는 과정에서 생기는 문제인걸까요? onePlusOne(); function sum(left, right){ document.write(left+right+'<br>'); } sum(2,3); // 5 sum(3,4); // 7

  • javascript
  • return
  • function
후니(루트) 댓글 1 좋아요 0 조회수 205

강의 깃주소 문의

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

안녕하세요 강의를 듣다가 css를 복사하고싶은데 강의 첫장 레포짓토리 주소 들어가면 프로젝트가 없네요 어디서 확인할수있나요 ?

  • javascript
  • vue.js
  • es6
  • vuex
김소련 댓글 1 좋아요 0 조회수 166

데이터베이스 이해와 실습 관련 오류 질문

미해결

기획자님 이 정도 웹 개발은 배워보면 어떨까요? [이론+실습]

안녕하세요~ 데이터베이스 이해와 실습 CRUD 실습을 진행하다가 오류로 인하여 다음차시 진행이 불가하여 질문드립니다. PS C:\Users\폴더이름\Desktop\database> node db.js Error: querySrv ENOTFOUND _mongodb._ tcp.cluster0.mongodb.net at QueryReqWrap.onresolve [as oncomplete] (node:internal/dns/promises:291:17) { errno: undefined, code: 'ENOTFOUND', syscall: 'querySrv', hostname: '_mongodb._ tcp.cluster0.mongodb.net ' 관련하여 챗GPT에 오류 내용을 검색해본 후 원인 및 해결방법에 대해 아래 내용을 얻을 수 있었는데요 인터넷 연결 확인: 인터넷 연결이 정상적으로 이루어지고 있는지 확인하세요. 특히, 네트워크에 제한이 있거나 프록시 서버를 사용하는 경우 문제가 발생할 수 있습니다. DNS 설정 문제: DNS 설정 문 제로 인해 _mongodb._tcp.cluster0.mongodb.net 도메인이 해결되지 않을 수 있습니다. DNS 서버를 Google Public DNS(8.8.8.8, 8.8.4.4)로 변경하여 문제가 해결되는 지 확인해보세요. Windows에서 DNS 설정 변경 방법: 제어판 > 네트워크 및 인터넷 > 네트워크 및 공유 센터 > 어댑터 설정 변경 으로 이동합니다. 사용 중인 네트워크 연결을 마우스 오른쪽 버튼으로 클릭하고 속성 을 선택합니다. 인터넷 프로토콜 버전 4 (TCP/IPv4) 를 선택한 후 속성 을 클릭합니다. 하단에 있는 다음 DNS 서버 주소 사용 을 선택하고, 8.8.8.8 과 8.8.4.4 를 입력합니다. 설정을 저 장하고 다시 시도해보세요. MongoDB Atlas의 클러스터 주소 확인: cluster0.mongodb.net 이 아니라 클러스터의 정확한 호스트명을 사용하고 있는지 확인하세요. MongoDB Atlas에서 클러스터의 연결 문자열을 다시 복사하여 확인하세요. Atlas UI에서 데이터베이스 > Connect > Connect Your Application을 선택하고, 제공된 연결 문자열을 확인하세 요. 예를 들어: bash 코드 복사 mongodb+srv://<username>:<password>@cluster0.mongodb.net/test?retryWrites=true&w=majority useUnifiedTopology 옵션 사용: 최신 버전의 MongoDB 드라이버를 사용하고 있는지 확인하고, useUnifiedTopology 옵션이 활성화되어 있는지 확인하세요. javascript 코드 복사 const client = new MongoClient(uri, { useNewUrlParser: true, useUnifiedTopology: true }); 방화벽 또는 네트워크 제한: 회사 네트워크나 특정 ISP에서 DNS 쿼리 또는 MongoDB Atlas에 대한 연결을 제한할 수 있습니다. 이런 경우, 다른 네트워크(예: 휴대폰 핫스팟)에서 시도해보거나, 네트워크 관리자에게 문의하세요. SRV 레코드 대신 표준 연결 문자열 사용: SRV 레코드( mongodb+srv:// ) 대신 표준 MongoDB 연결 문자열( mongodb:// )을 시도해보세요. SRV 레코드를 지원하지 않는 네트워크 환경에서 표준 연결이 문제를 해결할 수 있습니다. 현재 회사에서 지급한 노트북으로 진행하여 보안상 문제가 있어 작업이 불가한건지.. 위 내용을 읽어봐도 명확하지 않아 질문드립니다.

  • HTML/CSS
  • javascript
  • vue.js
  • node.js
  • mongodb
  • 소프트스킬
yeji.kim27 댓글 1 좋아요 0 조회수 237

인코딩 안됨

미해결

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

js 파일에서 콘솔 찍으면 한글이 계속 깨져서나와서 인코딩 설정도 euc-kr로 다 바꿨는데도 계속 디버그 콘솔창이랑 크롬 콘솔 둘다 한글이 깨져서 나오는데 혹시 왜그런지 알 수 있을까요 ..?

  • javascript
  • react
  • node.js
pys 댓글 2 좋아요 0 조회수 167

router를 사용할 때 왜 페이지가 갱신되는지에 대한 질문

해결됨

Next.js 시작하기

안녕하세요. 면접준비에 도움이 될 거 같고 개념적으로도 궁금해서 질문드립니다. 장바구니에서 삭제를 하면 갱신되는데에 동작원리에서 처음엔 router.replace(router.asPath) 때문에 url이 변경되진 않아도 단순하게 /cart 로 이동이란 동작을 해서 페이지를 다시 그린다고 생각했습니다. CartList 는 CartPage 의 자식 컴포넌트이다. CartPage 는 getServerSideProps 로 서버에서 받아온 데이터를 프롭스(carts)로 받으며, 그 프롭스를 CartList 에게 전달해주고 있다. CartList 는 부모컴포넌트에게 받은 carts 프롭스를 통해 장바구니 목록을 보여주고 있다. 장바구니에서 상품을 삭제하면, 선택한 상품을 서버에서 삭제하고 router.replace 를 통해( router.push 도 동일) 현재 페이지(asPath)인 /cart 로 이동한다. /cart 페이지(즉, CartPage.jsx )가 리렌더링된다. 리액트는 리렌더링되면 컴포넌트의 모든 코드를 다시 실행하게 된다.(고 알고 있습니다.) 그로 인해 getServerSideProps 가 다시 실행되고 갱신된(장바구니에서 상품을 삭제한) 데이터를 다시 CartPage 에게 프롭스로 내려주게 된다. 프롭스가 변경됐으니 자식 컴포넌트인 CartList 도 리렌더링되어 모든 코드가 다시 실행된다. 바뀐 장바구니 데이터로 보여지게 된다. 라고 생각했는데요. https://nextjs.org/docs/pages/building-your-application/data-fetching/get-server-side-props#behavior 공식문서를 살펴보니 사용자가 Link 컴포넌트 또는 router를 통해 페이지를 방문할 때 , Next.js는 서버에 API 요청을 보내 getServerSideProps를 실행 합니다. 라고 되어있습니다. 이러면, 현재 CartList 는 CartPage 의 자식 컴포넌트이다. CartPage 는 getServerSideProps 로 서버에서 받아온 데이터를 프롭스(carts)로 받으며, 그 프롭스를 CartList 에게 전달해주고 있다. CartList 는 부모컴포넌트에게 받은 carts 프롭스를 통해 장바구니 목록을 보여주고 있다. 장바구니에서 상품을 삭제하면, 선택한 상품을 서버에서 삭제한다. router.replace 를 통해( router.push 도 동일) 현재 페이지(asPath)인 /cart 로 이동한다. router를 통해 페이지를 방문했으므로 CartPage 의 getServerSideProps 가 다시 실행되고 갱신된 데이터를 CartPage 에게 프롭스로 내려주게 된다. 프롭스가 변경됐으니 자식 컴포넌트인 CartList 도 리렌더링되어 모든 코드가 다시 실행된다. 바뀐 장바구니 데이터로 보여지게 된다. 이렇게 이해하면 될까요? 그리고, getServerSideProps 가 있는 페이지 컴포넌트는 getServerSideProps 가 재실행되면 자동으로 리렌더링되게 되는 구조인가요? 설명해주셨는데 제가 놓친거면 죄송합니다.

  • javascript
  • react
  • next.js
ys5133 댓글 2 좋아요 1 조회수 357

OneScroll Layout (1) 관련 재질문드립니다.

해결됨

웹 애니메이션을 위한 GSAP 가이드 Part.03

범샘님! 빠른 답변 및 업데이트 감사합니다, 답변해주신것처럼 section1, section4에서 스크롤문제가 발생합니다. 이 부분은 질문드리기 전에 확인한 부분이라 해결하였으나, 다만 답변해주신 두번째 경우는 제가 드린 질문의 방향과 조금 달라 재질문 드립니다. section4까지 스크롤을 내린후, 다시 section3까지 스크롤을 end-section3 지점까지 올리고, 다시 section4로 스크롤 할 경우 스크롤이 작동되지 않습니다. 이 부분은 첫번째 질문 드린 경우와 비슷한 상황인거 같은데, 이번에는 반대로 스크롤하는 경우라 direction을 down으로 하는 조건문을 추가하면 되는건지, 조금 더 명확한 답변과 코드를 확인하고 싶어 다시 질문드립니다. 여러모로 바쁘실텐데, 감사합니다!

  • javascript
  • 애니메이션
  • 인터랙티브-웹
  • gsap
  • scrolltrigger
김민식 댓글 1 좋아요 2 조회수 193

변경된 api 사용시 text 안나오는 문제

미해결

만들면서 배우는 리액트 : 기초

변경된 api 주소를 사용하면 text가 안나오는데, 이럴 경우에는 이미지 위에 text가 나오도록 기능을 따로 만들어야 하나요?

  • javascript
  • react
코딩쿤스트 댓글 1 좋아요 0 조회수 172

인기 태그

인프런 TOP Writers

주간 인기글