묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
배포시 Ubuntu에 yarn 설치
안녕하세요 선생님,yarn을 사용중이었는데, Ubuntu에서 npm이 아니라 yarn을 설치하면 되겠죠?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
서버 라우터 에러 문의
state 끌어올리기 수업부분에서 계속 이런 오류가 나서 문의드립니다. 혹시나 해서 다른 서버들은 종료를 해놓고 이것만 다시 실행을 했는데도 계속 오류가 발생하네요. 어떤부분이 잘못된 것인가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
이미지 업로드 후 url 접속 에러와 관련해서 질문드립니다. (섹션 19)
이미지를 업로드 후 받아오는 url을 통해, 이미지를 로딩해오는 과정에서 오류가 발생해서 질문드립니다.data는 uploadFile mutation 후 받아온 result에 대한 출력 결과이고, 여기서 받아온 url을 https://storage.googleapis.com/. 뒤에 붙여서 이미지를 불러오려고 하면 오류가 발생합니다. 이 부분에 대한 에러를 해결할 수가 없어서 질문드립니다.
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
Unmount 시점 질문
강의 중 20분 57초 Unmount 관련 질문입니다.const [isVisible, setIsVisible] = useState(false);보면 isVisible의 기본값이 false입니다. 이 값이 true로 변경되었다가(update), 다시 반드시 제 값 'false'로 돌아오는 시점이 Unmount 시점인건가요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
s3 연결하기 강의중 이미지 포함 post
안녕하세요 제로초님 늦은 밤에 죄송합니다현재 이미지 업로드하고 미리보기까지 나오는거 확인하고 올렸는데 성공했다고만 뜨고 정작 이미지 파일만 빼고 post성공한거같습니다 그리고 게시글은 올려 지긴 하나 사진 빼고 내용만 나옵니다 지금까지 콘솔내용을 보고 Images에 어떻게 넣을까 고민하다가 postform하고 백에서 routes/post.js부분을 건드려봤지만 아무런 성과가 없었습니다 에러도 안나와서 어딜봐야할지 잘모르겠습니다 ㅠㅠ
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
웹페이지 F5 하면 일기 내용이 다 사라지는데
페이지 F5 리프레쉬 하면 일기 내용이 다 사라지는데 이럴땐 파일 저장이라던가 다른 방법을 사용해야 하는걸까요?어떤 방법들이 있을까요
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
버전이 다른데 어떤 식으로 학습하는게 좋을까요?
Nextjs 버전을 내리고 강의 버전과 똑같이 맞춰서 사용할 지, 아니면 문법을 수정하여 학습해야 할 지 모르겠습니다.. index.tsx 구조 다른거부터 머리아프네요 ㅜㅜ... 강의에서 사용하신 버전도 알려주세요!
-
미해결웹 게임을 만들며 배우는 React
지뢰찾기 클릭한 셀 주변을 검사하는 checkAround 함수 질문있습니다
const checkAround = (row, cell) => { let around = []; if (tableData[row - 1]) { around = around.concat( tableData[row - 1][cell - 1], tableData[row - 1][cell], tableData[row - 1][cell + 1] ); } around = around.concat( tableData[row][cell - 1], tableData[row][cell + 1] ); if (tableData[row + 1]) { around = around.concat( tableData[row + 1][cell - 1], tableData[row + 1][cell], tableData[row + 1][cell + 1] ); }해당 함수에서 8방향 체크를 할 때 먼저 윗줄과 아랫줄이 존재하는지 확인하는데좌우 체크는 굳이 안해도 되는건가요?해당 강좌에서는 concat 후 filter로 해당 코드들만 걸러내서 괜찮은건 알겠는데어느정도 큰 규모의 프로젝트에서 이렇게하면 낭비되는 메모리는 없는지, 일일히 다 체크해줘야 하는지 궁금합니다!
-
해결됨Slack 클론 코딩[실시간 채팅 with React]
api/workspaces POST요청시 500에러가 뜹니다.
const onCreateWorkspace = useCallback( (e: any) => { e.preventDefault(); if (!newWorkspace || !newWorkspace.trim()) return; // trim : 앞 뒤 공백제거 if (!newUrl || !newUrl.trim()) return; axios .post( 'http://localhost:3095/api/workspaces', { Workspace: newWorkspace, url: newUrl, }, { withCredentials: true }, ) .then(() => { mutate(userData, true); setShowCreateWorkspaceModal(false); setNewWorkspace(''); setNewUrl(''); }) .catch((error) => { console.dir(error); toast.error(error.response?.data, { position: 'bottom-center' }); }); }, [newWorkspace, newUrl], );뭐가 문제인건가요?
-
미해결파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트
장고와 nodejs에 대해 근본적인 의문이 생겼습니다
현재 저는 백엔드로 장고를, 프론트엔드로 리액트를 사용한다고 이해하고 수강중입니다.그런데 프론트엔드 환경을 만드실 때 노드js를 선생님께서 사용하시던데 노드js는 장고랑 별개의 백엔드쪽 프레임워크라고 제가 기억하고 있습니다.그럼 현재 백엔드는 장고와 노드js 둘다를 사용하고 있다는 의미인가요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
dialect: "mysql" 오타없이 잘 입력했고, mysql2도 node_modules 안에 잘 깔려 있는데 뭐가 문제일까요..
vim env 까지 진행 해서 password까지는 문제 없이 실행이 되어서, dialect: "mysql" 여기까지 실행이 되다가 에러가 뜬 거 같거든요..ubuntu@ip-172-31-15-69:~$ cd serverjs-nextproject/ ubuntu@ip-172-31-15-69:~/serverjs-nextproject$ npx sequelize db:create Sequelize CLI [Node: 14.21.3, CLI: 6.6.0, ORM: 6.28.0] Loaded configuration file "config/config.js". ERROR: Dialect undefined does not support db:create / db:drop commands ubuntu@ip-172-31-15-69:~/serverjs-nextproject$ ls app.js controllers models node_modules package.json routes config index.js mysql-apt-config_0.8.13-1_all.deb package-lock.json passport uploads ubuntu@ip-172-31-15-69:~/serverjs-nextproject$ cd node_modules/ ubuntu@ip-172-31-15-69:~/serverjs-nextproject/node_modules$ ls @mapbox encodeurl memoizee safe-buffer @types es5-ext merge-descriptors safer-buffer abbrev es6-iterator methods semver accepts es6-symbol mime send agent-base es6-weak-map mime-db seq-queue ansi-regex escalade mime-types sequelize ansi-styles escape-html minimatch sequelize-cli anymatch etag minimist sequelize-pool append-field event-emitter minipass serve-static aproba express minizlib set-blocking are-we-there-yet express-session mkdirp setprototypeof array-flatten ext moment side-channel at-least-node fill-range moment-timezone sigmund balanced-match finalhandler morgan signal-exit basic-auth forwarded ms simple-update-notifier bcrypt fresh multer sqlstring bignumber.js fs-extra mysql statuses binary-extensions fs-minipass mysql2 streamsearch bluebird fs.realpath named-placeholders string-width body-parser function-bind negotiator string_decoder brace-expansion gauge next-tick strip-ansi braces generate-function node-addon-api supports-color buffer-from get-caller-file node-fetch supports-preserve-symlinks-flag busboy get-intrinsic nodemon tar bytes glob nopt timers-ext call-bind glob-parent normalize-path to-regex-range chokidar graceful-fs npmlog toidentifier chownr has object-assign toposort-class cli-color has-flag object-inspect touch cliui has-symbols on-finished tr46 color-convert has-unicode on-headers type color-name http-errors once type-is color-support https-proxy-agent parseurl typedarray commander iconv-lite passport uid-safe concat-map ignore-by-default passport-local umzug concat-stream inflection passport-strategy undefsafe config-chain inflight path-is-absolute universalify console-control-strings inherits path-parse unpipe content-disposition ini path-to-regexp util-deprecate content-type ipaddr.js pause utils-merge cookie is-binary-path pg-connection-string uuid cookie-parser is-core-module picomatch validator cookie-signature is-extglob process-nextick-args vary core-util-is is-fullwidth-code-point proto-list webidl-conversions cors is-glob proxy-addr whatwg-url d is-number pseudomap wide-align debug is-promise pstree.remy wkx delegates is-property qs wrap-ansi denque isarray random-bytes wrappy depd js-beautify range-parser xtend destroy jsonfile raw-body y18n detect-libc lodash readable-stream yallist dotenv long readdirp yargs dottie lru-cache require-directory yargs-parser editorconfig lru-queue resolve ee-first make-dir retry-as-promised emoji-regex media-typer rimraf ubuntu@ip-172-31-15-69:~/serverjs-nextproject/node_modules$ mysql-apt-config_0.8.13-1_all.deb, mysql, mysql2 다 잘 깔려 있는데 도대체 모가 문제일까요...ㅠㅠ
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
front pm2 에러
프론트로 sudo npx pm2 monit 하면 이런 에러가 뜨는데 PostCard에 문제가 있는걸까요? 지금 처음 데이터는 이런식으로 불러오고있습니다
-
미해결너네 백엔드 하고 싶은 거 있으면 얼마든지 해 난 괜찮어 왜냐면 나는 파이어베이스가 있어
useAuthContext 에서 dispatch 를 사용할 때 에러가 나요.
const { dispatch } = useAuthContext(); 위와 같이 사용했을 때 dispatch 아래에 밑줄이 생기는데 'null' 형식에 'dispatch' 속성이 없습니다.ts(2339)const dispatch: any 와 같은 에러가 생깁니다. (alias) const AuthContext: Context<null>import AuthContext 이렇기 때문인 것 같은데 어떻게 수정해야할까요..타입스크립트를 사용하고 있습니다.
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
[공유] Post 수정 취소 후 다시 수정시 이전 수정 값이 남아 있는 문제 해결
PostCardContent에서 취소 버튼을 클릭시 바로 onCancelUpdate()를 하게 되면 editText의 값이 리셋되지 않습니다.그래서 다시 수정 버튼을 클릭하면, TextArea에 postData가 보이는 것이 아닌, 이전에 수정을 하려다가 취소할 당시의 값이 남아있게 됩니다! (해당 내용은 제로초님 sleact 레파지토리에 pull request 하였습니다.) 취소 버튼 클릭시 editText를 리셋하고 onCancelUpdate를 실행할 함수를 만들어주면 됩니다!const onClickCancel = useCallback(() => { setEditText(postData); onCancelUpdate(); });<Button type="danger" onClick={onClickCancel}>취소</Button>
-
해결됨Slack 클론 코딩[실시간 채팅 with React]
interface Props 타입 넣는 법 질문
interface Props { show: boolean; onCloseModal: () => void; style: CSSProperties; closeButton?: boolean; } const Menu: FC<React.PropsWithChildren<{}>> = ({ children, style, show, onCloseModal, closeButton }) => {...}이 상태에선 Props타입을 어떻게 넣어야 하는 건가요?
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
안녕하세요 git 설치 오류입니다.
git 설치 이후 vscode에서 터미널 변환이 안될때 git 최신버전 설치 완료vscode 재실행 완료 터미널 1개 추가 후 git bash로 변환시 목록에 안보임
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
geolocation 메소드 사용 시 콘솔창 알림
지올로케이션으로 위치 나타내는 함수 배우는데콘솔창 맨 위에[Violation] Only request geolocation information in response to a user gesture. 이렇게라고 떠요. 해당 자바스크립트 번호 보니까 딱히 문제 될 것도 없고 강사님이랑 똑같이 적었는데 왜 저렇게 뜰까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
rerender
emotion에 props 던지기 및 setState의 작동원리강의 49분경 설명에서.... 작성자,제목,내용 인풋창에 q,q,q를 입력하는 과정에서최종적으로 내용인풋에 q입력할때 처음에는 contents값이 없는 상태로 렌더링이 일어나고 42번째 함수가 종료가 될때, (임시로 저장해두었던 q) contents를 q로 바꾸라고 알아들어서 바꾸면 한번더 리렌더링이 일어나서 contents 값이 q가되어 있으므로 44번째 if문이 실행이 되어서 45번째 setMycolor가 실행이 되고, 또 다시 setMycolor가 바뀌므로 리렌더링 일어나서 버튼색이 노란색으로 바껴야 하는거 아닌가요? 왜 내용에 qw를 입력하는 순간 이 일이 일어나나요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
나의 상품 카운트 API 질문
안녕하세요. 언제나 좋은 강의 감사합니다! 다름이 아니라 section 14 과제인 마이페이지를 구현하는 중인데 나의 상품 페이지 pagination에 사용할 내 장터-나의 상품 count API는 어떤 걸 쓰면 될까요? 다른 페이지에서 사용할 count API는 모두 있는 것 같데 나의 상품만 없는 건지 제가 못 찾고 있는 건지 모르겠네요..
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
클라이언트와 서버를 Docker로 배포할 시 보안 관련 질문 드립니다.
강의에서 좀 더 나아가 클라이언트와 서버도 도커 환경으로 구축?을 해보려고 합니다.계획은 Docker hub private repo에 Dockerfile로 빌드된 이미지를 push하고 ec2인스턴스에서 docker-compose up으로 pull을 받으려고 합니다. 간단히 테스트를 해보니 제대로 실행은 되고 있으나 보안적인 부분에 있어 문제될 것이 있나 궁금하여 질문 드립니다.답변 주시면 감사하겠습니다.감사합니다~