무료
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
localStorage에 userId가 어떻게 저장되는건지 궁금합니다
localStorage에 userId 저장하는 코드는 따로 작성하지 않은 것 같은데 자동으로 저장되는건가요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
비디오 전체 코멘트 수 가져오기 질문 드립니다!
안녕하세요! 강의 전체 수강 후 여러 질문들을 확인하다가 코멘트 수를 가져오는 코드를 봐서 실제 프로젝트에 적용 시켰습니다! 그런데 videos.map((video, index) => { } 안에서는 "commentNum" 코멘트 수가 나오는데 실제 화면 콘솔에서 찍었을 때는 누락이 되어서 질문 남깁니다... Github : https://github.com/kimsojung318/youtube-clone # router/video.js router.get('/getVideos', (req, res) => { // 비디오를 DB에서 가져와서 client에 전달함 // Video 컬렉션에 있는 모든 비디오를 가져온다. Video.find() .populate('writer') // 하지 않으면 비디오 ID만 가져오게 된다. .exec((err, videos) => { if (err) return res.status(400).send(err); // 총 댓글 수 구하기 videos.map((video, index) => { Comment.find({ 'postId': video._id }) .exec((err, comments) => { if (err) { return res.status(400).json({ success: false, err }); } // models/Video.js "commentNum" Schema 추가 video.commentNum = comments.length; console.log("commentNum 추가 : ", video); }) // exec }); // map console.log("최종 : ", videos); res.status(200).json({ success: true, videos }) }); // .find().exec });
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
useSelector질문
이전 영상에서는 로그인 user정보를 useSelector로 불러오셨었습니다. 그래서 리덕스도 썼겠다 useSelector로 정보 받아오면 되는데 굳이 local에 저장해두고 다시 받아오는 이유가 있을까요? 그리고 useSelector로 받아올 때 let user = useSelector(state -> state.user); 이후 user.userData._id; 로 접근하면 문제가 발생하지 않는데 let userID = useSelector(state => state.user.userData._id); 처럼 바로 접근하면 state.user.userData가 undefine되버려서 에러가 납니다. 항상 그런건 아니고 페이지 옮겨다니다보면 5번 중에 1번 그러던데 왜 그런지 알 수 있을까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
route 폴더관한 질문입니다!
안녕하세요! 항상 좋은 강의 해주셔서 감사합니다. route 폴더안에 있는 js파일에 관해 질문드립니다 완성본의 user.js파일을 보니 boiler plate의 server에 있는 index.js의 파일과 거의 흡사한것 같더라구요. 그래서 완성본의 index.js파일을 보니 bolier plate의 index.js의 내용과는 또 조금 다른 것들이 있는 것 같습니다. 혹시 이 부분 강의 유투브 영상있을까요?? 그냥 복붙하자니ㅜㅜ 모르고 넘어가는 내용이 있는건 아닌가해서 질문드립니다! 감사합니다!
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
댓글은 생성이 되는데 대댓글 생성이 안 됩니다
let renderReplyComment=(parentCommentId)=>{ for (let i=0;i<8;i++){ if (props.commentLists[i].responseTo === parentCommentId){ console.log(props.commentLists[i].content) } } props.commentLists.map((comment,index)=>( (comment.responseTo === parentCommentId && <React.Fragment> <div style={{ width: '80%', marginLeft: '40px' }}> <SingleComment comment={comment} postId={props.videoId} refreshFunction={props.refreshFunction} /> <ReplyComment CommentLists={props.CommentLists} parentCommentId={comment._id} postId={props.videoId} refreshFunction={props.refreshFunction} /> </div> </React.Fragment> ) )) ReplyComment.js 코드 안에서서 대댓글을 생성하는 코드입니다. 위 함수에 아예 못 들어가는건가 싶어서 안에 for문으로 responseTo와 parentCommentID가 같을 경우 content log를 찍어봤는데 정확히 잘 나오는걸 확인했습니다. 그런데 대댓글 생성은 안됩니다. 아래가 제 실행 결과이고 그냥 댓글 생성은 되는것으로 보아 singleComment.js 파일은 문제가 없는거 같은데 대댓글이 생성 안 되는 이유를 모르겠습니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
혹여나 window에서ffmpeg 다운 하시는것 모르시면 참고하세요.
제가 공부할 목적으로 블로그에 정리하면서 하고 있는데 맥이 아니고 윈도우로 하시면서 ffmpeg 다운하는게 어렵다하면 보면서 해보세요. 최대한 스크린샷 찍으면서 해놨는데 참고요. https://3dpit.tistory.com/440
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
eslint관련 컴파일 경고
안녕하세요. 이번 유튜브 강의 잘 듣고 있습니다. 감사합니다. 마지막 좋아요 강의를 듣고 확인하려고 서버를 구동시켰는데, 갑자기 아래와 같은 메세지가 나오기 시작했는데요. 검색을 해서 해결하려고 노력을 해 봤으나 잘 안 되네요. 해결 방법을 좀 알고 싶습니다. - 터미널 화면 - 웹 화면
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
VideoDetailPage로 넘어갈 때 404 error
랜딩페이지 로드할 때 DB에서 비디오 정보 가져올 때는 오류 없어 잘 돼는데 이상하게 디테일페이지에서 불러올때는 노드쪽(?) path 가 undefined 가 뜨네요ㅜㅜ 오른쪽에 6032...저게 비디오 아이디랑 똑같은데 왜 저렇게 뜨는지 못찾겠어서요..! 페이지 로딩은 됩니다.. 영상 썸네일? 은 뜨는듯한데 재생은 또 안되구요..ㅜㅜ 그리고 어쩔때는 videoDetail이 이예 넘어오질 않습니다. node 쪽 콘솔로 정보가 잘 왔는지 찍어보면 req.body 에 variable 이 없어요ㅜㅜ 깃헙 주소 남깁니다! 영상은 .mov 인데 이거는 비디오 업로드 시에 .mp4 와 || .mov 둘다 가능하게 작성하긴 했습니당 https://github.com/silverwest8/YoutubeCLONE 답변주시면 정말 감사하겠습니다!😀
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
npm run dev 에서 부터 막힙니다.
(node:5188) Warning: Accessing non-existent property 'count' of module exports inside circular dependency [0] (Use `node --trace-warnings ...` to show where the warning was created) [0] Server Listening on 5000 [0] (node:5188) Warning: Accessing non-existent property 'findOne' of module exports inside circular dependency [0] (node:5188) Warning: Accessing non-existent property 'remove' of module exports inside circular dependency [0] (node:5188) Warning: Accessing non-existent property 'updateOne' of module exports inside circular dependency [1] Failed to compile. [1] [1] ./src/components/views/LoginPage/LoginPage.js [1] Attempted import error: 'Icon' is not exported from 'antd'. [0] MongoDB Connected... 이러한 에러가 뜨고 ICON이 antd에서 익스포트되는게 아니라는데 어떻게 해결해야 되나요?
- 따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
초기에 서버랑 클라이언트 켰을때 선생님 화면이랑 달라요
삭제된 글입니다
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
npm run dev 오류
작동시킨 부분부터 에러 내용까지입니다 PS C:\Users\82108\Desktop\boilerplate-mern-stack-master\client> cd.. PS C:\Users\82108\Desktop\boilerplate-mern-stack-master> npm run dev > react-boiler-plate@1.0.0 dev C:\Users\82108\Desktop\boilerplate-mern-stack-master > concurrently "npm run backend" "npm run start --prefix client" 'concurrently'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! react-boiler-plate@1.0.0 dev: `concurrently "npm run backend" "npm run start --prefix client"` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the react-boiler-plate@1.0.0 dev script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm WARN Local package.json exists, but node_modules missing, did you mean to install? npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\82108\AppData\Roaming\npm-cache\_logs\2021-02-19T02_39_42_907Z-debug.log Explorer에 node_modules랑 dev.js가 회색글자이면 뭔가 그 부분들에 구동이 안된걸까요? node-v로 노드 깔린건 확인했고 몽고db는 설치할때 강의랑 화면이 좀 다르긴 했는데 깔린거같긴 하거든요.. 혹시 몽고db도 깔렸는지 노드처럼 확인하는 방법이 있을까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
왜 comment 컴포넌트가 아닌 video detail page에서 댓글을 가져오고 comment 컴포넌트로 보내나요?
정말 궁금합니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
post관련질문(깃헙링크남겨놨습니다.)
https://github.com/yunjunghun0116/myyoutubeapp_with_react 위 링크는 제 코드 링크입니다. 왜인지 모르겠으나 여러가지 수정을 해보아도 제자리걸음이기에 처음부터 다시 시작해보았으나 같은곳에서 오류가 생기네요 어제부터 거의 한 다섯시간은 구글링에 시간을 쓴듯하네요,, 아무리 알아봐도 제가 해결할수 없는것같아서 도움을 요청해봅니다. john ahn 님 무엇이 문제인지 알아봐주시길 바랍니다. 1.Failed to load resource: the server responded with a status of 404 (Not Found) 2.POST http://localhost:3000/video/api/video/uploadfiles 404 (Not Found) 이뿐아니라 504 error, 500 error도 나타날때도있고 안나타날때도있어서 참 의문입니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
이거 무슨 오류인가요?
[0] (node:14348) Warning: Accessing non-existent property 'count' of module exports inside circular dependency [0] (Use `node --trace-warnings ...` to show where the warning was created) [0] (node:14348) Warning: Accessing non-existent property 'findOne' of module exports inside circular dependency [0] (node:14348) Warning: Accessing non-existent property 'remove' of module exports inside circular dependency [0] (node:14348) Warning: Accessing non-existent property 'updateOne' of module exports inside circular dependency [0] Server Listening on 5000 [0] MongooseError [MongooseServerSelectionError]: bad auth : Authentication failed. [0] at new MongooseServerSelectionError (C:\Users\jimin\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\mongoose\lib\error\serverSelection.js:22:11) [0] at NativeConnection.Connection.openUri (C:\Users\jimin\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\mongoose\lib\connection.js:823:32) [0] at Mongoose.connect (C:\Users\jimin\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\mongoose\lib\index.js:333:15) [0] at Object.<anonymous> (C:\Users\jimin\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\server\index.js:18:26) [0] at Module._compile (internal/modules/cjs/loader.js:1063:30) [0] at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10) [0] at Module.load (internal/modules/cjs/loader.js:928:32) [0] at Function.Module._load (internal/modules/cjs/loader.js:769:14) [0] at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12) [0] at internal/main/run_main_module.js:17:47 { [0] reason: TopologyDescription { [0] type: 'ReplicaSetNoPrimary', [0] setName: null, [0] maxSetVersion: null, [0] maxElectionId: null, [0] servers: Map(3) { [0] 'cluster0-shard-00-00.xpl7k.mongodb.net:27017' => [ServerDescription], [0] 'cluster0-shard-00-01.xpl7k.mongodb.net:27017' => [ServerDescription], [0] 'cluster0-shard-00-02.xpl7k.mongodb.net:27017' => [ServerDescription] [0] }, [0] stale: false, [0] compatible: true, [0] compatibilityError: null, [0] logicalSessionTimeoutMinutes: null, [0] heartbeatFrequencyMS: 10000, [0] localThresholdMS: 15, [0] commonWireVersion: null [0] }, [0] [Symbol(mongoErrorContextSymbol)]: {} [0] } 이게 무슨 오류인가요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
npm run dev 실행 시 에러
아래와 같은 에러 발생합니다.. 피드백 주세요.. 그리고 dev.js 파일 예시 들어주세요 <username>:<password>....?<dbname> 이렇게 작성하라고 했을 때 꺽새 안에 내용만 수정해주면 되는지 꺽새를 지우고 새로 생성한 username과 password를 입력해야 하는지요 C:\Users\rlawj\프로젝트\노드, 리액트 시리즈 - 유튜브 사이트 만들기\boilerplate-youtube-app>npm run dev (node:16228) ExperimentalWarning: The fs.promises API is experimental > react-boiler-plate@1.0.0 dev > concurrently "npm run backend" "npm run start --prefix client" [0] (node:9828) ExperimentalWarning: The fs.promises API is experimental [1] (node:7100) ExperimentalWarning: The fs.promises API is experimental [0] [0] > react-boiler-plate@1.0.0 backend [0] > nodemon server/index.js [0] [1] [1] > client@0.1.0 start [1] > react-scripts start [1] [0] [nodemon] 1.19.4 [0] [nodemon] to restart at any time, enter `rs` [0] [nodemon] watching dir(s): *.* [0] [nodemon] watching extensions: js,mjs,json [0] [nodemon] starting `node server/index.js` [0] Server Listening on 5000 [1] [HPM] Proxy created: / -> http://localhost:5000 [1] i 「wds」: Project is running at http://0.0.0.0:3000/ [1] i 「wds」: webpack output is served from [1] i 「wds」: Content not from webpack is served from C:\Users\rlawj\프로젝트\노드, 리액트 시리즈 - 유튜브 사이트 만들 기\boilerplate-youtube-app\client\public [1] i 「wds」: 404s will fallback to / [1] Starting the development server... [1] [1] Browserslist: caniuse-lite is outdated. Please run: [1] npx browserslist@latest --update-db [1] Failed to compile. [1] [1] ./src/components/views/LoginPage/LoginPage.js [1] Attempted import error: 'Icon' is not exported from 'antd'. [0] { MongooseServerSelectionError: connection <monitor> to 54.255.110.161:27017 closed [0] at new MongooseServerSelectionError (C:\Users\rlawj\프로젝트\노드, 리액트 시리즈 - 유튜브 사이트 만들기\boile rplate-youtube-app\node_modules\mongoose\lib\error\serverSelection.js:22:11) [0] at NativeConnection.Connection.openUri (C:\Users\rlawj\프로젝트\노드, 리액트 시리즈 - 유튜브 사이트 만들기\bo ilerplate-youtube-app\node_modules\mongoose\lib\connection.js:823:32) [0] at Mongoose.connect (C:\Users\rlawj\프로젝트\노드, 리액트 시리즈 - 유튜브 사이트 만들기\boilerplate-youtube-a pp\node_modules\mongoose\lib\index.js:333:15) [0] at Object.<anonymous> (C:\Users\rlawj\프로젝트\노드, 리액트 시리즈 - 유튜브 사이트 만들기\boilerplate-youtube -app\server\index.js:18:26) [0] at Module._compile (internal/modules/cjs/loader.js:776:30) [0] at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10) [0] at Module.load (internal/modules/cjs/loader.js:653:32) [0] at tryModuleLoad (internal/modules/cjs/loader.js:593:12) [0] at Function.Module._load (internal/modules/cjs/loader.js:585:3) [0] at Function.Module.runMain (internal/modules/cjs/loader.js:829:12) [0] at startup (internal/bootstrap/node.js:283:19) [0] at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3) [0] message: 'connection <monitor> to 54.255.110.161:27017 closed', [0] name: 'MongooseServerSelectionError', [0] reason: [0] TopologyDescription { [0] type: 'ReplicaSetNoPrimary', [0] setName: null, [0] maxSetVersion: null, [0] maxElectionId: null, [0] servers: [0] Map { [0] 'clonereactnode-shard-00-01.tbmhv.mongodb.net:27017' => [ServerDescription], [0] 'clonereactnode-shard-00-00.tbmhv.mongodb.net:27017' => [ServerDescription], [0] 'clonereactnode-shard-00-02.tbmhv.mongodb.net:27017' => [ServerDescription] }, [0] stale: false, [0] compatible: true, [0] compatibilityError: null, [0] logicalSessionTimeoutMinutes: null, [0] heartbeatFrequencyMS: 10000, [0] localThresholdMS: 15, [0] commonWireVersion: null }, [0] [Symbol(mongoErrorContextSymbol)]: {} }
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
생각해봤는데 왜 영상을 저장할 때 redux를 사용하지 않나요?
안녕하세요. 공부중에 갑자기 의문이 들어 질문드립니다. boiler-plate강의에선 redux를 사용하여 state를 store에 저장하였는데 왜 이 강의에선 redux를 사용하지 않는지 궁금합니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
동영상이 아닌 사진 저장
동영상이 아닌 사진으로 올리려고 하는데 사진 사이즈를 바꾸고 렌더 시키고 싶어서 ffmpeg의 screenshot의 옵션 이용했는데 썸네일이 저장이 안되네요 ㅠ 혹시 사진 사이즈를 바꾸고 렌더시킬 수 있는 방법이 있을까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
model에서 Comment.Find를 할때 궁금한것이 있습니다.
Comment.find({'_id':comment._id}) .populate('writer') .exec((err,result)=>{ if(err) return res.json({seccess:false,err}) res.status(200).json({success:true,result}); }) 파라미터로 _id를 보냈는데, 이는 writer의 User에 대한 _id 인지 궁금합니다. Comment 모델 자체의 필드값은 _id를 받을수 있는게 없어 보여서, 저 뜻이 writer에 대한 _id 정보를 가져온다는 뜻으로 봐야할까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
Thumbnail 질문입니다.ㅠㅠㅠ
upload video에서 동영상을 업로드했을때 console로 video, thumbnail 모두 정상적으로 success가 되었는데 dropzone 옆에 썸네일이 업로드 되지 않고 GET http://localhost:5000/uploads/thumbnails/thumbnail-1612037280879_Fog_1.png 404 (Not Found) 오류가 나옵니다 ㅠㅠ. 하아..미치겠습니다 어디가 문제인지 모르겠숩니다 ㅠㅠ..
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
질문있습니다.
강사님 안녕하세요. 강사님이 올리신 강의를 클론하면서 추가적으로 기능 구현을 하고있는데 유튜브페이지처럼 검색기능을 만들고 있는 과정에서 막히는 부분이 있어 질문드립니다. 검색 input을 NavBar에 만들었는데 서버에서는 NavBar컴포넌트에서 원하는 값을 입력할 시 로그에는 들어오는 게 확인 되었는데 이것을 LandingPage에 전달하는 방법이 애매모호해서 질문드립니다. https://github.com/kwj5584/React-Youtube