묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
강의제공자의 답변을 원합니다 AI 답변만 있고 더이상 직접 답변을 안해주시네요?
AI 답변이 어느정도 편리할 수 있단 건 인정하지만, 질문 답변도 강의서비스에 포함된 것인데 어느 순간부터 강의제공자님의 직접답변은 달리지 않고 AI 답변만 달리네요. 그것만으로 전혀 충분하지 않은데 말이죠그리고 AI 답변은 기존 데이터가 없으면 답변을 못해줍니다. 강의제공자로부터 피드백을 받을 수 있을 것을 기대하고 강의를 수강하는데 이렇게 질문답변 조차 제대로 해결이 되지 않고 있는 것은 문제라고 봅니다.몇년 동안 강의를 걸어놓으 실 거면, 그리고 여러 API를 사용하실 거면 적어도 일년에 한번은 UI나 기능에 변화나 업데이트 가 있는지 확인하고 강의에 반영해주셔야 할 것 같은데 아직도 2022년 버전을 그대로 강의에 걸어두셔서 현재 UI와 완전달라 강의 진행이 제대로 안되고 있습니다.이게 정말 제대로 되고 있는게 맞나요? 무료 강의도 아니고 돈내고 듣는 강의에서 기본적인 내용 업데이트 및 강의에 포함된 질문 답변조차 제대로 진행 되지 않는다는 건 매우 실망 스럽습니다.강의 제공자님의 빠른 직접 답변과 피드백 부탁드립니다.
-
미해결시나브로 자바스크립트
번들러를 꼭 사용해야하나요?
안녕하세요!저는 리액트 컴포넌트 라이브러리를 도전해보고 있습니다. 대부분은 Rollup, Microbundle 등의 번들러를 활용한다는 것을 알게 되었습니다. 그런데 조사해보니 굳이 번들러 없이도 컴포넌트 라이브러리를 만들 수 있다는 것을 알게 되었습니다.tsc 컴파일을 통해 TypeScript 환경과 JavaScript 환경 둘 다 지원하는 라이브러리를 만들었고, 샘플 프로젝트에서 설치해본 결과 잘 작동합니다.이런 상황에서 번들러가 왜 필요한지 잘 모르겠습니다.번들러의 역할에 대해서는 알고 있습니다. 폴리필을 제공하기도 하고, 하나의 자바스크립트 파일로 만들어서 네트워크 요청 횟수를 줄여주기도 하지요.하지만, 이 번들러를 컴포넌트 라이브러리에 꼭 사용해야 하는지 궁금합니다. 제가 만든 이 컴포넌트 라이브러리를 배포하고, 한 샘플 프로젝트에서 이 라이브러리를 npm install 했다고 가정해보겠습니다. 이 프로젝트는 Vite를 번들러로 사용하고 있습니다. 결국 배포할 때 번들링을 하게 될 텐데, 그러면 컴포넌트 라이브러리도 자동으로 함께 번들링에 포함되지 않나요? 어차피 프로젝트에서 번들링 될 건데, 미리 번들링할 필요가 있을까요?
-
미해결[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
defaultProps 사용이 이제 불가해진다고 경고문이 왔습니다
내용을 찾아보니 defaultProps에 대한 지원은 향후 주요 릴리스의 함수 구성 요소에서 제거될 예정이고, 대신 JavaScript 기본 매개변수를 사용하세요. 라고 나와있는데defaultProps 를 사용하지 않으면 기본값은 어떻게 설정해야 할까요??
-
미해결mongoDB 기초부터 실무까지(feat. Node.js)
Schemaless 특성을 재생시 검은화면이 나와요
Schemaless 특성을 재생시 검은화면이 나와요 새로고침해도 같은 현상이 나오네요 ㅠ
-
미해결[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
map을 이용한 EmotionItem 렌더링 질문
강의 14:00 쯤에 작성하신 map 함수를 이용한 EmotionItem 렌더링 파트에 질문이 있습니다. 강의에서는 아래처럼 작성하셨는데emotionList.map((item) => { <EmotionItem key={item.emotionId} {...item} /> });저는 map 내부 콜백함수에서 return 을 붙이지 않으면 화면에 렌더링 되지 않더라구요. 특별히 다른 이유가 있을까요?
-
미해결처음 만난 리액트(React)
jsx 코드 작성 후 터미널 연결
jsx 코드 사용 후 터미널 연결하기를 하면 아래와 같은 오류가 뜹니다.폴더 이름은 맞게 입력했는데 왜 이런 오류가 생기는지 모르겠습니다.ㅠ
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
중복해서 1로 돌아가는 내용관련해서 질문드립니다.
1번과 2번 노드는 양방향으로 이동이 가능하기 때문에 제 생각으로는 배제하신 1 > 2 > 1 > 3 > 4 > 5나 1 > 2 > 1 > 4 > 5 도 모든 경로의 가지 수 중 하나가 아닌가 싶은데 어떻게 생각하시는지 여쭤보고 싶습니다!
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
Postman UI가 또 바뀌어서 Mockserver 를 찾을 수가 없습니다
제목 그대로 입니다. 가장 최근에 업데이트 해주신게 벌써 2년전인데, 강의를 계속 걸어놓으시려면 적어도 매년 단위로UI 상태에 맞게 해당 부분만이라도 강의를 업데이트 해주셔야 할 것 같습니다.Mock server 부분 도저히 찾지못해 시간만 보내고 진척이 없습니다. 대체 어떻게 해야 하나요?
-
미해결실무에 바로 적용하는 프런트엔드 테스트 - 1부. 테스트 기초: 단위・통합 테스트
이 작업 영역에서 아직 발견된 테스트가 없습니다.
다른 분들도 겪은 문제인데 0.2.42 버전으로 다운그레이드 하려고해도 지원하지 않는 버전이라고 나오네요. npm run test 는 잘 실행되는거 같습니다. 혹시 해당 이슈 해결방법 알 수 있을까요 .. 아니면 그냥 npm run test 로 진행해도 상관없을까요
-
미해결
react useState 실행순서에 대해서 질문드립니다.
import React,{useState} from 'react'; function Exptest (){ const [number, setNumber] = useState('A'); const checkNumber =() =>{ alert("첫번째 "+number); setNumber(function (prevnumber){ alert(prevnumber+"/3번/"+number); setNumber((prevnumber)=>{ alert(prevnumber+"/4번/"+number); return prevnumber+'B'; }); return prevnumber+'C'; }); alert("두번째"+number); }; return ( <> <button onClick = {checkNumber}> {number} </button> </> ); }; export default Exptest; /* 이런식으로 안쓰는건 알지만 실행순서에 대해서 공부하다 이것저것 해보다가 이해가 안가서 질문드립니다. 질문1. 처음 버튼 클릭 시 number='A' -> number = 'AC' 이렇게 업데이트된다. 그리고 두번 째 실행 시 결과는 number = 'ACCB' 가 되는데 왜 처음엔 B를 추가하지 않나요? 질문2. alert 메세지가 뜨는 순서를 보면 처음 버튼 클릭 시 첫번째 A -> A/3번/A -> A/4번/A -> 두번째 A 그리고 두번 째 버튼 클릭 부터는 첫번째 AC -> 두번째 AC -> AC/3번/AC -> ACC/4번/AC 이렇게 메세지가 뜨는데 왜 순서가 달라지나요? */
-
미해결김일한의 리액트(React) 개발자를 위한 실습을 통한 입문 과정
클래스 설명시 음성 OFF
클래스 설명시 음성 OFF 되어 있네요.
-
미해결애플 웹사이트 인터랙션 클론!
스크롤할 때 캔버스로 하신 이유가 있으신가요? 그냥 성능 떄문에 캔버스로 하신건가요?
스크롤할 때 캔버스로 하신 이유가 있으신가요? 그냥 성능 떄문에 캔버스로 하신건가요?
-
해결됨[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
TypeORM-Column annotation 강의 중 UserModel typing 관련 질문
안녕하세요. UserModel 엔티티 작성할 때, 아래와 같이 타입을 엉뚱하게 적어도 컬럼 값의 타입이 제대로 들어가는 문제로 질문드립니다.https://orkhan.gitbook.io/typeorm/docs/entities#primary-columns해당 Docs를 보니 어노테이션에 타입이 정해져 있어 그런거 같은데, 아래 코드가 타입 오류가 안나는게 맞는건가요? @PrimaryGeneratedColumn() id: string; @Column() @Generated('uuid') additionalId: number;
-
미해결실무에 바로 적용하는 프런트엔드 테스트 - 1부. 테스트 기초: 단위・통합 테스트
vitest 실행시 테스트 실행에서 출력을 기록하지 않았습니다
결과가 저렇게나오는데 yarn test 실행하면 로그가 정상적으로 출력됩니다 이유가뭘까요?
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
영상 보고 응용 프로젝트 하는 중에 라우터 관련 질문이 있습니다.
안녕하세요 강사님! 이번학기에 갑자기 웹 개발을 하게 되어 부랴부랴 프론트 강의 챙겨보는중인데 정말 도움이 많이 돼 우선 감사의 말씀 먼저 드립니다. ㅜㅜ 다름이 아니라 제가 본 영상 강의를 보고 학교 과제를 수행하다가 (투두 리스트를 참고하여 만들었습니다. 참고로 과제는 이슈관리 시스템입니다.) 이러한 메인 화면을 구현하였는데, 각 프로젝트 이름을 누르면 그 프로젝트의 상세 페이지로 연결 시키고 싶은데, 라우터 기능을 사용하여 링크는 제대로 바뀌는데 화면 전환이 되지 않습니다. ㅜㅜ 코드를 여러번 봐도 무엇이 문제인지 감이 안 잡혀 질문 드리게 되었습니다. 코드 첨부 하겠습니다. ! import "./App.css"; import { Routes, Route, Link, useNavigate } from "react-router-dom"; import { useRef, useState } from "react"; import Header from "./components/Header"; import List from "./components/List"; import ProjectDetail from "./pages/ProjectDetail"; //임시데이터 const mokdata = [ { p_id: 0, p_name: "회원가입 프로젝트", date: new Date().getTime(), }, { p_id: 1, p_name: "온라인 테트리스 게임 프로젝트", date: new Date().getTime(), }, { p_id: 2, p_name: "윷놀이 프로젝트", date: new Date().getTime(), }, { p_id: 3, p_name: "온라인 채팅 앱 개발 프로젝트", date: new Date().getTime(), }, { p_id: 4, p_name: "회원 관리 시스템 프로젝트", date: new Date().getTime(), }, { p_id: 5, p_name: "이슈 관리 시스템 프로젝트", date: new Date().getTime(), }, ]; function App() { const [projects, setProjects] = useState(mokdata); const onDelete = (targetId) => { //배열에서 targetId와 일치하는 id를 갖는 요소만 삭제한 새로운 배열 setProjects(projects.filter((project) => project.p_id !== targetId)); }; return ( <> <div className="App"> <Header /> <List projects={projects} onDelete={onDelete} /> </div> <Routes> <Route path="/ProjectDetail:p_id" element={<ProjectDetail projects={projects} />} /> </Routes> </> ); } export default App; 위는 App.jsx 코드 이고 아래는 ProjectDetail 코드 입니다. !import { useParams } from "react-router-dom"; const ProjectDetail = ({ projects }) => { const { p_id } = useParams(); const project = projects.find((project) => project.p_id === parseInt(p_id)); return ( <div> <h1>프로젝트 상세내용</h1> <h2>{project.p_name}</h2> </div> ); }; export default ProjectDetail;
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
콜백함수 작성해주신 부분이 이해가 잘 안갑니다
콜백함수에서 이해가 잘 안가는 부분이 있어 질문 드립니다.여기에서 맨처음 callbackFunc 이라는 함수에서는 파라미터를 name으로 받았고 그 파라미터를 콘솔에 출력하는게 기능이었는데요그걸 sayHello(callback) 도 아니고 sayHello(callbackFunc) 으로 실행했는데도 왜 결과물이 hello 로 나오는지 도무지 이해가 가지 않습니다.그렇다고sayHello 함수 정의당시에 callback 이라는 파라미터에 callbackFunc이 연결되도록 해둔 것도 아닌데 말이죠...어떤 흐름으로 이렇게 되는지 너무 궁금합니다. 한단계씩 설명해주시면 감사하겠습니다!
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
쿼리문 질문입니다
안녕하세요 comments module을 진행하고 있습니다.pgadmin에서 SELECT *FROM users_model aINNER JOIN comments_model bON a.id = b.authorId위의 쿼리로 테이블을 조회해보려고 했는데 ERROR: column b.authorid does not exist LINE 4: ON a.id = b.authorId ^ HINT: Perhaps you meant to reference the column "b.authorId". SQL state: 42703 Character: 74 이런 오류가 나옵니다 혹시 어떻게 해야 코멘츠 테이블과 유저 테이블을 조인해서 조회해볼 수 있을까요?? 그리고 pgadmin이 시간이 좀 지나면 자꾸 연결이 끊기는지 쿼리를 날려도 아무 응답이 없는데 혹시 연결을 refresh해주는 방법이 있을까요? 매번 쿼리창을 새로 열기가 너무 불편하네요
-
미해결처음 만난 리액트(React)
이벤트 실행순서에 대해 질문드려요
import React from 'react'; import {useState} from 'react'; function ConfirmButton2 (){ const [isConfirmed,setIsconfirmed] = useState(false); const handleConfirm = ()=>{ setIsconfirmed((prevIsConfirmed) => !prevIsConfirmed); // setIsconfirmed(!isConfirmed); }; const [number, setNumber] = useState(0); const checkNumber =() =>{ alert("첫번째 "+number); // 0 setNumber((prevnumber)=>{ alert(prevnumber+"//"+number); // 0 0 return prevnumber+10; }); setNumber((prevnumber)=>{ alert(prevnumber+"//"+number); // 10 0 return prevnumber+10; }); alert("두번째"+number); // 0 }; return ( <> <button onClick = {handleConfirm} > {isConfirmed ? "확인됨2" : "확인하기2"} </button> <button onClick = {checkNumber}> {number} </button> </> ); }; export default ConfirmButton2; 이렇게 해서 실행을 하고 숫자 버튼을 클릭하면 첫번째 alert -> set함수 alert -> 두번째 alert -> 두번째 set함수 alert 이 순서로 나오는데, alert -> set 함수 alert -> 두번째 set함수 alert -> 두번째 alert 이 순서가 아닌 이유를 모르겠어요.
-
미해결쌩초보도 4시간 안에 마스터하는 자바스크립트 기초
바닐라 자바 스크립트가 뜨질 않아서..
안녕하세요 수강중인 와중에 sandbox io 에서 로그인후 바닐라 자바스크립트가 뜨질 않아서 고민입니다.. 여기서 다른 언어로 대체할수가 있을까요?
-
해결됨웹 애니메이션을 위한 GSAP 가이드 Part.01
다중요소 제어시 질문드립니다.
vs코드에서 코드를 입력하고 확인을 해보면 강사님 영상처럼 자연스럽지가 않고 ....gsap.to('.box',{y:-200, stagger:0.5});예를 들어 위에처럼 소스 입력하면 5개의 컬러박스가 있으면 강사님 영상에서는 첫번째것부터 차례대로 stagger가 되는데요, 근데 제가 확인을 할땐 첫번째 박스는 이미 위에 올라가있는 상태고 2번째거 올라가는걸로 확인이 됩니다. 아래 비슷한 질문이 있어서 함수로도 해보고 duration 을 해봐도 동일해서....