묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
toJson을 추가하면 [sub].tsx에서 sub를 받아오지 못합니다.
entity에 toJson을 추가하고 내용을 비워놓기만 해도, sub를 받아오지 못합니다.강의에서는 잘 진행되어서 지금 전혀 원인을 알 수 없습니다. 답변 부탁드립니다.
-
미해결실무 중심! FE 입문자를 위한 React
사진이 잘 안보여요.
Lifecycle 사진이 잘 안보입니다. 크게 보여준 사진 필요해요.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
문의드립니다.
기존 수강자 새로운강의 쿠폰 발급 받을 수 있을까요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
투두 리스트 강의중 input 태그에 value 속성의 역할이 궁금합니다
<input ref = {contentRef} value={content} onChange={onChangeContent} placeholder="새로운 Todo..."/> <button onClick={onSubmit}>추가</button>위 코드에서 value={content}에서 value가 정확히 어떤 역할을 하는지 잘 모르겠습니다.
-
해결됨[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스
npx expo start하면 왜 실행이안될까요?
안녕하세요 도저히 해결이 안되서 질문남깁니다.일단 맥북이구요.안드로이드 기기를 키려고 a를 누르면 쭉 메시지가 나오다가CommandError: No Android connected device found, and no emulators could be started automatically.Please connect a device or create an emulator (https://docs.expo.dev/workflow/android-studio-emulator).Then follow the instructions here to enable USB debugging:https://developer.android.com/studio/run/device.html#developer-device-options. If you are using Genymotion go to Settings -> ADB, select "Use custom Android SDK tools", and point it at your Android SDK directory.이렇게 빨갛게 에러가 나면서 실행이 안됩니다. 지피티로도 해결이 안되서 질문 남겨봅니다.
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
혹시 프론트엔드 로드맵이 어떻게되나요?
선생님 강의가 마음에 들어계속 듣고싶은데요현재 프로젝트를 한달 후에 프론트엔드 부분을 맡아 진행하고있는데정식로드맵이랑간편 로드맵?빠르게 웹사이트 한개 만들 수 있게 하는 로드맵 알고 싶습니다.리액트 강의 듣고 next.js강의 들어야하는지아니면 리액트 듣고 타입스크립트 듣고 자바스크립트 듣고 next.js강의 들어야하는지..아니면 리액트만으로도 되는지 등등..
-
미해결실무 중심! FE 입문자를 위한 React
반복문 사용법은 안알려주고 주의사항만 알려주시는거군요
뭔가 편집오류인거같네요12초정도에 반복문 사용시 주의사항만 나오고 방복문 사용방법은 안알려줍니다.저야 뭐 대충알아들었는데 초보자분들은 당황스러울듯하네요
-
미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
무료/프리미엄 동시 소유 시 질문
다른 분들의 질문에 답변을 달아주신 내용을 보니까 사용자 계정에 등록된 도메인의 0번째에서 type 값을 사용하여 무료/프리미엄을 구분하는 답변을 예시로 준 것을 봤습니다.프로젝트 환경에서 하나의 사용자가 같은 도메인에 무료/프리미엄 비밀 키를 중복하여 발급 받을 수도 있고 비밀 키를 다수 발급받을 수도 있는데요 이 경우 도메인은 여러개가 조회될 것인데 이런 경우에는 어떻게 처리를 해야하나요?헤더에 비밀 키를 담아서 요청을 보내서 어떠한 비밀 키를 통한 요청인지를 특정하는 방법도 생각해봤습니다.서버 비밀 키는 어차피 클라이언트에게는 노출될 우려가 없고 클라이언트 용 비밀 키는 어차피 클라이언트에게 노출될 것을 염두해둔 비밀 키니까 노출이 되어도 크게 문제가 없을거라 생각했었습니다.하지만 이게 보안에 문제가 되는 방법은 아닌지 모르겠어서 검색을 좀 해봤지만 쉽게 판단이 서질 않습니다.아니면 일단 현재 수준에서는 보안 측면까지 이렇게 고민하기 보다 서버/클라이언트용과 무료/프리미엄용을 분리함에 의의를 두고 이런 강의를 진행하는 것이 옳은걸까요?ㅜㅜ[제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.2. 에러 메시지를 잘라서 올리지 않아야 합니다. 입문자일수록 에러메시지에서 어떤 부분이 가장 중요한 부분인지 모르실 겁니다. 그러니 통째로 올리셔야 합니다.3. 코드도 같이 올려주세요. 다만 코드 전체를 다 올리거나, 깃헙 주소만 띡 던지지는 마세요. 여러분이 "가장" 의심스럽다고 생각하는 코드를 올려주세요.4. 이 강좌를 바탕으로 여러분이 응용을 해보다가 막히는 부분, 여러 개의 선택지 중에서 조언이 필요한 부분, 제 경험이 궁금한 부분에 대한 질문은 대환영입니다. 다만 여러분의 회사 일은 질문하지 마세요.5. 강좌 하나 끝날 때마다 남의 질문들을 읽어보세요. 여러분이 곧 만나게 될 에러들입니다.6. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다.
-
미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
비주얼 스튜디오 코드로 계속 진행해도 괜찮을까요?
여태까지 비주얼 스튜디오 코드로 하시다가 웹스톤으로 바꾸셨던데혹시 비주얼 스튜디오 코드로 계속 진행해도 프로그램 실행에는 문제없을까요?
-
미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
10강 cors에러 localhost:4000으로 접속했을때 에러
에러로 의심되는 코드 올릴게요.아래는 nodebird-api 의 routes/index 파일과 middlewares/index.js코드의 corsWhenDomainMaches 모듈인데 뭐가문제인지 모르겠습니다. cors모듈은 사용했는데 말이죠 module.exports = router; exports.corsWhenDomainMatches = async (req, res, next) => { const domain = await Domain.findOne({ where: { host: new URL(req.get('origin')).host }, }); if (domain) { cors({ origin: req.get('origin'), credentials: true, })(req, res, next); } else { next(); } }; const express = require('express'); const { verifyToken, apiLimiter, corsWhenDomainMatches } = require('../middlewares'); const { createToken, tokenTest, getMyPosts, getPostsByHashtag } = require('../controllers/v2'); const router = express.Router(); router.use(corsWhenDomainMatches); // POST /v2/token router.post('/token', apiLimiter, createToken); // POST /v2/test router.get('/test', apiLimiter, verifyToken, tokenTest); // GET /v2/posts/my router.get('/posts/my', apiLimiter, verifyToken, getMyPosts); // GET /v2/posts/hashtag/:title router.get('/posts/hashtag/:title', apiLimiter, verifyToken, getPostsByHashtag);
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
버그 어떻게 고치는지 아시나요?
플레이그라운드 쓸때 저 상자가 계속 유지되고 없어지지 않습니다 ㅠㅠ방법있나요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
감정일기장 날짜 필터적용안됨
(사진)
-
미해결하루만에 배우는 express with AWS
postgres select 함수만들기의 51초에 await getNotes() 실행하면
다음과 같은 양식으로 남겨주세요.질문을 한 배경 :질문내용 : postgres select 함수만들기의 51초에 await getNotes() 실행하면Restarting 'database.js'/project/workspace/database.js:39await getNotes();^^^^^SyntaxError: await is only valid in async functions and the top level bodies of modules이런에러가 뜨고 다른곳에서도 펑션밖에서 바로 await를 사용하면 해당에러가 뜨는데 왜 선생님은 에러가 안뜨고 제쪽에서만 뜨는건가요??
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
6.2 강의에 관해 질문 드립니다.
안녕하세요 현재 리액트 강의 6.2) UI 구현하기를 수강 중 문제가 발생해서 질문 드립니다. App.css에서 스타일을 정의하고 적용을 하니 요소들이 오히려 우측으로 치우치고 화면을 축소 및 확대를 시켜도 중앙 정렬이 이루어지지 않습니다. 원인을 모르겠어서 질문 드립니다.
-
미해결리액트로 나만의 블로그 만들기(MERN Stack)
npm run dev-watch 오류
--ignore 공백 ./client' ", 에서공백을 해놨는데도 왜 에러가 뜨는지 그 이유를 잘 모르겠습니다
-
해결됨[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스
안드로이드 구글 로그인 에러
iOS로 구글 로그인하는거는 잘됩니다!근데 aos로 로그인하면 이런 에러가 떠요,,, 학습에 관련된 질문만 해주세요.질문은 상세하게 무엇이 궁금한지 작성해주세요.질문은 '마크다운'을 사용하여 할 수 있습니다.유사한 질문이 있었는지 살펴보고 질문 해주세요. 부담갖지 말고 강의에서 궁금하신 점 전부 질문해주세요 :)
-
해결됨[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스
'register' value관련 에러
이 에러는 무슨 에러인가요? 학습에 관련된 질문만 해주세요.질문은 상세하게 무엇이 궁금한지 작성해주세요.질문은 '마크다운'을 사용하여 할 수 있습니다.유사한 질문이 있었는지 살펴보고 질문 해주세요. 부담갖지 말고 강의에서 궁금하신 점 전부 질문해주세요 :)
-
해결됨[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스
MMKV 사용시 에뮬레이터에서 실행이 불가능한 이슈
이런식으로 실제 앱에서만 사용이 가능하다고 뜹니다ㅠ찾아보니까 디버깅을 끄라는데 개발자 도구를 켜봐도(ctrl+m /cmd+m켜서 들어가는,,) Debugging을 끄는 부분이 안보여요,,,+ Debug JS Remotely라는 부분을 끄라고 구글링을 하니까 나오는데 이 부분이 아예 개발자도구에서 안보입니다.. 학습에 관련된 질문만 해주세요.질문은 상세하게 무엇이 궁금한지 작성해주세요.질문은 '마크다운'을 사용하여 할 수 있습니다.유사한 질문이 있었는지 살펴보고 질문 해주세요. 부담갖지 말고 강의에서 궁금하신 점 전부 질문해주세요 :)
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
12.11 강의 ) export 후 경고 문구 & 콘솔창 데이터 출력 안됨
'12.11) Home 페이지 구현하기 2. 기능' 강의의 9분 17초에서 App 컴포넌트의 context를 Home 컴포넌트로 보내주기 위해 DiaryStateContext와 DiartDispatch를 익스포트 해주는데요.문제 1) 저는 익스포트하게 되면 아래 사진과 같이 오류가 뜨고 [문제 2]에서 설명드린 부분도 실행이 되지 않습니다. (Home 컴포넌트에서 임포트 후 다시 App 컴포넌트로 돌아와 익스포트를 작성해주긴 했습니다 => 작성 순서 바뀜)이미지의 오류 문구 (refresh only works when a file exports components. Move your react context to a separate file.) 문제 2) 그리고 강의 영상에선 익스포트 후 Home 컴포넌트에 App 컴포넌트에서 익스포트한 것 들을 import 해주고 필터를 통해 각 달에 해당하는 일기 데이터를 추출 후 콘솔창에 출력해줍니다. (강의 16:07)하지만 저는 아래 사진과 같이 콘솔창에 현재 월에 대한 데이터가 아무것도 뜨지 않습니다. 위에서 설명드린 익스포트가 제대로 되지 않은 문제로 인해 안 뜨는 것일까요? + 추가로 context들을 파일을 따로 만들고 App 컴포넌트에 임포트하고 새로고침해봤더니 아무것도 뜨지 않았습니다.. 이 내용은 깃허브에 업로드 되어있습니다.App과 Home 컴포넌트의 코드는 아래에 남겨두었습니다.(깃허브 : https://github.com/hsyo830/Section12.git )[App.jsx]import "./App.css"; import { useReducer, useRef, createContext } from "react"; import { Routes, Route } from "react-router-dom"; // /입력 시 Home, /new new, /diary diary 각각의 페이지를 가져오도록 하기 위함 import Diary from "./pages/Diary"; import Home from "./pages/Home"; import New from "./pages/New"; import Edit from "./pages/Edit"; import Notfound from "./pages/NotFound"; const mockData = [ { id: 1, createDate: new Date("2025-03-14").getTime(), emotionId: 1, content: "1번 일기 내용", }, { id: 2, createDate: new Date("2025-03-13").getTime(), emotionId: 2, content: "2번 일기 내용", }, { id: 3, createDate: new Date("2025-02-25").getTime(), emotionId: 3, content: "3번 일기 내용", }, ]; function reducer(state, action) { switch (action.type) { case "CREATE": return [action.data, ...state]; case "UPDATE": return state.map((item) => String(item.id) === String(action.data.id) ? action.data : item ); case "DELETE": return state.filter((item) => String(item.id) !== String(action.id)); default: return state; } } // 일기 데이터를 공급할 Context export const DiaryStateContext = createContext(); export const DiaryDispatchContext = createContext(); function App() { const [data, dispatch] = useReducer(reducer, mockData); // 여러가지 일기 데이터를 가져야해서 []와 같이 빈 배열 const idRef = useRef(3); // 새로운 일기 추가 const onCreate = (createDate, emotionId, content) => { dispatch({ type: "CREATE", data: { id: idRef.current++, createDate, emotionId, content, }, }); }; // 기존 일기 수정 const onUpdate = (id, createDate, emotionId, content) => { dispatch({ type: "UPDATE", data: { id, createDate, emotionId, content }, }); }; // 기존 일기 삭제 const onDelete = (id) => { dispatch({ type: "DELETE", id, }); }; return ( <> <DiaryStateContext.Provider value={data}> <DiaryDispatchContext.Provider value={{ onCreate, onUpdate, onDelete }}> <Routes> <Route path="/" element={<Home />} /> <Route path="/new" element={<New />} /> <Route path="/diary/:id" element={<Diary />} /> <Route path="/edit/:id" element={<Edit />} /> <Route path="*" element={<Notfound />} /> </Routes> </DiaryDispatchContext.Provider> </DiaryStateContext.Provider> </> ); } export default App; [Home.jsx]import { useState, useContext } from "react"; import { DiaryStateContext } from "../App"; import Header from "../components/Header"; import Button from "../components/Button"; import DiaryList from "../components/DiaryList"; import { data } from "react-router-dom"; const getMonthlyData = (pivotDate, data) => { const beginTime = new Date( pivotDate.getFullYear(), pivotDate.getMonth(), 1, 0, 0, 0 ).getTime(); const endTime = new Date( pivotDate.getFullYear, pivotDate.getMonth() + 1, 0, 23, 59, 59 ).getTime(); return data.filter( (item) => beginTime <= item.createdDate && item.createdDate <= endTime ); }; const Home = () => { const data = useContext(DiaryStateContext); const [pivotDate, setPivotDate] = useState(new Date()); const monthlyData = getMonthlyData(pivotDate, data); console.log(monthlyData); const onIncreaseMonth = () => { setPivotDate(new Date(pivotDate.getFullYear(), pivotDate.getMonth() + 1)); }; const onDecreaseMonth = () => { setPivotDate(new Date(pivotDate.getFullYear(), pivotDate.getMonth() - 1)); }; return ( <div> <Header title={`${pivotDate.getFullYear()}년 ${pivotDate.getMonth() + 1}월`} leftChild={<Button onClick={onDecreaseMonth} text={"<"} />} rightChild={<Button onClick={onIncreaseMonth} text={">"} />} /> <DiaryList /> </div> ); }; export default Home;
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
도커볼륨 마운트 관련
프로젝트 구성DockerfileFROM node:14 RUN apt-get update && apt-get install -y bash COPY ./package.json /myfolder/ COPY ./yarn.lock /myfolder/ WORKDIR /myfolder/ RUN yarn install COPY . /myfolder/ CMD ["yarn", "start:dev"]docker-compose.yamlversion: "3.7" services: node-server: build: context: . dockerfile: Dockerfile volumes: - ./index.js:/myfolder/index.js - ./email.js:/myfolder/email.js ports: - 3000:3000 database-server: image: mongo:5 ports: - 27017:27017 Window 환경입니다.위와 같을 때index.js 파일을 수정하여도docker로 연동된 nodemon 재 실행이 안됩니다. docker-desktop 에서 container 에서보면 mount 라고 표기되어있고위의 새로고침 버튼을 누르면 제대로 적용 됩니다.원인이 뭘까요?