inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

[MAC] create-react-app에서 permission 에러 해결책

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

질문은 아니구요. 같은 문제로 고생하시는 분들이 많아 제 방법을 공유합니다 1) root 비밀번호 설정 2) 관리자 권한으로 설치 아래는 제가 찾은 링크이니 참고하세요 root 비밀번호 설정 https://heeestorys.tistory.com/877 관리자 권한으로 설치 https://online.codingapple.com/unit/react1-install-create-react-app-npx/

  • nodejs
  • javascript
  • 머신러닝 배워볼래요?
  • react
  • HTML/CSS
  • react-native
  • tensorflow
  • express
김준영 댓글 2 좋아요 2 조회수 421

노드 모듈스 파일 질문입니다.

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

저번 강의까진 노드 모듈스 파일이 없었고 갑자기 생겨서 저도 다운받으려고 create-react-app .을 했는데 사진처럼 뜹니다. web이란 폴더 안에 market_web, marker_server 두개의 폴더가 있고 market_web에 깔려있다고 다른 파일인 marker_server에 깔 수 없는건가요?

  • javascript
  • react-native
  • react
  • HTML/CSS
  • express
  • nodejs
  • 머신러닝 배워볼래요?
  • tensorflow
gakaotalk 댓글 4 좋아요 1 조회수 489

에러가 뜨는데 다 고쳐도 원인을 모르겠어요.

해결됨

풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)

깃헙에있는 강사님 소스 내용으로 다 덮어씌어도 똑같은 에러가 뜹니다 ㅠㅠ..

  • graphql
  • rest-api
  • react
스타현이 댓글 5 좋아요 0 조회수 513

프로필 페이지에서 새로고침 시 오류

해결됨

[리뉴얼] React로 NodeBird SNS 만들기

안녕하세요, 처음에 로그인하고 프로필로 들어가면 에러가 안나는데, 프로필페이지에서 새로고침을하면 이런 에러가뜹니다. 팔로워 팔로잉 없을때 오류인줄알고 한명씩 넣어봐도 똑같이 뜨네요,, 그래서 제로초님 코드 복붙해봐도 그대로인거 보면 코드오류는 아닌거같은데 혹시 프로필페이지 에서 새로고침시 오류뜨는거 이거 왜그럴까요..??

  • nodejs
  • react
  • redux
  • express
  • Next.js
댓글 0 좋아요 1 조회수 245

https를 위해 nginx를 도입하는 이유

미해결

[리뉴얼] React로 NodeBird SNS 만들기

안녕하세요, 제로초님! 항상 강의 정말 잘 듣고 있습니다. 더 많은 걸 가르쳐주려고 해주셔서 항상 감사합니다. 다름이 아니라, 강의에서 https의 도입을 위해 nginx를 사용하셨는데, EC2에 직접 https를 적용하지 않는 이유가 있으실까요? 프론트 / 백 모두 nginx 서버가 하나씩 추가되는 격 같은데, 이로 인한 이점이 뭔지 궁금합니다. 감사합니다!

  • https
  • nodejs
  • nginx
  • react
  • ec2
  • redux
  • express
  • Next.js
haileykmrp 댓글 1 좋아요 0 조회수 242

https와 stateless에 관해서 질문 드립니다.

미해결

모든 개발자를 위한 HTTP 웹 기본 지식

1. https에서 공개키 방식을 이용해서 직접 메세지를 암호화하지 않는 이유가 공개키 방식을 사용하면 암호화하고 복호화하는 속도가 느리기 때문에 상대적으로 속도가 빠른 대칭키 방식을 사용한다고 알고 있습니다. 그런데 https도 http이고 그러면 stateless 특징을 갖고있어서 데이터를 한번씩만 주고 받으면 어차피 끊어질텐데 굳이 대칭키 방식으로 데이터를 주고 받는 이유가 뭘까요? https에서는 stateless 특징이 적용되지 않는건가요?

  • https
  • network
  • stateless
shef 댓글 1 좋아요 6 조회수 405

세션에 관해서 질문드립니다.

미해결

모든 개발자를 위한 HTTP 웹 기본 지식

1. https에서 세션 키라고 해서 하나의 통신 세션에서 모든 메시지를 암호화하기 위해 사용되는 1회용 대칭키라고 하는게 있다는 것을 알았는데요. 여기서 세션 키에 세션이 강의에서 나온 세션과 같은 의미로 사용되는게 맞나요??

  • 세션
  • https
  • network
  • 세션키
shef 댓글 1 좋아요 1 조회수 338

https 적용 질문드립니다..

미해결

Vue로 Nodebird SNS 만들기

안녕하세요, 제로초 선생님. 강의를 끝가지 다 보았으나,, https 적용과 관련된 내용을 찾을 수 없었는데요 nuxt 서버에 적용하는 방법을 알려주시면 감사하겠습니다 ㅠㅠ

  • https
  • aws
  • vuejs
  • nodejs
  • mysql
  • vuex
  • ssr
코딩하는 해달 댓글 1 좋아요 0 조회수 234

id 넘겨주는 부분 bind

해결됨

풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)

아이디를 넘겨주는 곳에서 bind로 id 값을 바인딩 해주면 어떨까요? { isEditing ? < MsgInput mutate = { onUpdate . bind ( null , id ) } text = { text } /> : text } < button onClick = { startEdit . bind ( null , id ) } > Fix </ button >

  • react
  • graphql
  • rest-api
Boom 댓글 1 좋아요 0 조회수 206

404 오류

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

product array에 설정한 값이 다 있는 걸 보면 서버가 정상적으로 돌아가는 것 같은데 위에 404에러가 뜨는 이유가 뭘까요.?

  • 머신러닝 배워볼래요?
  • HTML/CSS
  • nodejs
  • react
  • react-native
  • express
  • tensorflow
  • javascript
댓글 1 좋아요 1 조회수 380

리액트 service workers

미해결

예전 리액트에서는 앱 인스톨만해도 서비스 워커스라는 파일이 있던데 요즘은 업데이트 되면서 사라진건가요??

  • 리액트
  • nodejs
  • 리액트js
  • react
kimho8061 댓글 0 좋아요 0 조회수 160

next.js에서 swr 서버사이드 렌더링 질문드립니다.

해결됨

[리뉴얼] React로 NodeBird SNS 만들기

next.js에 swr, typescript를 이용해 노드버드 실습을 해보다가 서버사이드 렌더링에 대해 궁금한 게 생겼습니다. 사용자가 만약 로그인을 한 상태일 때, 서버사이드 렌더링을 해서 컴포넌트에 사용자 정보를 넣어준 상태로 페이지가 보여지도록 하고 싶은데요. 강의에서는 pages/index.js에서 리덕스를 이용하여 LOAD_MY_REQUEST 액션을 dispatch 한 뒤, components/AppLayout.js 에서 useSelector로 me 값을 가져 오면 사용자 정보가 담겨진 채로 AppLayout.js 컴포넌트가 랜더링 됩니다. swr을 적용해서 동일하게 구현해보려고 하는데요. swr에서는 page/index.js에서 서버사이드에서 로그인한 사용자 정보롤 가지고 오더라도, components/AppLayout.js에서 useSWR을 사용하면 처음 [로그아웃] 상태일 때의 화면이 잠깐 나오고, [로그인]상태일 때의 모습으로 변합니다. 혹시 swr을 이용해서 pages/index.js에서 서버사이드 렌더링으로 가지고 왔던 값을 components/AppLayout.js에도 페이지 렌더링 초기에 값을 함께 전달해주는 방법은 없을까요? 제가swr을 이용해 아래처럼 적용해봤는데, 다른 방법이 있을까요? pages/index.tsx export const getServerSideProps : GetServerSideProps = async function ({ req }) { const cookie : string = req ? req . headers . cookie : '' ; if ( cookie ) { const data = await fetcher . get ( '/user' , { cookie }); if ( data ) { return { props : { userProps : data }, }; } } return { props : { userProps : null }, }; }; function Index ({ userProps }: InferGetServerSidePropsType < typeof getServerSideProps >) { const { data : user } = useSWR < IUser >( '/user' , fetcher . get , { initialData : userProps }); return < AppLayout > { user ? user . nickname : '로그인해주세요' } </ AppLayout > ; } components/AppLayout.tsx function AppLayout () { const { data : user } = useSWR < IUser >( '/user' , fetcher . get ); return ( < div css = { userNavStyle } > { user ? ( <> < Profile image = { user . profile } size = '40px' /> </> ) : ( < Link href = '/login' > < a href = '' className = 'login' > 로그인 </ a > </ Link > ) } </ div > ); }

  • Next.js
  • express
  • redux
  • nodejs
  • react
호머 댓글 1 좋아요 0 조회수 497

Refused to load the font '<URL>' because it violates the following Content Security Policy directive: 에러

미해결

안녕하세요? 보시는 것 처럼, react(프론트)/nodejs(서버) 로 간단한 앱을 만들고 heroku에 배포했더니 Refused to load the font '<URL>' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'font-src' was not explicitly set, so 'default-src' is used as a fallback. Refused to load the font 'https://fonts.gstatic.com/s/sourcesanspro/v14/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNa7lujVj9_mf.woff2' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'font-src' was not explicitly set, so 'default-src' is used as a fallback. 이런 오류 메세지가 계속 뜹니다. 많은 구글 결과 아래와 같이 메타태그를 넣어줘도 동일한 에러가 발생합니다. <meta http-equiv= "Content-Security-Policy" content= "default-src 'self' ; style-src 'self' 'unsafe-inline' https://fonts.gstatic.com/* data:; font-src 'self' data:; " > 정말 몇일 동안 ...이것만 붙들고 있는데도 해결이 안되네요 ㅠㅠ 아시는 분 부탁드립니다.

  • react
  • heroku
  • nodejs
  • deploy
  • csp
sw9142 댓글 1 좋아요 0 조회수 942

useSelect undefined 문제

미해결

따라하며 배우는 노드, 리액트 시리즈 - 기본 강의

안녕하세요~ 강사님 수업들으면서 react, redux를 배워나가는 수강생입니다. 다름이 아니라, 저 아래코드에서요 const user를 console.log 를 하니 이렇게 object 나와서, 저 userId를 가져 오려고 했는데요.. 이렇게 하니깐, userId를 읽지 못한다는 에러가 뜨더라구요. (근데 처음에는 읽어오는데, 새로고침하거나 딴 곳으로 리다렉팅하면 못 읽어오는 것 같아요) useSelect으로 위처럼 nested object들을 불러올수가 없는 건가요?

  • react
  • react
  • nodejs
sw9142 댓글 1 좋아요 0 조회수 500

그대로 따라한것 같은데 에러가 뜨는데 확인 부탁드립니다.

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

Windows PowerShell Copyright (C) Microsoft Corporation. All rights reserved. PS D:\learn-all-with-javascript\grab-market-web> npm install -g create-react-app C:\Users\motiongrapher\AppData\Roaming\npm\create-react-app -> C:\Users\motiongrapher\AppData\Roaming\npm\node_modules\create-react-app\index.js + create-react-app@4.0.3 added 67 packages from 25 contributors in 5.659s PS D:\learn-all-with-javascript\grab-market-web> create -react-app . 경로가 포함된 경우 경로가 올바른지 검증한 다음 다시 시도하십시오. 위치 줄:1 문자:1 + create -react-app . + ~~~~~~ + CategoryInfo : ObjectNotFound: (create:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException create-react-app : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\motiongrapher\AppData\Roaming\npm\create-react-app.ps1 파일을 로드할 수 없습니다. 자세한 내용은 about_Execution_Policies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오. 위치 줄:1 문자:1 + create-react-app + ~~~~~~~~~~~~~~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess PS D:\learn-all-with-javascript\grab-market-web> create-react-app . 로드할 수 없습니다. 자세한 내용은 about_Execution_Policies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오. 위치 줄:1 문자:1 + create-react-app . + ~~~~~~~~~~~~~~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess PS D:\learn-all-with-javascript\grab-market-web> create-react-app. 름이 정확한지 확인하고 경로가 포함된 경우 경로가 올바른지 검증한 다음 다시 시도하십시오. 위치 줄:1 문자:1 + create-react-app. + ~~~~~~~~~~~~~~~~~ + CategoryInfo : ObjectNotFound: (create-react-app.:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException PS D:\learn-all-with-javascript\grab-market-web> create-react-app . create-react-app : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\motiongrapher\AppData\Roaming\npm\create-react-app.ps1 파일을 로드할 수 없습니다. 자세한 내용은 about_Execution_Policies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오. 위치 줄:1 문자:1 + create-react-app . + ~~~~~~~~~~~~~~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess PS D:\learn-all-with-javascript\grab-market-web> npm create-react-app. Usage: npm <command> where <command> is one of: access, adduser, audit, bin, bugs, c, cache, ci, cit, clean-install, clean-install-test, completion, config, create, ddp, dedupe, deprecate, dist-tag, docs, doctor, edit, explore, fund, get, help, help-search, hook, i, init, install, install-ci-test, install-test, it, link, list, ln, login, logout, ls, org, outdated, owner, pack, ping, prefix, profile, prune, publish, rb, rebuild, repo, restart, root, run, run-script, s, se, search, set, shrinkwrap, star, uninstall, unpublish, unstar, up, update, v, version, view, whoami npm <command> -h quick help on <command> npm -l display full usage info npm help <term> search for help on <term> npm help npm involved overview Specify configs in the ini-formatted file: C:\Users\motiongrapher\.npmrc or on the command line via: npm <command> --key value Config info can be viewed via: npm help config npm@6.14.13 C:\Program Files\nodejs\node_modules\npm PS D:\learn-all-with-javascript\grab-market-web> create-react-app. create-react-app. : 'create-react-app.' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않습니다. 이 름이 정확한지 확인하고 경로가 포함된 경우 경로가 올바른지 검증한 다음 다시 시도하십시오. 위치 줄:1 문자:1 + create-react-app. + ~~~~~~~~~~~~~~~~~ + CategoryInfo : ObjectNotFound: (create-react-app.:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException PS D:\learn-all-with-javascript\grab-market-web>

  • nodejs
  • express
  • react-native
  • react
  • HTML/CSS
  • javascript
  • tensorflow
  • 머신러닝 배워볼래요?
hackingbiz 댓글 1 좋아요 2 조회수 5423

npm run start 시 cannot find module 에러

미해결

따라하며 배우는 노드, 리액트 시리즈 - 챗봇 사이트 만들기

강의 내용 중 npm run start하는 과정에서 자꾸 에러가 뜹니다 .. 다음 영상으로의 진도를 못나가는 상황이라 질문 올려봅니다 ㅠㅠ npm run start > chatbot-app@1.0.0 start > node index.js C:\Users\ddffs\Desktop\chatbot-starter\node_modules\grpc\src\grpc_extension.js:57 throw e; ^ Error: Cannot find module 'C:\Users\ddffs\Desktop\chatbot-starter\node_modules\grpc\src\node\extension_binary\node-v93-win32-x64-unknown\grpc_node.node' Require stack: - C:\Users\ddffs\Desktop\chatbot-starter\node_modules\grpc\src\grpc_extension.js - C:\Users\ddffs\Desktop\chatbot-starter\node_modules\grpc\src\client_interceptors.js - C:\Users\ddffs\Desktop\chatbot-starter\node_modules\grpc\src\client.js - C:\Users\ddffs\Desktop\chatbot-starter\node_modules\grpc\index.js - C:\Users\ddffs\Desktop\chatbot-starter\node_modules\google-gax\build\src\grpc.js - C:\Users\ddffs\Desktop\chatbot-starter\node_modules\google-gax\build\src\index.js - C:\Users\ddffs\Desktop\chatbot-starter\node_modules\dialogflow\src\v2\agents_client.js - C:\Users\ddffs\Desktop\chatbot-starter\node_modules\dialogflow\src\v2\index.js - C:\Users\ddffs\Desktop\chatbot-starter\node_modules\dialogflow\src\index.js - C:\Users\ddffs\Desktop\chatbot-starter\server\routes\dialogflow.js - C:\Users\ddffs\Desktop\chatbot-starter\index.js at Function.Module._resolveFilename (node:internal/modules/cjs/loader:927:15) at Function.Module._load (node:internal/modules/cjs/loader:772:27) at Module.require (node:internal/modules/cjs/loader:999:19) at require (node:internal/modules/cjs/helpers:93:18) at Object.<anonymous> (C:\Users\ddffs\Desktop\chatbot-starter\node_modules\grpc\src\grpc_extension.js:32:13) at Module._compile (node:internal/modules/cjs/loader:1095:14) at Object.Module._extensions..js (node:internal/modules/cjs/loader:1124:10) at Module.load (node:internal/modules/cjs/loader:975:32) at Function.Module._load (node:internal/modules/cjs/loader:816:12) at Module.require (node:internal/modules/cjs/loader:999:19) { code: 'MODULE_NOT_FOUND', requireStack: [ 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\node_modules\\grpc\\src\\grpc_extension.js', 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\node_modules\\grpc\\src\\client_interceptors.js', 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\node_modules\\grpc\\src\\client.js', 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\node_modules\\grpc\\index.js', 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\node_modules\\google-gax\\build\\src\\grpc.js', 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\node_modules\\google-gax\\build\\src\\index.js', 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\node_modules\\dialogflow\\src\\v2\\agents_client.js', 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\node_modules\\dialogflow\\src\\v2\\index.js', 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\node_modules\\dialogflow\\src\\index.js', 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\server\\routes\\dialogflow.js', 'C:\\Users\\ddffs\\Desktop\\chatbot-starter\\index.js' ] }

  • nodejs
  • react
김현성 댓글 1 좋아요 1 조회수 510

상품 세부설명페이지에서 데이터 값 통신이 안되네요

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

main 컴포먼트에서는 잘나오는데 상품 세부 페이지 가명 아무것도 안뜨네요 포스트맨으로 http://localhost:8080/products/id 으로 값으로 똑같은 주소를 넣으면 response값은 잘 나오는데 react에서 만 이러네요

  • javascript
  • nodejs
  • react-native
  • tensorflow
  • HTML/CSS
  • 머신러닝 배워볼래요?
  • express
  • react
조은택 댓글 10 좋아요 2 조회수 622

https적용 후 로그인이 되지 않습니다

미해결

[리뉴얼] React로 NodeBird SNS 만들기

안녕하세요 제로초님! 질문있습니다ㅠㅠ 프론트와 백서버 둘 다 https 적용 후, 로그인을 시도하면 저런 식으로 주소에 이메일과 비밀번호가 생기면서 로그인이 되지 않습니다. 무엇을 잘 못 한 건지 예상이 가지 않아서 어디서부터 확인해야 할지 몰라 글을 남깁니다ㅠㅠ 기를 이용해주세요.

  • react
  • redux
  • express
  • nodejs
  • Next.js
댓글 1 좋아요 0 조회수 345

조현영님

해결됨

[리뉴얼] React로 NodeBird SNS 만들기

현영님 vue, react 프레임워크를 사용하지 않고 바닐라 자바스크립트로 Nodebird 를 만드는 강좌 같은 건 안나오나요!?

  • Next.js
  • nodejs
  • redux
  • express
  • react
minsu 댓글 1 좋아요 0 조회수 260

npm run start 실행시 ReferenceError: User is not defined

미해결

따라하며 배우는 노드, 리액트 시리즈 - 기본 강의

npm run start 실행시 ReferenceError: User is not defined라고 에러가 뜨고 포스트맨에서 send시 표기가 안됩니다. 라고 에러가 뜨고 포스트맨에서 send시 표기가 안됩니다.

  • node.js
  • nodejs
  • postman
  • react
  • mongodb
PIZZA 댓글 1 좋아요 0 조회수 1126

인기 태그

인프런 TOP Writers

주간 인기글