묻고 답해요
131만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
input태그에 readOnly 속성이 적용되어 있는데 onChange가 되는 이유가 무엇인가요?
8.5에서 업데이트 기능 구현 전, 오류를 없애기 위해서 readonly 속성을 적용시켰었는데, readonly를 지우지 않고도 onChange가 동작해서 여쭤봅니다.onchange가 값이 변경될 때 실행되는 걸로 알고 있는데, readonly인데 값이 변경될 수 있나요? 8.6) Update 입니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
그래프QL의 _id값을 반환받을수가 없습니다.
import { gql } from "@apollo/client"; export const FETCH_BOARDS = gql` query fetchBoards { fetchBoards { _id writer title createdAt } } `;import { useQuery } from "@apollo/client"; import { useRouter } from "next/router"; import BoardListUI from "./BoardList.presenter"; import { FETCH_BOARDS } from "./BoardList.queries"; export default function BoardList() { const { data } = useQuery(FETCH_BOARDS); //쿼리문을 실행하면 데이터에 값 넣어주기 return ( <BoardListUI data = {data} /> ); } 강사님 하고 똑같이 했는데 제것만 에러가 나네요 강사님껄로 하면 실행이 됩니다 _id 받질 못해서 안되는데 왜이럴까요 ㅠㅠ { "errors": [ { "message": "Cannot query field \"_id\" on type \"BoardReturn\".", "locations": [ { "line": 3, "column": 5 }
-
해결됨차세대 Node.js 백엔드 서버 개발(Fastify & Prisma & Typescript와 함께하는)
TypeError 관련하여 문의드립니다.
안녕하세요. TypeError 관련하여 문의드립니다.강의 회차는 Fastify 기본 설정입니다.먼저 아래는 제가 실습하는 환경입니다.Mac OS Ventura Node Version : v18.19.1 NPM Version : 10.2.4 아래는 오류에 대한 내용입니다.TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for /Users/jiyong/Desktop/Stater-Kit/src/main.ts at new NodeError (node:internal/errors:405:5) at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:136:11) at defaultGetFormat (node:internal/modules/esm/get_format:182:36) at defaultLoad (node:internal/modules/esm/load:101:20) at nextLoad (node:internal/modules/esm/hooks:864:28) at load (/Users/jiyong/Desktop/Stater-Kit/node_modules/ts-node/dist/child/child-loader.js:19:122) at nextLoad (node:internal/modules/esm/hooks:864:28) at Hooks.load (node:internal/modules/esm/hooks:447:26) at MessagePort.handleMessage (node:internal/modules/esm/worker:196:24) at [nodejs.internal.kHybridDispatch] (node:internal/event_target:786:20) { code: 'ERR_UNKNOWN_FILE_EXTENSION' } [nodemon] app crashed - waiting for file changes before starting...이미 커뮤니티에 해당 오류와 관련하여 질문이 있길레 강사님이 답변하신 부분을 보고 체크해봤지만 제 코드상 잘못된 부분을 못찾겠더라구요그래서 Google Drive에 올려놓으신 fastify-init.zip을 통하여 진행해보았지만 같은 오류가 뜹니다.해결 방법을 알 수 있을까요 ?
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
JSX에서 CSS파일 연결하는게 안됩니다
안녕하세요 선생님강의 잘 듣고 있습니다! 다름이 아니라 선생님 강의 중 'JSX로 UI 표현하기' 편을 듣고 있는데import를 이용해서 CSS파일을 연결하는 부분에서 막혔습니다강의와 똑같이 작성했는데 스타일 적용이 안되는 이유가 뭘까요?화면에 오류 표시도 안뜨는데 코드에 문제가 있는지 궁금합니다
-
미해결사물인터넷 통신은 내 손에 (Arduino, MQTT, Nodejs, MongoDB, Android,VS Code)
mongoose.connect() 콜백 에러
Mongoose.prototype.connect() no longer accepts a callback더이상 콜백을 허용하지 않는다며 에러가 뜹니다.그래서 데이타베이스에 연결이 안되네요.
-
미해결[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
class 내의 함수를 화살표 함수로 쓰는 이유가 있나요??
안녕하세요.class 내에 함수는 function을 적지 않아서 더 간단하게 작성이 가능한데, 화살표 함수를 사용하시는 이유가 있을까요?? class Monster { power = 10 constructor(qqq){ this.power = qqq } attact = () => { console.log("공격하자!!"); console.log("내 공격력은" + this.power + "야!!!"); } run(){ console.log("도망가자!!"); } } // 둘의 차이는??
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
data 폴더가 생성되지 않아요.
위에 코드로 docker-compose up을 해도 data 폴더가 생성되지 않아요. 다른 질문 참가해서 volumes: data:를 넣어봐도 생성되지 않습니다. 밑에 코드는 docker-compose up을 실행했을 때 뜨는 코드 입니다.PostgreSQL Database directory appears to contain a database; Skipping initialization2024-03-15 02:14:21.650 UTC [1] LOG: starting PostgreSQL 16.2 (Debian 16.2-1.pgdg120+2) on x86_64-pc-linux-gnu, compiled by gcc (Debian 12.2.0-14) 12.2.0, 64-bit2024-03-15 02:14:21.650 UTC [1] LOG: listening on IPv4 address "0.0.0.0", port 54322024-03-15 02:14:21.650 UTC [1] LOG: listening on IPv6 address "::", port 54322024-03-15 02:14:21.665 UTC [1] LOG: listening on Unix socket "/var/run/postgresql/.s.PGSQL.5432"2024-03-15 02:14:21.683 UTC [30] LOG: database system was shut down at 2024-03-15 02:13:06 UTC2024-03-15 02:14:21.697 UTC [1] LOG: database system is ready to accept connections 어떻게 해야할까요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
https 적용 후 다른 포트 사용이 가능한가요?
안녕하세요.강의보고 따라하니 https 적용이 잘 됐습니다. 저는 https를 적용하기 전에 3050번 포트에 프론트,3060번 포트에 백,3000번 포트에 관리자 페이지를 각각 배포해놓았습니다. ec2의 한 인스턴스에 이 3개를 배포하는 방법은 있을까요?예를 들어 도메인이 domain.com 일때,프론트는 domain.com에 배포하고관리자는 domain.com:3000에 배포하고백은 domain.com:3060에 배포하는 방법이 있을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
section 10-01 실습중에 DB연결 및 생성이 안되서 질문드립니다.
import { ApolloDriver, ApolloDriverConfig } from '@nestjs/apollo'; import { Module } from '@nestjs/common'; import { ConfigModule } from '@nestjs/config'; import { GraphQLModule } from '@nestjs/graphql'; import { TypeOrmModule } from '@nestjs/typeorm'; import { BoardsModule } from './apis/boards/boards.module'; @Module({ imports: [ BoardsModule, ConfigModule.forRoot(), GraphQLModule.forRoot<ApolloDriverConfig>({ driver: ApolloDriver, autoSchemaFile: 'src/commons/graphql/schema.gql', }), TypeOrmModule.forRoot({ type: process.env.DATABASE_TYPE as 'mysql', host: process.env.DATABASE_HOST, port: Number(process.env.DATABASE_PORT), username: process.env.DATABASE_USERNAME, password: process.env.DATABASE_PASSWORD, database: process.env.DATABASE_DATABASE, // env파일에서 수정 entities: [__dirname + '/apis/**/*.entity.*'], // 수정 synchronize: true, logging: true, }), ], }) export class AppModule {} 위와같이 코드 작성했고터미널에서 yarn start:dev 할경우아래와 같이 오류가 떠서 작동이 되지않습니다.어떻게하면 될까요?[Nest] 13226 - 2024. 03. 15. 오전 10:07:01 ERROR [TypeOrmModule] Unable to connect to the database. Retrying (1)...MissingDriverError: Wrong driver: "undefined" given. Supported drivers are: "aurora-mysql", "aurora-postgres", "better-sqlite3", "capacitor", "cockroachdb", "cordova", "expo", "mariadb", "mongodb", "mssql", "mysql", "nativescript", "oracle", "postgres", "react-native", "sap", "sqlite", "sqljs", "spanner". at DriverFactory.create (/home/seasnake/CODECAMP-BACKEND-CLASS/class/section10/10-01-mysql-relation/src/driver/DriverFactory.ts:72:23) at new DataSource (/home/seasnake/CODECAMP-BACKEND-CLASS/class/section10/10-01-mysql-relation/src/data-source/DataSource.ts:149:43) at createTypeormDataSource (/home/seasnake/CODECAMP-BACKEND-CLASS/class/section10/10-01-mysql-relation/node_modules/@nestjs/typeorm/dist/typeorm-core.module.js:164:23) at /home/seasnake/CODECAMP-BACKEND-CLASS/class/section10/10-01-mysql-relation/node_modules/@nestjs/typeorm/dist/typeorm-core.module.js:169:36 at Observable._subscribe (/home/seasnake/CODECAMP-BACKEND-CLASS/class/section10/10-01-mysql-relation/node_modules/rxjs/src/internal/observable/defer.ts:55:15) at Observable._trySubscribe (/home/seasnake/CODECAMP-BACKEND-CLASS/class/section10/10-01-mysql-relation/node_modules/rxjs/src/internal/Observable.ts:244:19) at /home/seasnake/CODECAMP-BACKEND-CLASS/class/section10/10-01-mysql-relation/node_modules/rxjs/src/internal/Observable.ts:234:18 at Object.errorContext (/home/seasnake/CODECAMP-BACKEND-CLASS/class/section10/10-01-mysql-relation/node_modules/rxjs/src/internal/util/errorContext.ts:29:5) at Observable.subscribe (/home/seasnake/CODECAMP-BACKEND-CLASS/class/section10/10-01-mysql-relation/node_modules/rxjs/src/internal/Observable.ts:220:5) at subscribeForRetryWhen (/home/seasnake/CODECAMP-BACKEND-CLASS/class/section10/10-01-mysql-relation/node_modules/rxjs/src/internal/operators/retryWhen.ts:74:25)
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
오픈채팅방 추가 개설 문의
안녕하세요 강사님오픈채팅방 정원이 다 차서 접속이 불가하네요 ㅠㅠ혹시 오픈 채팅방 추가 개설 예정은 없으실까요?
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
docker-compose up 오류
docker-compose up을 사용하면 initdb: error: directory "/var/lib/postgresql/data" exists but is not emptyinitdb: hint: If you want to create a new database system, either remove or empty the directory "/var/lib/postgresql/data" or run initdb with an argument other than "/var/lib/postgresql/data". 라는 오류가 자꾸 발생합니다. 삭제하고 다시 해도 해결이 안되서 질문남깁니다. 어떻게 해결해야하나요.
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
암호화관련 문제
알려주신대로 어찌어찌 수정을 해서 실행이 됐습니다!그런데 이번엔 암호화 관련해서 다음과 같은 오류가 생겨 질문 드립니다..Error: error:0308010C:digital envelope routines::unsupported at new Hash (node:internal/crypto/hash:68:19) at Object.createHash (node:crypto:138:10) at module.exports (C:\Users\User\Documents\boiler-plate\client\node_modules\webpack\lib\util\createHash.js:135:53) at NormalModule._initBuildHash (C:\Users\User\Documents\boiler-plate\client\node_modules\webpack\lib\NormalModule.js:417:16) at handleParseError (C:\Users\User\Documents\boiler-plate\client\node_modules\webpack\lib\NormalModule.js:471:10) at C:\Users\User\Documents\boiler-plate\client\node_modules\webpack\lib\NormalModule.js:503:5 at C:\Users\User\Documents\boiler-plate\client\node_modules\webpack\lib\NormalModule.js:358:12 at C:\Users\User\Documents\boiler-plate\client\node_modules\loader-runner\lib\LoaderRunner.js:373:3 at iterateNormalLoaders (C:\Users\User\Documents\boiler-plate\client\node_modules\loader-runner\lib\LoaderRunner.js:214:10) at iterateNormalLoaders (C:\Users\User\Documents\boiler-plate\client\node_modules\loader-runner\lib\LoaderRunner.js:221:10) C:\Users\User\Documents\boiler-plate\client\node_modules\react-scripts\scripts\start.js:19 throw err; ^ Error: error:0308010C:digital envelope routines::unsupported at new Hash (node:internal/crypto/hash:68:19) at Object.createHash (node:crypto:138:10) at module.exports (C:\Users\User\Documents\boiler-plate\client\node_modules\webpack\lib\util\createHash.js:135:53) at NormalModule._initBuildHash (C:\Users\User\Documents\boiler-plate\client\node_modules\webpack\lib\NormalModule.js:417:16) at C:\Users\User\Documents\boiler-plate\client\node_modules\webpack\lib\NormalModule.js:452:10 at C:\Users\User\Documents\boiler-plate\client\node_modules\webpack\lib\NormalModule.js:323:13 at C:\Users\User\Documents\boiler-plate\client\node_modules\loader-runner\lib\LoaderRunner.js:367:11 at C:\Users\User\Documents\boiler-plate\client\node_modules\loader-runner\lib\LoaderRunner.js:233:18 at context.callback (C:\Users\User\Documents\boiler-plate\client\node_modules\loader-runner\lib\LoaderRunner.js:111:13) at C:\Users\User\Documents\boiler-plate\client\node_modules\babel-loader\lib\index.js:59:103 { opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ], library: 'digital envelope routines', reason: 'unsupported', code: 'ERR_OSSL_EVP_UNSUPPORTED' }
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
모듈 경로 관련 오류 index.js 모듈을 찾을 수 없다고 해서 수정을 했는데 이번엔 User를 못찾네요..
어제까진 잘 실행이 되었는데 갑자기 이러니까 당황스러워요..먼저Error: Cannot find module 'C:\Users\User\Documents\boiler-plate\index.js' at Module._resolveFilename (node:internal/modules/cjs/loader:1048:15) at Module._load (node:internal/modules/cjs/loader:901:27) at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:83:12) at node:internal/main/run_main_module:23:47 { code: 'MODULE_NOT_FOUND', requireStack: [] } Node.js v20.9.0 [nodemon] app crashed - waiting for file changes before starting...이런 에러가 떠서 package.json의 backend 쪽을"backend": "nodemon server/index.js"이렇게 수정했더니 이번엔Error: Cannot find module '../server/models/User' Require stack: - C:\Users\User\Documents\boiler-plate\server\middleware\auth.js - C:\Users\User\Documents\boiler-plate\server\index.js at Module._resolveFilename (node:internal/modules/cjs/loader:1048:15) at Module._load (node:internal/modules/cjs/loader:901:27) at Module.require (node:internal/modules/cjs/loader:1115:19) at require (node:internal/modules/helpers:130:18) at Object.<anonymous> (C:\Users\User\Documents\boiler-plate\server\middleware\auth.js:1:18) at Module._compile (node:internal/modules/cjs/loader:1241:14) at Module._extensions..js (node:internal/modules/cjs/loader:1295:10) at Module.load (node:internal/modules/cjs/loader:1091:32) at Module._load (node:internal/modules/cjs/loader:938:12) at Module.require (node:internal/modules/cjs/loader:1115:19) { code: 'MODULE_NOT_FOUND', requireStack: [ 'C:\\Users\\User\\Documents\\boiler-plate\\server\\middleware\\auth.js', 'C:\\Users\\User\\Documents\\boiler-plate\\server\\index.js' ] }이런 오류가 뜨네요.. 계속 찾아보는데 경로도 다 맞는 것 같은데 어디서 문제가 발생하고 어떻게 해결해야 하는 지를 모르겠어요..우선 혹시 몰라 package.json 전체 첨부 해놓겠습니다!그리고 강의는 21강 까지 들었습니다!{ "name": "boiler-plate", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "start": "node index.js", "backend": "nodemon server/index.js", "test": "echo \"Error: no test specified\" && exit 1" }, "author": "in-sik", "license": "ISC", "dependencies": { "bcrypt": "^5.1.1", "body-parser": "^1.20.2", "cookie-parser": "^1.4.6", "express": "^4.18.3", "index.js": "^0.0.3", "jsonwebtoken": "^9.0.2", "mongoose": "^8.2.1" }, "devDependencies": { "nodemon": "^3.1.0" } }
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
8.4) Create - 투두 추가하기 부분에서 SyntheticBaseEvent가 저장됩니다.
투두 리스트 실습하고 있는데, 입력폼을 통해 입력한 항목이 State에 저장되지 않고, SyntheticBaseEvent가 저장되어 있네요84) Create - 투두 추가하기 7:21 부분에서 INPUT에 항목을 입력하고 [추가] 버튼을 누르면 content 부분에 입력 텍스트가 아닌 합성이벤트 객체가 저장되는데 무슨 문제인지 궁금합니다. 덧. 다시한번 작성해보니 OnCreate 함수를 전달받아 추가 버튼을 눌러 onSubmit 할때 파라미터로 content 스테이트값을 전달했네요 -_-);; 해결되었습니다만, 이 과정에서 어떤 문제가 있었나 보네요, content를 다시한번 참조하는 상태가 된건가요? 값을 전달한게 아니라 참조가 전달된거라고 보면 될려나요.. [ -------SyntheticBaseEvent가 생성된 코드-------]const onSubmit = (content) => {onCreate(content);}
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
Link 적용하기 관련 문의드립니다.
Link 수업 듣는 중에 아래 질문과 같이 동일한 문제가 발생했는데요(상품 클릭 시, 링크 변경은 되는데 페이지 이동이 안되는 현상)https://www.inflearn.com/questions/645148/link-%EC%A0%81%EC%9A%A9%ED%95%98%EA%B8%B0-%EA%B4%80%EB%A0%A8%EC%A7%88%EB%AC%B8 질문 확인하고<React.StrictMode> 을 제거하기 전에는 상품카드를 클릭했을때 url만 변경되고 페이지가 새로고침되지 않았습니다.<React.StrictMode> 제거해야지만 클릭시 url변경 + 페이지 새로고침까지 되었습니다강의와 동일하게 작성하였는데 왜 <React.StrictMode> 제거 후 문제가 해결된걸까요?
-
미해결쿠버네티스 101 - 클라우드/서버 개발 첫걸음
minikube service명령어를 입력시 해당 에러가 뜹니다
vscode상에서는 url이 발생하지만 접속시 접속할수 없다고 뜨고서 해당로그가 발생됩니다 docker 접속오류라는데 도커는 정상작동을 합니다
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
라우터에서 빈 화면 나오시는 분들
Switch 문이 버전 6에서 사라졌다고 하네요. Route에서 props로 element 보내는 방법을 사용해서 코드를 수정해보았습니다. 참고하시면 좋을 거 같아요. import { BrowserRouter as Router, Routes, Route } from "react-router-dom" import NavBar from "./components/views/NavBar/NavBar"; import Footer from "./components/views/Footer/Footer"; import LandingPage from "./components/views/LandingPage/LandingPage"; import LoginPage from "./components/views/LoginPage/LoginPage"; import RegisterPage from "./components/views/RegisterPage/RegisterPage"; function App() { return ( <> <NavBar /> <Router> <Routes> <Route path="/" element={<LandingPage />} /> <Route path="/login" element={<LoginPage />} /> <Route path="/register" element={<RegisterPage />} /> </Routes> </Router> <Footer /> </> ); } export default App;
-
미해결[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
중고마켓 찜하기 토글 기능 데이터 값 저장법
안녕하세요.현재 찜하기 기능을 추가하는 작업을 진행중입니다.전체적으로 설명드리면 찜하기 Hook을 만들고 ProductDetail 컴포넌트에 Hook의 리턴 값을 보내어 작업하였습니다. 찜하기 API의 결과 값으로 off시 0, on 시 1을 출력하여 그 값을 state에 저장하여 상품디테일 컴포넌트로 리턴하여 작업하는 중입니다. 그런데 state의 초기값을 토글의 결과값을 가져와서 넣어주어야 하는데 어떻게 해야할지 잘 모르겠습니다. 제가 생각해본 방법으론 상품 컴포넌트에서 state를 새로 만들어 가져온 pick의 변수를 set에 담았더니 랜더링이 많아진다면서 오류가 떴습니다.혹시 제가 작업하는 방향이 틀린 것인지 궁금하고, 어떻게 문제를 해결해야할지 잘 몰라 질문 드립니다!
-
미해결mongoDB 기초부터 실무까지(feat. Node.js)
await 관련해서 질문드릴게 있습니다!!
안녕하세요 강사님 !! ㅎㅎ 강의 재밌게 듣고 있습니다. async await 방식이 코틀린의 코루틴과 굉장히 유사하다고 생각이 되는데 그럼 다음과 같이 Promise.all 대신 await를 늦추는 방식으로 풀어써도 똑같이 동작하나요?? async createBlog() => { await Promise.all([ Blog.insertOne({...}), // 1000ms User.UpdateOne({...}) // 1000ms ]) } // 실행시간 : 1000ms // 질문코드 async createBlog() => { const blogPromise = Blog.insertOne({...}) // 1000 ms const userPromise = User.updateOne({...}) // 1000 ms A(await blogPromise, await userPromise) } // 실행시간 : 1000ms(?)
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
portfolio review 코드 말고 수업 예제 코드는 없을까요?
컴퓨터를 교체해서 앞에 수업했던 파일들이 다 날아갔는데 강의 뒷부분에서 재활용 되는 경우가 있더라구요.. 깃허브에는 포폴용 과제만 샘플 코드가 제공되는 것 같아서 혹시 수업 파일도 올려주실 수 있으실까요?