무료
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
server npm install 오류
서버에서 npm install 을 하였는데 gyp ERR! find Python gyp ERR! find Python Python is not set from command line or npm configuration gyp ERR! find Python Python is not set from environment variable PYTHON gyp ERR! find Python checking if "python" can be used gyp ERR! find Python - "python" is not in PATH or produced an error gyp ERR! find Python checking if "python2" can be used gyp ERR! find Python - "python2" is not in PATH or produced an error gyp ERR! find Python checking if "python3" can be used gyp ERR! find Python - "python3" is not in PATH or produced an error gyp ERR! find Python checking if the py launcher can be used to find Python 2 gyp ERR! find Python - "py.exe" is not in PATH or produced an error gyp ERR! find Python checking if Python is C:\Python27\python.exe gyp ERR! find Python - "C:\Python27\python.exe" could not be run gyp ERR! find Python checking if Python is C:\Python37\python.exe gyp ERR! find Python - "C:\Python37\python.exe" could not be run gyp ERR! find Python gyp ERR! find Python ********************************************************** gyp ERR! find Python You need to install the latest version of Python. gyp ERR! find Python Node-gyp should be able to find and use Python. If not, gyp ERR! find Python you can try one of the following options: gyp ERR! find Python - Use the switch --python="C:\Path\To\python.exe" gyp ERR! find Python (accepted by both node-gyp and npm) gyp ERR! find Python - Set the environment variable PYTHON gyp ERR! find Python - Set the npm configuration variable python: gyp ERR! find Python npm config set python "C:\Path\To\python.exe" gyp ERR! find Python For more information consult the documentation at: gyp ERR! find Python https://github.com/nodejs/node-gyp#installation gyp ERR! find Python ********************************************************** gyp ERR! find Python gyp ERR! configure error gyp ERR! stack Error: Could not find any Python installation to use gyp ERR! stack at PythonFinder.fail (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:307:47) gyp ERR! stack at PythonFinder.runChecks (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:136:21) gyp ERR! stack at PythonFinder.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:225:16) gyp ERR! stack at PythonFinder.execFileCallback (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:271:16) gyp ERR! stack at exithandler (child_process.js:397:5) gyp ERR! stack at ChildProcess.errorhandler (child_process.js:409:5) gyp ERR! stack at ChildProcess.emit (events.js:400:28) gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12) gyp ERR! stack at onErrorNT (internal/child_process.js:467:16) gyp ERR! stack at processTicksAndRejections (internal/process/task_queues.js:82:21) gyp ERR! System Windows_NT 10.0.19043 gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "configure" "--fallback-to-build" "--module=C:\\react-youtube-clone-master\\node_modules\\bcrypt\\lib\\binding\\bcrypt_lib.node" "--module_name=bcrypt_lib" "--module_path=C:\\react-youtube-clone-master\\node_modules\\bcrypt\\lib\\binding" "--napi_version=8" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v83" gyp ERR! cwd C:\react-youtube-clone-master\node_modules\bcrypt gyp ERR! node -v v14.17.6 gyp ERR! node-gyp -v v5.1.0 gyp ERR! not ok node-pre-gyp ERR! build error node-pre-gyp ERR! stack Error: Failed to execute 'C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=C:\react-youtube-clone-master\node_modules\bcrypt\lib\binding\bcrypt_lib.node --module_name=bcrypt_lib --module_path=C:\react-youtube-clone-master\node_modules\bcrypt\lib\binding --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1) node-pre-gyp ERR! stack at ChildProcess.<anonymous> (C:\react-youtube-clone-master\node_modules\node-pre-gyp\lib\util\compile.js:83:29) node-pre-gyp ERR! stack at ChildProcess.emit (events.js:400:28) node-pre-gyp ERR! stack at maybeClose (internal/child_process.js:1055:16) node-pre-gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:288:5) node-pre-gyp ERR! System Windows_NT 10.0.19043 node-pre-gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\react-youtube-clone-master\\node_modules\\node-pre-gyp\\bin\\node-pre-gyp" "install" "--fallback-to-build" node-pre-gyp ERR! cwd C:\react-youtube-clone-master\node_modules\bcrypt node-pre-gyp ERR! node -v v14.17.6 node-pre-gyp ERR! node-pre-gyp -v v0.12.0 node-pre-gyp ERR! not ok Failed to execute 'C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=C:\react-youtube-clone-master\node_modules\bcrypt\lib\binding\bcrypt_lib.node --module_name=bcrypt_lib --module_path=C:\react-youtube-clone-master\node_modules\bcrypt\lib\binding --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1) npm WARN rollback Rolling back node-pre-gyp@0.12.0 failed (this is probably harmless): EPERM: operation not permitted, scandir 'C:\react-youtube-clone-master\node_modules\fsevents\node_modules' npm WARN react-chat-app@1.0.0 No repository field. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! bcrypt@3.0.6 install: `node-pre-gyp install --fallback-to-build` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the bcrypt@3.0.6 install script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\82102\AppData\Roaming\npm-cache\_logs\2021-11-08T02_42_50_702Z-debug.log 이런 오류가 뜨는데 파이썬을 깔아야하는건가요??? 완성본 위에 있는 깃허브는 404에러가 떠서 완성본에서 다운 받고 실행한겁니다!
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
안녕하세요 강사님!
혹시 히로쿠에 배포를 하려고 하는데 동영상 업로드하면 썸네일이나 이미지의 경로가 다 localhost에 있어서 히로쿠에 접속한 다른 유저들은 볼수가 없는데 만약 히로쿠에 배포를 할때 히로쿠사이트로 동영상/썸네일을 업로드하고 보려면 s3같은 것을 이용해야하나요? 혹시 mongodb로는 불가능한가요??
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
드랍존 내부 div에 style이 적용되지 않습니다.
안녕하세요 선생님 수업을 잘 듣고 있는 학생입니다. 영상따라 코딩을 하던중 이상한 버그? 라 해야할것이 발생해서 질문 드립니다. 우선 증상은 아래 사진과 같이 드랍존 내부에 + 아이콘이 가운데 정렬이 되지 않는 증상입니다. 드랍존 클릭시 파일탐색기가 열리는 기능은 정상적으로 작동중입니다. 다음은 제 소스코드입니다. import React from "react" import { Typography, Button, Form, message, Input, Icon } from 'antd' import Dropzone from 'react-dropzone' const { TextArea } = Input const { Title } = Typography function VideoUploadPage() { return ( <div style={{ maxWidth: '700px', margin: '2rem auto' }}> <div style={{ textAlign: 'center', marginBottom: '2rem' }}> <Title level={2}>Upload Video</Title> </div> <Form onSubmit> <div style={{ display: 'flex', justifyContent: 'space-between'}}> {/* Drop zone */} <Dropzone onDrop multiple maxSize > {({ getRootProps, getInputProps}) => ( <div style={{ width: '300px', height: '240px', border: '1px solid lightgray', alignItems: 'center', justifyContent: 'center'}} {...getRootProps()}> <input {...getInputProps()} /> <Icon type='plus' style={{ fontSize: '3rem'}}/> </div> )} </Dropzone> {/* Thumbnail */} <div> <img src alt /> </div> </div> <br/> <br/> <label>Title</label> <Input onChange value /> <br/> <br/> <label>Description</label> <TextArea onChange value /> <br/> <br/> <select onChange> <option key value></option> </select> <br/> <br/> <select onChange> <option key value></option> </select> <br/> <br/> <Button type="primary" size="large" onClick> Submit </Button> </Form> </div> ) } export default VideoUploadPage 여기서 제가 이상하다라고 말씀드리는 이유는 드랍존 내부 div에 style에서 width와 height, border같은 경우에는 화면에서 정상적으로 출력되고 있으며 값을 변경해보아도 변경된 값으로 정상적으로 출력되는데 , alignItems와 justifyContent가 적용이 되지 않는 현상이 발생하긴 때문입니다. 위 사진처럼 크롬 콘솔에서도 element가 제대로 적용된것처럼 보이는데 혹시 원인과 해결방법을 알고계신다면 알려주시면 감사하겠습니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
댓글 삭제하기
선생님 안녕하세요. 선생님 강의를 참고하여 댓글을 만들고 있습니다. 제가 만든것보다 깔끔하고 잘 적용이 되었습니다. 하지만 댓글 삭제를 하다보니 추가를 하면 생성된 데이터가 보이다 보니 response.data.result로 댓글이 바로 추가가 되는게 보이는데 삭제를 하면 댓글이 바로 삭제가 되는건 어떻게 하면 될까요? 를 이용하고 싶은데 잘 안되네요 props.refreshFunction
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
안녕하세요
안녕하세요 강사님 지금 boiler-plate register 부분에서 막히는데요 _id : 617e90b00c0aa29d27fa84ea role : 0 __v : 0 db에 이렇게 밖에 저장이 안되네요 postman success 이구요 { "name": "test1", "email": "test12@naver.com", "password" : "12312sssss31" } 코드는 똑같은데 이유를 모르겠습니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
api/video/uploadfiles 경로 404 에러뜨시는분들
root 디렉토리에 폴더명을 uploads로 만들어놔서 api/video/uploadfiles 말고 api/video/uploads 로 고쳐서 하시면 됩니다. 아마 강사님이 처음에 uploads가 아니라 uploadfiles로 선언을 하시고 추후에 uploads로 바꾸셨는데 나머지 부분이 변경이 안됐던것 같습니다. VideoUploadPage.js에서 axios.post('/api/video/uploads', formData, config) 로 고치고 server 디렉토리의 video.js에선 router.post('/uploads', (req, res) => { 로 고치면 정상적으로 작동 됩니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
깃허브 웹호스팅 배포관련
완강했습니다 그런데 이 작품을 깃허브 웹호스팅으로 배포하고싶은데 배포하면 root 디렉토리의 리드미파일만 배포되더라구요. 어떻게 해야되나요..
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
처음 페이지 npm run dev했을떄 로그인 된상태고 로그아웃안되시는분들
다음과 같은 에러가 뜨면서 안되시는분들은 몽고DB에서 자신의 IP를 허용해 주면 제대로 작동합니다. https://developer0809.tistory.com/82 해당 사이트에서 알려준대로 IP를 추가해서 다음과 같이 Network Access 에 자신의 IP나 모든 IP허용 을 해주니 제대로 작동합니다
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
개행태그 질문드립니다.
구글링 해봐도 동영상처럼 적용하는 방법이 안나와서 질문드립니다.! <br/> 태그를 집어넣어도 페이지에서는 적용이 안된듯 한행에 컴포넌트 내용이 다 표시되는데 어떤 설정을 해야하나요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
new Comment
안녕하세요 선생님. 수업 잘 듣고 있습니다! 처음으로 질문이 생겨서 질문을 등록하게되었습니다. 12:10 에서 const comment = new Comment 이렇게 만들어주신 뒤에 comment 를 그 다음줄에서 사용하였는데 이 부분에서 의문이 생겨서 질문드립니다. 다른 routes 폴더들을 보았을 때, router.post("/subscribe", (req, res) => { const subscribe = new Subscriber(req.body); subscribe.save((err, doc) => { if (err) return res.status(400).json({ success: false, err }); res.status(200).json({ success: true, doc }); }); }); 이렇게 생성해서 사용하는 것이 있고 router.post("/unSubscribe", (req, res) => { Subscriber.findOneAndDelete({ userTo: req.body.userTo, userFrom: req.body.userFrom, }).exec((err, doc) => { if (err) return res.status(400).json({ success: false, err }); res.status(200).json({ success: true, doc }); }); }); 이렇게 모델 자체를 바로 사용하는 것이 있는데 이 둘의 차이점은 어떤것일까요? ------------------------------------------------------- 그리고 또 exec 부분에서 err 뒤에 넘겨주는 것들은 사용자가 임의로 지정하는 것일까요? 어디서 정의된 것인지 헷갈릴때가 많네요 ㅠ Subscriber.find({ userFrom: req.body.userFrom }).exec( (err, subscribeInfo) => { if (err) return res.status(400).send(err); let subscribedUser = []; subscribeInfo.map((subscriber, i) => { subscribedUser.push(subscriber.userTo); }); //찾은 사람들의 비디오를 가지고 옴 Video.find({ writer: { $in: subscribedUser } }) .populate("writer") .exec((err, videos) => { if (err) return res.status(400).send(err); res.status(200).json({ success: true, videos }); }); } ); 예를 들어 이 코드에서 exec 뒤에 err , subsribeInfo map 뒤에 subscriber, i exec 뒤에 err, videos 같은것이요!!
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
업로드한 동영상 재생시 동영상이 안 보이는 문제가 있습니다.
샘플로 올려주신 mp4 파일은 동영상이 잘 재생이 되는데 제가 따로 올린 mp4파일은 소리는 나오는데 위와같이 재생바만 나오고 화면이 나오지 않는데 어떤 점이 문제인건지 알 수 있을까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
user.userData.isAuth가 읽혀지지를 않네요
항상 좋은 강의 감사드립니다. 유튜브에서 강의듣다가 인프런까지 와서 수강하고있습니다. 기본강의에서도 구체적으로 다루어지지 않아서 여기에서 질문 드립니다. /src/components/views/NavBar/Section/RightMenu.js 에서 보면 if (user.userData && !user.userData.isAuth) { 와 같은 구문이 있는데요, user.userData를 찍어보면 값들이 잘 보이는데 email: "test5@gmail.com" isAdmin: false isAuth: true name: "Kim" role: 0 _id: "6142a0cb8bf282778fc3b987" 실제로 하위 프로퍼티를 읽어보려고 하면 에러가 납니다. console.log(user.userData.isAuth) 라고 하면 TypeError: Cannot read properties of undefined (reading 'isAuth') 라고 에러가 납니다. if (user.userData && !user.userData.isAuth) { 여기도 앞의값만 판단하고 뒤의 값은 무시되는것 같아서 순서를 바꿔보거나 !user.userData.isAuth단독으로 하면 같은 에러가 납니다. 값이 있는데도 읽을 수 없다고 하니 잘 이해가 안되는군요. 메뉴부분에 user.userData.name을 표시하고싶어서 시도했는데 에러때문에 쓸 수가 없어서 localStorage를 이용하고 있습니다. Redux하고 관련이 있는건가요? Redux너무 어려워서 아직도 이해가안가서 고전중입니다. 그리고 boilerplate에 보면 client/src/components/views/LoginPage/LoginPage.js 50행에 window.localStorage.setItem('rememberMe', values.id); 이렇게 되면 undifine이 표시되어서 values.email 이 아닐까 생각합니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
port관련 에러 질문드립니다.
현재 이렇게 에러가 뜹니다. 그리고 잠시후 이렇게 뜬뒤 localhost:3000 개발 환경서버가 열리는데요. 회원가입과 로그인등 정상 작동하는데 추후 개발환경에 영향이 없는걸까요? 이상하게 localhost:5000 설정하신 코드부분의 서버를 해당 강의 들으면서 다른곳에서 열지 않았는데 사용중이라는 문구와함께 실행이되서 찝찝해서 질문드립니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
클론 코딩하면서 궁금증이 생겨 질문 드립니다.!
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요 수업 정말 잘듣고있습니다. 좋은 강의 감사합니다! 영상을 업로드하면 로컬에저장이 되고 database 에도 저장이 되는건가요? 몽고db를 사용한 것이 어떤 용도인가요?? 지금 구현한 코드를 나중에 로컬이 아닌 aws 서버 로 옮기려면 어떻게 하면 좋을까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
#5 multer로 노드 서버에 비디오 저장하기.
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. ㅇ- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 강의를 정말 재밌게 듣고있습니다. 5강에서 비디오 업로드시 오류가 있어. 해결방법을 질문드립니다. github 주소입니다..: https://github.com/jcw-logan/youtubeapp
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
안녕하세요 git 질문있습니다.
안녕하세요 강의 시작에 앞서 단계마다 깃허브에 커밋하고싶어서 시도하던 중 막히는 부분이 있어 질문드립니다. 혹시 깃허브에 대한 질문도 가능하신지 모르겠습니다^^; Server폴더 밑으로는 파일을 추가하거나 수정해도 깃허브에서는 변동사항을 감지 못하는거 같은데 이런 문제는 어떻게 해결하면 좋을까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
실행시 초기화면에서 navbar의 오른쪽 메뉴가 뜨지 않습니다.
원래대로라면 landingpage에서 signin과 signup이 떠야할 텐데 왼쪽 메뉴는 정상적으로 뜨지만 오른쪽 메뉴는 뜨지 않습니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
heroku 배포시 로그인 & 회원가입 기능 안되는 문제
안녕하세요?? 항상 강의 잘보고 있습니다! 덕분에 리액트 관련해서 틀이 잡혀가고있는데 잘안되는 문제를 해결해가면서 성장하고있습니다! 근데 배포관련해서 잘 안되는 문제가 있는데요 John의 강의 https://www.youtube.com/watch?v=qdoiwouykAg&t=20s 를 보고 배포를 하고 그외 다른강의나 구글을 통해서도 별다른 해결이 안되서 질문글을 올립니다. 이곳에 댓글도 그렇고 로그인기능 ,회원가입 기능 , 업로드기능, 댓글등 전체적으로 배포된 환경에서는 작동을 안하고있는데요 db하고 연결이 안되는건가요? 업로드같은경우는 검색을 해봤더니 s3 fileupload ?? 이런것이 있다고 답변얻었는데 로그인이나 기타 기능은 db문제와 연관있는것 같으나 마땅한 해결이 안되고있씁니다. 항상 강의 잘보고있습니다. 감사합니다! https://react-yyyyy.herokuapp.com/ 이곳은 배포된 웹주소이고 아래는 저장된코드가 있는 깃허브주소입니다.https://github.com/kongs510/react-youtube
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
열심히 따라가고 있는데 에러가 났습니다.
열심히 따라가면서 강의 수강중입니다. 그런데 위 문제가 생겼습니다. 순서를 따라가면서도 헷갈리고 솔직히 잘 모르겠습니다. 간단한 문제로 보이긴 하고 알고 나면 다음에는 해결할 것 같은데 지금 너무 모르겠습니다. 깃헙주소는 https://github.com/heesoo-park/youtube-clone 입니다. 강의도 여러번 돌려보면서 확인하고 완성본 내용도 확인하고 안 되는 영어로 구글링도 했지만 잘 풀리지 않네요 저 writer 문제뿐만 아니라 key 에러도 있더라고요 하핳;; 정신피폐해집니다...
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
로컬호스트 3000 to 5000 에러 어떻게 해결하셨나요들..
[HPM] Error occurred while trying to proxy request /api/users/register from localhost:3000 to http://localhost:5000 회원가입 submit 버튼 클릭시 에러 발생하고 무응답입니다 bcrypt 설치를 하라는 글을 보아 npm i bcrypt --save 실행해도 에러 발생하고 그 이전에 npm i -g windows-build-tools 를 먼저 설치하라는 글을 보고 설치해도 에러가 해결되지 않고 있습니다 .ㅠ. ㅠ 뭐부터 건들어 봐야 할까요