묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
eslint 다운로드하면서
eslint다운로드하면서 자꾸 정렬이 안돼요코드 작성하면 하나하나 띄워쓰기랑 스페이스바 눌러야되고 정렬 정리가 안돼요 ㅠㅠ
-
미해결Vue 3 시작하기
yarn serve 를 실행하기 위한 조건이 있을까요?
vue cli 생성 부분에서,npm install -g @vue/cli 하고vue create vue-cli2 로 생성하였습니다.깃허브에서 받은 소스에 이미 vue-cli 폴더가 있어서 저는 vue-cli2로 생성하였습니다. 근데 생성되는 진행과정을 보면, 강좌에서는 yarn install ... 이렇게 뜨던데요.그래서 실행도 yarn serve 로 하구요.. 그런데 저는 npm install ... 이걸로 되던데요. 실행도 npm run serve 로 해야하구요. 제가 강의 중간 어디서 yarn 설정에 관한 부분을 놓친 걸까요?
-
미해결처음 만난 리액트(React)
uncaught runtime error 해결
패키지도 새로 설치해보고 챗지피티가 하라는데로 다 해봤는데도 해결이 안되네요 ㅠㅜㅜ 최신 버전맞아요 react랑 react dom 어쩌고랑 create어쩌고에서 문제가 있는 것 같다고 했습니다 ㅠ 어떻게 해결해야하나요
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
overridFindOptions
안녕하세요 코팩님! 개인 프로젝트를 하다가 약간의 오점을 발견해서 질문드립니다.위 사진과 같이 paginate함수의 overrideOptions 파라미터에 where필터를 새로 작성하는 순간,기존에 composeOptions에서 작성한 where필터를 아예 무시해버리게 되는 것 같습니다. 그래서 첫 번째 페이지는 정상적으로 응답이 오는데, next에 담긴 링크를 눌러보면 똑같이 첫번째 페이지가 응답으로 오게되는 것 같아요.위와같은 증상이 뒷부분의 paginateComments에서도 똑같이 발생합니다. 첫번째 페이지는 작동이 잘 되기때문에 영상에서는 넘어가신 듯 한데,여러 방법을 써봤지만 해결책이 보이지 않아서 질문드립니다ㅠ
-
미해결[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
Checkbox를 누르는데 왜 Editor가 리렌더링되나요?
10.4의 useCallback 강의를 듣는 중에 궁금한 점이 생겼습니다.하나의 checkbox를 누르면 그에 해당하는 item과 그의 부모 컴포넌트인 List , App 컴포넌트가 리렌더링 되는 것은 이해가 되었습니다.그런데, Editor 컴포넌트는 왜 리렌더링이 되는것인가요?Editor가 props로 받은 onCreate는 App에서 useCallBack으로 선언하였으므로, onCreate의 이전 주소값과 이후 주소값은 동일한 것이라 생각됩니다.
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
cursor 기반 페이지네이션 page 기반 페이지네이션
cursor 기반 페이지네이션과page 기반 페이지네이션에서어떤 상황에서 cursor 를 사용하고 어떤 상황에서는 page 기반 사용해도 될까요 ??insert , delete 에 대한 요청이 잦은 서비스 라면 cursor 를 사용하고주로 get 에 대한 요청밖에 거의 없을것 같은 서비스라면 page 기반 페이지네이션을 사용하면 될까요 ?
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
내림차순 next 토큰 로직 작성하기 질문
안녕하세요 ㅎ강의 잘듣고 있습니다.내림차순 정렬 부분을 듣고있다가createQueryBuild 을 사용해서 하는것은 어떻게 생각하시나요 ??
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
javascript에서 에러가 있어도 렌더링 시키는 방법
현재 9.2) 투두리스트 업그레이드 3:30 쯤 useState를 useReducer로 변경을 하며 생긴 문제입니다.onCreate함수는 액션 객체로 변경을 하고 화면에서 렌더링되는 것을 보고 있는데, 강의에서는 onUpdate 함수에 setTodos 상태함수가 정의되어 있지 않다는 에러가 있더라도 잘 렌더링이 되고 있습니다.하지만 제 코드에서는 렌더링이 되지 않고 에러만 발생하게 됩니다.확장프로그램을 설치했던 걸로 기억하는데 안 되는 이유를 알 수 있을까요?추가로, 이 때 생기는 에러는 List 컴포넌트에서 map이 정의되지 않았다고 합니다.
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
로컬 스토리지 로딩 관련질문
안녕하세요 선생님오류는 아니고 쫌 엉뚱한질문인데다이어리 로컬스토리지 로딩 기능 구현중에function App () { const [IsLoading, setIsLoading] = useState(true); 이 state가 true 이면 if (IsLoading) { return <div>로딩 중</div>; }화면에 로딩중으로 렌더링 하게 코딩을 했는데아무리 새로고침 해봐도 화면에 로딩 중 찍히는 걸볼 수 가 없는데 이유는 너무 빨리 지나가서 제가볼 수가 없는건가요?그렇다면 유즈이팩트 사용 여부에따라 마운트 할 때 화면을 두번 그리게 되는건가요?
-
해결됨Next.js 시작하기
파일명 명명 규칙에 대해서 묻고 싶습니다
안녕하세요 강의 잘 보고 있습니다.Layout.jsx 에서는 대문자를 사용하고,pages 안에 파일들은 carts.jsx 소문자로 사용하는것 같은데관례상 그런건지 규칙이 있는건지 궁금합니다. 감사합니다.
-
해결됨웹 애니메이션을 위한 GSAP 가이드 Part.03
UI관련 문의드립니다..!
안녕하세요 범쌤!강의 너무 재밌게 잘 듣고 있습니다.선생님의 강의를 들으면서 사이드 프로젝트에 바로바로 적용해보려고 시도중인데요. 레퍼런스 사이트를 찾아보면서 구현하고 싶은 UI가 있는데 도저히 감이 잡히질 않아 문의드립니다..!https://www.studio-particle.com/위 링크의 해당 영역 부채꼴 UI는 어떤 방식으로 그린걸까요.. ㅠㅠ ?(제 개인적인 생각으로는 자식요소들을 부채꼴로 위치를 지정하고 부모요소를 스크롤에 따라 rotate 시키는 방법이 효과적이지 않을까? 하는 생각을 해보았습니다.)여러방면으로 검색하고 찾아봐도 답이 나오질 않아 문의드려봅니다..!항상 강의 잘 듣고 있습니다. 친절하고 세심한 강의 감사합니다!
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
Diary 페이지 구현하기 23분 30초에 useEffect is not defined 에러가 나요
해당 코드 커스텀 훅스로 만들어서 Edit이랑 Diary 컴포넌트에서 useDiary 임포트해서const curDiaryItem = useDiary(params.id);이 코드 넣자마자 해당 Diary 화면이 나오지않고 useEffect is not defined 만 나와요..코드 자세히 찾아봤는데 의미를 알수가 없어요.. ㅠ이해할 수가없어서 더이상 진도를 나갈수가 없습니다. 도와주세요 .. ㅠㅠ
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
nestjs+graphql에서 부분적으로 restapi를 사용해도되나요?
소셜로그인 부분을 그래프큐엘 가드를 사용해서 적용하면 원인을 도저히 모르겠는 , res.setHeader function이 없다는 에러가 계속 발생하는데요..챗지피티 무료버전에 물어보니소셜로그인 부분은 restapi로 구현한다고하는데..챗지피티를 믿을수가없어서요.. 소셜로그인 부분은 restapi로 해야된다.그래프큐엘로 바꿀수있는데 너가 코드를 잘 못친듯?1번과 2번중에 어떤건가요?
-
미해결JavaScript 베이스캠프
'변수' 부분 강의
'변수' 강의의 동영상이 검정색 화면으로만 나옵니다... 혹여나 제가 잘못 재생한걸까요 어떻게 해결해야할까요....>
-
미해결처음 만난 리액트(React)
시간 index.js 오류가 나요 ㅠ
import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; //import App from './App'; //import reportWebVitals from './reportWebVitals'; import Clock from './chapter_04/clock'; const root = ReactDOM.createRoot(document.getElementById('root')); setInterval(() => { root.render( <React.StrictMode> <Clock /> </React.StrictMode> ); }, 1000);import React from "react"; const Clock = () => { return( <div> <h1>안녕, 리엑스</h1> <h2>현재 시간: {new Date().toLocaleTimeString}</h2> </div> ) } export default Clock;Failed to compile. Module not found: Error: Can't resolve './chapter_03/Library' in 'C:\reactdeveloper\reactcoding\my-app\src' WARNING in [eslint] src\index.js Line 4:8: 'App' is defined but never used no-unused-vars Line 5:8: 'reportWebVitals' is defined but never used no-unused-vars Line 7:8: 'Library' is defined but never used no-unused-vars Failed to compile. Module not found: Error: Can't resolve './chapter_03/Library' in 'C:\reactdeveloper\reactcoding\my-app\src' WARNING in [eslint] src\index.js Line 4:8: 'App' is defined but never used no-unused-vars Line 5:8: 'reportWebVitals' is defined but never used no-unused-vars Line 7:8: 'Library' is defined but never used no-unused-vars Failed to compile. Module not found: Error: Cannot find file: 'clock.jsx' does not match the corresponding name on disk: '.\src\chapter_04\Clock.jsx'. ERROR in ./src/index.js 10:0-39 Module not found: Error: Cannot find file: 'clock.jsx' does not match the corresponding name on disk: '.\src\chapter_04\Clock.jsx'. webpack compiled with 1 error이렇게 오류가 나고 있는데 해결 방법이 있을까요
-
미해결처음 만난 리액트(React)
리액트 처음인데 문제 없을까요?
리액트 한 번도 공부한 적 없어서 리액트 기초 공부하려는 목적입니다. 기초 강의 찾던 중에 알게 되었습니다!리액트 버전 업데이트가 있었다고 알고 있는데 입문자 레벨이라면 강의 수강해도 별 문제 되지 않을까요?
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
오픈그래프 질문드려요
강사님이 하시는데로 했는데 썸네일 이미지가 안뜨는데, 카카오에 가서 확인을 해봐도 안되어 있어서 혹시 경로가<meta property="og:image" content="/public/thumbnail.png" />/public 경로를 빼도 안되고 넣어도 안되고/....시간이 좀 걸린다 해서 카카오에 가서 캐시초기화해서 확인했는데도 이미지가 뜨지 않습니다.<meta property="og:image" content="/public/thumbnail.png" />
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
선생님 nestjs+graphql에서 구글로그인처리는 못하는건가요?
챗지피티에 물어보면 , NestJS와 GraphQL 환경에서도 Google OAuth 2.0을 이용한 소셜 로그인을 구현할 수 있습니다. 다만, GraphQL은 주로 데이터를 가져오고 조작하는데 사용되므로, OAuth와 같은 인증 과정은 일반적으로 REST API 엔드포인트를 통해 처리하는 것이 일반적입니다. 이렇게 하면 OAuth 2.0의 리디렉션 흐름을 관리하기가 더 쉽습니다.라고 하는데용,그러면 nestjs랑 graphql환경이라고해도 OAuth같은 소셜로그인은 rest-api처럼 컨트롤러를통해서 해주는건가요?
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
vercel....
감정일기장은 아니지만 앞서 연습한 todolist 를 일단 배포해보고싶어서 vercel 에 회원가입을 하고 로그인까지 해놓고 다시 vscode에서 터미널에서 vercel login 을 입력하고 엔터를 치면아래와 같이 에러메시지가 떠서 더이상의 진행을 못했는데요, 혹시 다른 뭔가를 더 해야 하는건지요 F:\★수업★\WEB수업\웹퍼블리싱\11-Front-End\React\react-study\6-todolist>vercel login'vercel'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
그래프큐엘로 구글 로그인 질문있습니다.
현재 아래와 같은 에러를 마주쳤습니다.my-server_1 | TypeError: res.setHeader is not a function my-server_1 | at JwtGoogleStrategy.strategy.redirect (/myFolder/node_modules/passport/lib/middleware/authenticate.js:340:13) my-server_1 | at stored (/myFolder/node_modules/passport-oauth2/lib/strategy.js:285:14) my-server_1 | at NullStore.store (/myFolder/node_modules/passport-oauth2/lib/state/null.js:5:3) my-server_1 | at JwtGoogleStrategy.OAuth2Strategy.authenticate (/myFolder/node_modules/passport-oauth2/lib/strategy.js:297:28) my-server_1 | at attempt (/myFolder/node_modules/passport/lib/middleware/authenticate.js:378:16) my-server_1 | at authenticate (/myFolder/node_modules/passport/lib/middleware/authenticate.js:379:7) my-server_1 | at /myFolder/node_modules/@nestjs/passport/dist/auth.guard.js:88:3 my-server_1 | at new Promise (<anonymous>) my-server_1 | at /myFolder/node_modules/@nestjs/passport/dist/auth.guard.js:80:83 my-server_1 | at GqlAuthGuard.canActivate (/myFolder/node_modules/@nestjs/passport/dist/auth.guard.js:44:32)제 코드는 다음과 같습니다.auth.resulver.ts 파일의 일부분입니다. @UseGuards(GqlAuthGuard('google')) @Mutation(() => String) loginGoogle( @Context() context: IContext, // ): void { console.log('context::', context); }그래프큐엘 가드 부분입니다.import { ExecutionContext } from '@nestjs/common'; import { GqlExecutionContext } from '@nestjs/graphql'; import { AuthGuard } from '@nestjs/passport'; // graphql 인가 가드 설정 export const GqlAuthGuard = (name: string) => { return class GqlAuthGuard extends AuthGuard(name) { getRequest(context: ExecutionContext) { const gqlContext = GqlExecutionContext.create(context); return gqlContext.getContext().req; } }; }; jwt google 부분입니다.import { PassportStrategy } from '@nestjs/passport'; import { Strategy } from 'passport-google-oauth20'; export class JwtGoogleStrategy extends PassportStrategy(Strategy, 'google') { constructor() { super({ clientID: process.env.GOOGLE_CLIENT_ID, clientSecret: process.env.GOOGLE_CLIENT_SECRET, callbackURL: 'http://localhost:3001/login', scope: ['email', 'profile'], }); } validate(accessToken, profile) { console.log('profile:', profile); return { ... }; } } 혹시 제가 실수한 부분이있을까요?