묻고 답해요
158만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트 (장고 4.2 기준)
선생님 질문 있습니다.
1) request.META["HTTP_USER_AGENT"] 실습 5번 내내 NameError로 표기 되지 않습니다. 구글링해도 정확히 어떤 이유인지 잘모르겠습니다.2) 아래 pwsh 느낌표가 왜 나오는지 궁금합니다.
-
미해결프로젝트로 배우는 React.js
UserEffect 빈 배열 사용 질문입니다
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.UserEffect 빈 배열 사용하면 처음 한번만실행된다고 하는데그러면 조건문으로 posts 체크해서 사용해도 되나요?왠지 유저이펙트보다 이프문이 더 가벼울것 같아서질문드립니다
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
5.4) Props로 데이터 전달하기 에서 defaultProps 오류납니다.
다른 질문글을 참고해 구조분해 할당 방식으로 다시 코드를 짜봤는데 그래도 오류가 납니다
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
감정일기 Vercel 배포 후, 페이지 접근시 인증서 관련 에러가 발생합니다.
한입 크기로 잘라 먹는 리액트 의 가장 마지막 강의인 12.19) 배포하기에서 터미널에 vercel 명령어를 입력하여 배포를 완료했습니다.그런데 배포 완료 후, 뱉어준 링크로 이동시 에러가 발생합니다. 검색해 보았는데, 제가 지식이 얕아 키워드 찾기에 한계가 있는지 이렇다할 해결 방법을 찾지 못했습니다. 어떻게 해결 할 수 있을까요? 사용 Vercel CLI 버전은 41.1.0 입니다.
-
해결됨React Three fiber(R3F)로 배우는 인터렉티브 3D 웹 개발
'JSX.IntrinsicElements' 유형에 'mesh' 속성이 없습니다. 경고 해결법
전 영상과 똑같이 npm으로 설치하는 과정에서 에러가 발생하시는 분들을 위한 제 해결법입니다. (2025-02 기준) 강사님이 올려주신 소스코드 다운로드이 방법은 강사님이 올려주신 폴더를 열어서 npm i 만 하시면 됩니다.직접 다운그레이드R3F가 현재(2025-02) 기준 React 19를 지원을 안합니다.그렇기 때문에 React 18로 다운그레이드를 해줘야되는데요 React 다운그레이드React 최신버전 설치npm create vite@latest우선 최신버전을 설치한 이후에다운그레이드npm uninstall react react-dom npm install react@18 react-dom@18react와 react-dom을 삭제후 18버전으로 설치합니다.3. 확인npm list react react-dom터미널로 확인하시면 18버전으로 다운그레이드 됩니다. 하지만 여기서 끝이 아니라 Typescript와 drei 설치시에도 문제가 발생합니다. mesh를 작성하게 되면 "JSX.intrinsicElements" 형식에 "mesh" 속성이 없습니다. 라는 경고창이 옆에 계속 뜨는데요실행결과는 잘 출력 되지만 거슬려서 해결법을 적어봅니다. 'JSX.IntrinsicElements' 에러 해결법package.json 파일에type/react와 type/react-dom이 19버전으로 되어 있어 호환이 안되어 발생하는 에러입니다.npm install @types/react@18 @types/react-dom@18 터미널에 입력해주시면 package.json 파일에서 18버전으로 다운그레이드 됩니다. 또 drei를 설치할때three-mesh-bvh@0.7.8: Deprecated due to three.js version incompatibility. Please use v0.8.0, instead에러가 발생하는데요 이는 three.js버전과 three-mesh-bvh 버전 간의 호환성 문제입니다. drei 라이브러리 설치법터미널에npm install @react-three/dreinpm install three-mesh-bvh@0.8.0 --legacy-peer-deps 그럼 3가지 세팅이 완료됩니다
-
미해결따라하며 배우는 리액트 A-Z[19버전 반영]
react19에서는 react-beautiful-dnd가 설치되지 않습니다.
https://github.com/atlassian/react-beautiful-dnd/issues/2672react-beautiful-dnd is now deprecated #2672 Drag and Drop 기능 구현을 위한 다른 방법 설명이 필요합니다.
-
미해결Next + React Query로 SNS 서비스 만들기
pgAdmin 질문
pgAdmin의 Post 데이터를 전부 삭제한 후 다시 기록하고 싶어서 Post 내부 데이터를 전부 선택/삭제(휴지통 버튼 클릭)한 후 PSQL Tools에 COMMIT을 입력하라고 정보가 있어서 실행에 옮겼는데 갑자기 9090페이지가 아예 안돌아가네요(로그인 안됨, API문서 접근불가 등등) ㅠㅠ 어떻게 방법없을까요
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
vite + react <MainPage/> intelij
안녕하세요 인텔리제이 사용중인데create react app으로 하게 되면 더이상 지원하지 않는다 하여 vite + react로 적용해서 프로젝트 만들어서 하고 있습니다현재 2강 React-Router 이용해서 메인 페이지 띄우는 작업중인데 오류가 발생하여 진행이 안됩니다 그리고 매번 강의 때마다 오류 수정하느라 강의가 원활하지 않습니다 강의는 더이상 업데이트 계획이 없으실까요? 리액트 프로젝트 생성부터 막혀서 진행이 원할하게 되지않습니다 환불하고 싶은데 기간도 지나서 환불도 안되고 답답하네요 매번 이런식으로 물어보면서 수정해야 하나요?? 매뉴얼이라도 만들어주세요 정말 불편합니다
-
미해결실무 중심! FE 입문자를 위한 React
리코일이 업데이트가 안된지 오래됐다고하네요
계속 오류가 발생해서 알아보니까 리액트19 버전쓰시는 분들은 리코일 못쓰실거같아요 대신 jotai 이 라이브러리로 대체해서 사용해보세요 문법도 리코일이랑 비슷하네요
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
여행 숙박 사이트 부분 질문있습니다.
안녕하세요 강의를 듣다가 여행 숙박 사이트 부분의 강의를 보고 싶은데 이 부분은 어디서부터 보면 되나요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
[감정 일기 프로젝트] 방금 생성한 일기를 수정하였을 경우 오류 발생
감정 일기 프로젝트에서 "Edit 페이지 구현하기"까지 공부한 상황입니다. 구현하고 나서 강사님 설명대로 동작 시켜 보니 잘 동작하더군요. 그런데 제가 이것 저것 동작을 체크하면서 방금 생성한 일기를 다시 수정하고 나서 작성완료 버튼을 눌렀더니, Diary list에 방금 수정한 목록이 두 개가 나타나고, 이전 달의 Diary list가 사라지는 현상이 발생하였습니다. 그래서 제가 어느 부분을 잘못 코딩하였는지 확인하고자 강사님이 제공한 Git 사이트의 코드와 제가 작성한 코드를 일일이 비교해 보았지만 차이점을 발견하지 못하였습니다. 강사님은 이런 현상이 발생하지 않았는지요? 또한 어떻게 이 문제를 해결할 수 있을까요?
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
선생님 리뷰 에디터의 input관련 질문드립니다.
선생님 review-editor.tsx 파일에서 기존 리액트와는 다른게 onChange나 value useState를 활용하여 input의 상태값을 따로 설정 안하는데 이건 왜 안하는걸까요? search-bar에서는 그렇게 동작하도록 한거 같은데 무슨 차이인지 설명좀 부탁드려도 될까요?! 여러 지식들이 이제 막 충돌하기 시작했습니다 ㅠㅠ
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
9강 kakao api로 아이디 생성 후 오류
9강 리액트 사용자 정보 수정 중에 kakao api 연동해서 그전까지 잘되는데, 디비에 카카오 사용자 정보가 없는 상태에서 로그인을 하면 디비에 member와 member_member_role_list 두 테이블 사용자가 잘 생성됩니다. 서버에는 getClaims 함수실행에서 오류가 발생하고 DTO에 정보를 못찾는다는거 같은 오류인거 같은데화면상에는 이렇게 나옵니다.새로고침 후의 상태이고그냥 localhost:3000 으로 다시 들어가서 로그인을 하면 디비에는 카카오사용자가 생성이 된 상태라 로그인이 잘됩니다.... 원인이 무엇일까요@GetMapping("/api/member/kakao") public Map<String, Object> getMemberFromKakao(String accessToken) { log.info("access Token : {}", accessToken); MemberDTO memberDTO = memberService.getKakaoMember(accessToken); Map<String, Object> claims = memberDTO.getClaims(); String jwtAccessToken = JWTUtil.generateToken(claims, 10); String jwtRefreshToken = JWTUtil.generateToken(claims, 60 * 24); claims.put("accessToken", jwtAccessToken); claims.put("refreshToken", jwtRefreshToken); return claims; }public Map<String, Object> getClaims() { Map<String, Object> dataMap = new HashMap<>(); dataMap.put("email", email); dataMap.put("pw", pw); dataMap.put("nickname", nickname); dataMap.put("social", social); dataMap.put("roleNames", roleNames); return dataMap; }import axios from "axios" import { API_SERVER_HOST } from "./todoApi" const rest_api_key = `` const redirect_uri = `http://localhost:3000/member/kakao` const auth_code_path = `https://kauth.kakao.com/oauth/authorize` const access_token_url =`https://kauth.kakao.com/oauth/token` export const getKakaoLoginLink = () => { const kakaoURL = `${auth_code_path}?client_id=${rest_api_key}&redirect_uri=${redirect_uri}&response_type=code` return kakaoURL } export const getAccessToken = async (authCode) => { const header = { headers: { "Content-Type": "application/x-www-form-urlencoded", } } const params = { grant_type: "authorization_code", client_id: rest_api_key, redirect_uri: redirect_uri, code: authCode } const res = await axios.post(access_token_url, params, header) const accessToken = res.data.access_token return accessToken } export const getMemberWithAccessToken = async (accessToken) => { const res = await axios.get(`${API_SERVER_HOST}/api/member/kakao?accessToken=${accessToken}`) return res.data }rest_api_key에 restkey입력되어있습니다.
-
해결됨Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
Direct connection / Transaction pooler / Session pooler 차이가 무엇인가요?
Supabase 가 업데이트 되면서, 강의 화면과 다른 부분이 있어서 질문드립니다.Direct connection / Transaction pooler / Session pooler 차이가 무엇인가요?강의를 따라가기 위해 Transaction pooler 를 사용해서 연결은 하긴 했습니다.
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
맥북 사용하시는 분 들 단축키 알려 드립니다.
맥북 사용하시는 분들 Command + L Command + O 누르면 Live Server가 자동으로 오픈됩니다.
-
미해결파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트 (장고 4.2 기준)
공유자님 이 강의 공부 방법에 대한 질문입니다.
이 강의는 어떤 식으로 접근해야 되나요?이런 것이 있구나~ 라고 생각하고 넘어가야 하나요? 아니면 하나하나 다 알아가면서 넘어가는 것이 좋나요?
-
해결됨React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
tailwind css 버젼 다름문제
노션에 링크에 들어가면 https://tailwindcss.com/docs/installation/using-vite여기로 옮겨지는데 강의 내용과 완전히 다른 터미널 명령어를 알려줍니다. 홈페이지말고 강의 처럼 따라하니깐 init 부분에서 npm error could not determine executable to runnpm error A complete log of this run can be found in: C:\Users\shin\AppData\Local\npm-cache\_logs\2025-02-11T09_22_29_046Z-debug-0.log이런 오류가 뜨는데 새로 변경된 홈페이지를 따라해야하나요?따라해야한다면 어떻게 하면될까요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
useEffect와 useMemo 차이점에 대해서
안녕하세요 설명해주신 useMemo의 역할이 재랜더링 되는 경우 컴포넌트를 랜더링 특정 경우에만 재랜더링 하도록 하고 그 외는 그대로 값을 두는 것으로 성능을 증가 시키는 개념으로 이해를 했습니다. 지난 시간에 알려주신 useEffect의 경우도 deps에 값을 지정해주면 그 상태에 따라서면 랜더링을 진행하는데 차이점이 있나요?
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
Next.js 디버깅 방법 질문드립니다.
강사님 안녕하세요. 수업 내용 외의 질문 드립니다.강사님께서는 Next.js 프레임워크를 사용하실 때 어떻게 디버깅하시는지 궁금합니다. 구글링을 통해서 vscode에서 launch.json 설정을 한다든가 하는 글은 봤는데 제가 설정을 잘못했는지 잘 동작하지 않기도 하고 Next.js 환경에서의 디버깅 설정에 대한 글이 많이 없더라구요.그래서 Next.js 이용 개발자들은 디버깅 툴을 따로 사용하지 않고 개발하는지, 강사님께서 디버깅을 하신다면 어떻게 하시는지 궁금합니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
node.js 설치 질문
문제1 vcs내에 cmd에서는 node -v, npm -v의 버전이 잘 나오는데 bit bash 환경에서는 사진과 같이 오류가 나옵니다 어러번 node.js를 삭제하고 깔아봤는데 계속 이럽니다문제2git bash환경에서 오류가 떠 cmd에서 시도를 해보았습니다.명령프롬프트(cmd)에서는 node, npm, yarn의 버전이 잘 나오지만vsc내에 cmd에서는 나머지의 버전은 잘 나오지만 yarn의 버전이 나오질 않습니다.버전을 모두 확인 후 npx create-next-app를 해야하는데 앞의 문제들 때문에 그런지 npx create-next-app가 실행이 되지 않습니다.초반 세팅 과정 때문에 시간을 너무 잡아먹는 것 같아요 도와주세요 ㅠㅠ