inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

vite 명령어로 프로젝트를 만들었습니다. (vscode)

미해결

React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지

vite 명령어로 프로젝트 생성 끝 (확장 프로그램 미설치) -- App.jsx -- 위 화면 같이 붉은 라인이 생기는 이유가 무었인가요? (참고로 vscode 자동생성 기능을 off 로 설정해서 사용중) 갑자기 위와 같은 화면이 나와 전에 생성한 프로젝트를 열어 보왔는데요 멀쩡히 (붉은 색 라인 없음) 잘 나오던 파일이 위와 같은 증상이 똑같이 나오고 있습니다. 코파일럿, 구글링이 알려준 데로 처리 했는데 같은 증상이 나오고 있습니다. 원인이 무엇인지 질문드립니다. (아~ "npm run dev" : 정상 동작합니다.) Plz.... 프로젝트 생성시 TypeSCript로 생성하지 않고 일반 jsscript로 설정했습니다. ts파일 머시지 어쩌구 하는데.. 에공.. <div> 마우스 오버시 위 메지내 내용 화면> ※ vscode 에서 자동 생성을 막으려고 제가 무슨 짓을 했는지... (머 이것 저것 ctrl + shift + p로 ..내용을 찾아 뭔짓을 했는지... (json 파일) 그때 부터인듯 싶습니다. ※ vscode 재설치 : 같은 증상 질문 내용이 vscode에 관한 내용인듯 한데 소스 내용이 아닌 질문이라..죄송합니다. !!! 아무래도 vscode typescript 버전인듯 싶습니다. 근데 전 ctrl + , 를 눌러서 typescript 를 눌러서 검색해 보면 아 놔~~ 구글링에서 설명한 화면이랑 다르네요.. 하~~ 오전 부터 이게 왠 ... 우쒸~~

  • react
  • React-Context
  • react-router
  • tailwindcss
  • react-query
bluescreen 댓글 1 좋아요 0 조회수 102

리액트 객체의 타입을 알기위하여 마우스를 올렸을 때 나오는 형식이 강의와 다른 부분 문의 드립니다.

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

안녕하세요. 지금 125강 제어 컴포넌트 부분 문의 드립니다. input type에서 onChange 함수에 handleInputchange를 호출을 하고 있는 부분을 따라하고 있었습니다. 리액트 객체의 타입을 알아야 하기 때문에 마우스를 e에다가 가져보면 저는 (parameter) e: ChangeEvent<HTMLInputElement> 이렇게 나오고 있습니다. 그런데 강의에서는 (parameter) e: React.ChangeEvent<HTMLInputElement> 이렇게 나오고 있어서요. 저의 VS CODE에서는 React. 이 부분이 누락이 되어서 알려주고 있습니다. const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => { setInput( e.target .value); }; 이렇게 넣었을 시에 ChangeEvent 에 빨간불은 들어오지만 화면 자체에 에러는 안나오는 것 같습니다. 강사님 강의처럼 React. 이 부분을 넣지 않아도 괜찮을지에 관하여서 문의 드려봅니다. 강의 너무 잘 보고 있습니다 감사합니다.

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
댓글 2 좋아요 0 조회수 72

커서 ui 변경

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

안녕하세요. 챕터5에 커서 설치하는 부분부터 전체적으로 변경된 부분이 많아서 따라할 수가 없네요 ㅠ 화면만 다른게 아니고 최대한 똑같이 따라해도 안되는 부분이 많은 것 같습니다. 일단 6챕터 보고 있는데 이 뒤로는 커서 활용이 안되서 진도가 안나가는데 어떡하죠?

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
우디 댓글 2 좋아요 0 조회수 217

터미널에서 프롬프트 작성 시 글자 밀리는 문제

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

안녕하세요! 터미널을 이용해서 클로드에 프롬프트를 작성할 때 맥 환경에서 iterm2를 사용하는데요. 프롬프트 작성을 위해 "한글 입력"을 하다가 "줄바꿈"을 하면 마지막 글자가 줄바꿈으로 아래 라인으로 밀리게 되는데요. 이를 해결할 방법이 있을까요?

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
김상원 eddy 댓글 2 좋아요 0 조회수 1547

커서ai 질문

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

강의에서 보면 커서AI로 클로드코드를 실행해도 터미널에서 클로드코드 하는 것처럼 보이는데, 제가 커서ai에서 클로드ai를 실행하면 이렇게 대화형식으로 보입니다. 커서ai 에서 터미널처럼 볼 수 있는 방법 좀 알려주세요!

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
앤기브마케팅 댓글 2 좋아요 0 조회수 196

깃 커밋 메시지 작성

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

깃 커밋 메시지 자동 작성을 한국어로 나오게 하려면 어떻게 해야할까요?

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
저트 댓글 2 좋아요 0 조회수 137

카카오 연동설정이 이제 안되는거 같아요

미해결

코드로 배우는 React 19 with 스프링부트 API서버

카카오연동 첫강의 부터 막히기 시작합니다ㅠ 카카오 연동설정 UI도 일단 많이 변경되었고 리다이렉트 URI란 항목이 웹훅으로 변경된거 같은데 그곳에다 리다이렉트 주소를 입력하면 https프로토콜만 이제 등록되는거 같습니다. 이부분은 새롭게 다른 방면으로 소셜로그인 업데이트 해야될꺼 같아 보여요ㅠ

  • react
  • typescript
  • spring-boot
  • jpa
  • jwt
  • 소셜로그인
  • 카카오
feelsagood 댓글 2 좋아요 0 조회수 306

storybook setup

해결됨

실무에 바로 적용하는 스토리북과 UI 테스트

node -v : 24 vite react.ts storybook 10v --- storybook setup 하고 난 이후 react-vite npm run dev를 실행하니 Failed to load preset: "@storybook/preset.js"■ Error [ERR_MODULE_NOT_FOUND]: Cannot find package '@storybook/preset.js' │ imported from ./node_modules/storybook/dist/_node-chunks/chunk-O7UZQAUS.js │ at Object.getPackageJSONURL (node:internal/modules/package_json_reader:255:9) │ at packageResolve (node:internal/modules/esm/resolve:767:81) │ at moduleResolve (node:internal/modules/esm/resolve:853:18) │ at defaultResolve (node:internal/modules/esm/resolve:983:11) │ at nextResolve (node:internal/modules/esm/hooks:748:28) │ at o (file://./node_modules/@tailwindcss/node/dist/esm-cache.loader.mjs:1:69) │ at nextResolve (node:internal/modules/esm/hooks:748:28) │ at Hooks.resolve (node:internal/modules/esm/hooks:240:30) │ at handleMessage (node:internal/modules/esm/worker:199:24) │ at Immediate.checkForMessages (node:internal/modules/esm/worker:141:28) 이런 에러가 뜹니다. .storybook/main.ts 는 import type { StorybookConfig } from "@storybook/react-vite"; const config: StorybookConfig = { stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"], addons: [ "@chromatic-com/storybook", "@storybook/addon-vitest", "@storybook/addon-a11y", "@storybook/addon-docs", "@storybook/addon-onboarding", ], framework: "@storybook/react-vite", core: { builder: "@storybook/builder-vite", // 👈 The builder enabled here. }, }; export default config; 이렇게 설정해 놓았고, npm install @storybook/builder-vite --save-dev 해놓은 상태입니다. 이유를 찾고싶은데 못찾아 qa 남깁니다.

  • react
  • typescript
  • tailwindcss
  • storybook
  • ui-testing
Coi 댓글 2 좋아요 0 조회수 105

claude코드 설치 이후에 버전이 안뜨네요.

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

강의 설명대로 powershell에서 명령어 입력해서 설치 정상적으로 완료되었고, 시스템에서 해당 위치 새로만들기로 정상 진행했는데요. 이후 powershell에서 claude -v 를 입력하니 버전이 안나오고 오류메세지가 나옵니다. 강의 처음부터 다시 진행했는데도 동일하네요.

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
noodle 댓글 2 좋아요 0 조회수 250

상세 과정 보는 방법

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

클로드 cli에서 상세보기를 하고 싶은데 ctrl +r을 누르면 상세보기가 아니고 자꾸 서치 프롬프트로 넘어가는데 상세 과정을 보려면 어떤 단축키를 사용해야하는건가요? 윈도우입니다!

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
저트 댓글 2 좋아요 0 조회수 119

72, 73강 서브에이전트관련

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

안녕하세요. 짐코딩님! 72~73강을 보면 노션 api 데이터 베이스 전문가 에이전트 생성 및 prd 생성 서브 에이전트 , 그리고 다시 prd-validator 서브 에이전트를 구성해주셨던데, 깃 클론을 해보면 노션 api 에이전트만 보이네요. 잘 만들어주신 prd 생성과 prd-validator 에이전트를 따라하고 싶은데 이 파일은 어디에ㅐ서 참조할 수 있을까요?

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
Alphafold 댓글 2 좋아요 0 조회수 120

git 브랜치와 클로드 코드 활용에서 궁금한 점.

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

쉽게 설명해주셔서 대략 이해는 가는데요, 중간 이후부터 이해가 안되는 부분이 있습니다. readme.md 가 메인(프로덕션)인 상태셨고 디벨롭 브랜치로 개발1완료->개발2완료 까지 가는중에, 서비스 중인 메인(readme.md)에 에러가 생겨서 새로 핫픽스 브랜치에서 버그 수정해서 메인(프로덕션)상태로 만들어 주신것 까지 이해 했습니다. 여기서 궁금한건, 디벨롭 브랜치는 이전(버그가 있는) 메인에서 온것이기 때문에 개발1완료, 개발2완료가 의미가 없게 되는것 아닌가요? 개발1이나 개발2완료 커밋에는 버그가 존재하는 상태에서 개발해 나간것이기 때문에 개발1,2,3(신규 기능들 만들어 나감)이 커밋을 나중에 메인으로(프로덕션)보내버리는 이전에 버그 수정하기전에 만든 브랜치라서 결국 버그가 그대로 되거나 심각하게는 다른 추가한 기능들 때문에 더 많은 버그가 생기는 오류가 생기는게 아닌지요? (즉 개발1,개발2...는 새로운 파일만 추가된것이 아닌 기존의 파일들을 수정 도하고 새로운 파일들도 추가된 가정에서요)

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
kelo 댓글 1 좋아요 0 조회수 242

"git, github 기초부터 실전까지" 에서 궁금한 점...

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

10분 40초쯤에 '회원가입 구현'에 체크아웃을 하면 이전으로 롤백(?)이 된다고 하셨는데, 궁금한게 그런데 옆에 아이콘 main은 그대로 '로그인 수정'에 있는게 이해가 안돼요. 그래프도 파란색에서 노란색으로 바뀐게 왜 그런지.. 위와 관련이 있는건지. 예를 들어서 로그인 수정 기능은 없애고 그냥 회원가입 구현때로 돌아갈려고 체크아웃했는데, 로그인 수정이 그대로 있는것이라면 실제 서비스 시에는 로그인 수정한 서비스가 보여지는건지 아니면 회원가입 구현한것까지만 보여지는건지(로그인 수정은 안한걸로)... 근데 main? 이라는 아이콘은 로그인 수정에 있고...노란색으로 바뀌고...(나중에 알려주시나요?)

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
kelo 댓글 2 좋아요 0 조회수 138

맥에서 사용하시는 윈도우 프로그램

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

안녕하세요 강사님! 터미널 설명해주실 때 맥에서 windows os 사용하시는 프로그램 보여주셨는데, 혹시 어떤 프로그램인지 알 수 있을꺼요?

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
Jeong 댓글 1 좋아요 0 조회수 72

섹션 56에 대한 질문합니다

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

2분38초 즈음에 발음이나 자막상으로 컨트롤 + esc 를 누르면 클로드 창에 mcp playwright를 사용할 건지에 대한 창이 뜬다고 하는데 저는 윈도우 사용자고 컨트롤 esc를 눌러도 영상에 나오는 mcp서버를 프로젝트에 추가할 건지에 대한 목록이 안 뜹니다 스크린샷 첨부합니다

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
잉페 댓글 2 좋아요 0 조회수 97

소셜정보 수정

미해결

Next.js with Spring Boot

소셜 로그인하면 정보 수정에 비밀번호 수정은 의미 없겠네요?

  • javascript
  • react
  • spring-boot
  • jpa
  • next.js
오일중 댓글 2 좋아요 0 조회수 89

수업 내용 재현이 거의 안되네요

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

너무 다르게 진행이 되어서 강의 영상이 도움이 안됩니다. tailwind v4로는 에러가 해결이 안된다고 v3로 낮춰버리네요. 결과물은 형편 없습니다..

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
이상현 댓글 2 좋아요 0 조회수 140

커스텀 챗 기능 없어졌나요?

미해결

3시간 만에 끝내는 Cursor 완벽 가이드

버그나 그런거때문에 사용을 안하는 것 같아보이네요.. 다운그레이드해서 사용해야하려나요?

  • react
  • next.js
  • cursor
  • 인공지능(ai)
김영재 댓글 1 좋아요 0 조회수 57

개발환경 구성 관련) PowerShell에서 npm 꼭 사용해야 하나요?

미해결

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

해결 방법으로 관리자 권한에서 Set-ExecutionPolicy RemoteSigned -Scope CurrentUser 명령을 할 경우 문제가 없는지 AI로 확인해 보았습니다. 아래와 같이 말해주는데, 그냥 터미날 이용해서 강의 진행해도 문제 없나요? Set-ExecutionPolicy RemoteSigned -Scope CurrentUser 명령은 개발 환경(nvm, yarn, 허가되지 않은 스크립트 실행 등)을 설정할 때 흔히 사용되지만, 관리자 권한 으로 실행할 때 발생할 수 있는 보안적, 시스템적 측면의 문제점은 다음과 같습니다. 1. 로컬 악성 스크립트 실행 위험 (보안 취약점) RemoteSigned 정책의 핵심은 "내가 직접 만든(로컬) 스크립트는 서명 없이 실행 가능" 하고, "인터넷에서 다운로드한 스크립트는 신뢰된 서명이 있어야 함" 입니다. 문제점: 만약 악성코드나 해커가 시스템에 침투하여 교묘하게 스크립트 파일을 생성했다면, 이 파일은 '로컬에서 생성된 것'으로 간주되어 아무런 제약 없이 실행 됩니다. 관리자 권한 결합 시: 일반 사용자 권한이라면 스크립트가 실행되어도 시스템 파일을 건드리기 어렵지만, 관리자 권한으로 실행 중인 파워셸에서 이 정책이 풀려 있으면 시스템 삭제, 레지스트리 변조, 백도어 설치 등이 매우 쉬워집니다. 2. 권한 상승 공격(Privilege Escalation)의 발판 해커는 종종 시스템에 침투한 후 더 높은 권한을 얻으려고 시도합니다. 문제점: 실행 정책이 완화되어 있으면, 공격자가 시스템 내부에서 작성한 공격용 .ps1 스크립트를 관리자 권한으로 실행할 수 있는 통로를 열어주게 됩니다. 위험성: 관리자 권한의 파워셸은 윈도우의 모든 방어 체계를 무력화할 수 있는 강력한 도구입니다. 3. 'Remote' 판정의 모호성 (파일 차단 해제) RemoteSigned 는 인터넷에서 받은 파일인지 여부를 파일의 'Zone.Identifier' (Alternate Data Stream) 정보를 보고 판단합니다. 문제점: 압축을 풀거나 특정 방식으로 복사된 스크립트 파일은 '인터넷에서 다운로드했다'는 표식이 사라질 수 있습니다. 이 경우 시스템은 이를 '안전한 로컬 파일'로 오인하여 서명 확인 없이 실행해 버립니다. 4. 영구적인 설정 변경의 위험 -Scope CurrentUser 는 현재 로그인한 사용자의 설정을 영구적으로 바꿉니다. 문제점: 당장 특정 도구(nvm 등)를 설치하기 위해 설정을 바꿨다가, 설치가 끝난 후에도 계속 이 상태로 방치되는 경우가 많습니다. 이는 시간이 지나면서 시스템 전체의 보안 수준을 지속적으로 낮게 유지하는 결과를 초래합니다. 5. 전사 보안 정책(GPO)과의 충돌 회사나 조직 내에서 관리되는 PC의 경우: 문제점: 그룹 정책(GPO)으로 금지된 설정을 강제로 변경하려고 시도할 경우, 설정이 적용되지 않거나 IT 관리 시스템에서 보안 위반 경고(Alert) 가 발생하여 보안 팀의 조사를 받을 수 있습니다. 안전하게 사용하는 권장 방법 위의 위험을 최소화하면서 필요한 작업을 하려면 다음과 같은 방법을 권장합니다. 일시적으로만 적용하기 (Bypass 사용) 전체 시스템 설정을 바꾸지 않고, 해당 파워셸 창을 닫으면 원래대로 돌아가게 합니다. code Powershell # 특정 스크립트를 실행할 때만 정책 우회 powershell.exe -ExecutionPolicy Bypass -File .\myscript.ps1 작업 완료 후 원복하기 작업이 끝났다면 다시 가장 안전한 상태인 Restricted 또는 AllSigned 로 돌려놓는 것이 좋습니다. code Powershell Set-ExecutionPolicy Restricted -Scope CurrentUser 신뢰할 수 있는 파일만 차단 해제하기 인터넷에서 받은 스크립트가 실행되지 않을 때는 전체 정책을 풀지 말고, 해당 파일만 신뢰한다고 표시하세요. code Powershell Unblock-File -Path "C:\path\to\script.ps1" 결론적으로, 개발 편의를 위해 RemoteSigned 를 쓰는 것이 일반적이긴 하지만, 관리자 권한 으로 이 설정을 열어두는 것은 "서명되지 않은 외부 공격 도구에게 내 시스템의 마스터키를 넘겨줄 수 있는 통로" 를 열어두는 것과 같습니다. 꼭 필요한 경우에만 잠시 사용하고 다시 잠그는 습관이 중요합니다.

  • react
  • next.js
  • cursor
  • tailwindcss
  • claude
목요일 댓글 1 좋아요 0 조회수 208

인기 태그

인프런 TOP Writers

주간 인기글