묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨실무에 바로 적용하는 스토리북과 UI 테스트
테일윈드를 안쓰고 스타일 컴포넌트만 사용하는 환경에서는요?
테일윈드를 안쓰고 스타일 컴포넌트만 사용하는 환경에서는요? 테일윈드로 환경셋팅을 하는게 맞을까요??
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
map메소드에 대해 질문있습니다.
안녕하세요 강의 너무 잘 듣고 있습니다 공부를 하다가 map메소드에 대해 궁금한점이 있습니다. 예를 들어 items.map((item) => ) 여기서 어떨때에는 items.map((item) => () ) 화살표 다음에 ()가 오고 또 어떤 상황에는 items.map((item) => {}) 이렇게 {} 가 작성되는데 어떤 차이점이 있는지 궁금합니다.
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
수강후기 작성법 문의
수강후기 남기는 창을 벗어나니 다시 수강후기를 남길수 있는 방법이 없는데요 수강후기 남길수 있는 링크좀 전달 해주시면 감사하겠습니다.
-
미해결기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)
Vercel signup이 안되요,, 계속 제 깃허브 계정은 추가 인증이 필요하다며 registration@vercel.com에 문의를 하라고 하네요,,, 이럴땐 진행을 어찌해야할까요,,,
Vercel signup이 안되요,, 계속 제 깃허브 계정은 추가 인증이 필요하다며 registration@vercel.com에 문의를 하라고 하네요,,, 이럴땐 진행을 어찌해야할까요,,,
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
todolist할때 컴포넌트 분리 안했던 것 같은데...
✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다.💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다.강의보고 todolist할때 컴포넌트 분리 안했던 것 같은데...dropbox (선택수강)UI구축에 보면 supabase-todo-list vscode에 컴포넌트폴더에 ui컴포넌트 들이 있네요... 혹시 추가 작업을 하셨던 것일까요??
-
미해결Tailwind CSS로 만드는 멋진 웹 UI 스타일링
유틸리티 클래스 외부 링크
html안에 style에 정의된 apply 코드들은 cdn으로 링크된 tailwindcss 스크립트가 tailwindcss 스타일로 인식해 실시간으로 빌드하여 적용되지만 외부 스타일로 링크하면 일반 css로 인식해서 빌드하지 못하기 때문에 적용되지 않는다고 하네요그래서 cli로 빌드해서 적용해야 한다고 합니다
-
미해결기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)
에러, 로딩 내용 페이지를 모든 페이지에 다 만드는 이유가 따로 있나요?
에러나 로딩을 전역적으로 상태로 봐서 에러나 로딩을 띄우는게 아닌, 페이지별로 전부 다 복붙으로 넣는 이유가 따로 있나요..? 일단 따라해보고있긴 한데, 뭔가 좀 아닌것 같아서 질문 드립니다ㅠㅜ
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
eslint.config.js (flat config): eslint.config.js 파일에서 eslint-config-prettier를 import한 후, 다른 설정을 재정의할 수 있도록 설정 배열의 마지막에 추가합니다.
eslint.config.js (flat config): eslint.config.js 파일에서 eslint-config-prettier를 import한 후, 다른 설정을 재정의할 수 있도록 설정 배열의 마지막에 추가합니다.에서 어떻게 import해야하는가요? import eslint-config-prettier from 'eslint-config-prettier';로 하면 오류가 납니다.
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
.prettierrc를 적용했는데 저장하니 ;이 왜 안생길까요?
.prettierrc를 적용했는데 저장하니 ;이 왜 안생길까요?
-
미해결실무에 바로 적용하는 스토리북과 UI 테스트
[질문 x 공유용] tailwind v4.0 으로 강의랑 다를 때 (import 다름, tailwind.config.js 없어짐 등)
강의랑 다른 부분 1. tailwind 설치 커맨드: 커맨드가 간단해졌어요.npm install tailwindcss @tailwindcss/vite 강의랑 다른 부분 2. vite.config.ts : 이제 ***.tsx, ***.jsx 를 일일히 넣지 않아도 됩니다.import { defineConfig } from 'vite' import tailwindcss from '@tailwindcss/vite' export default defineConfig({ plugins: [ tailwindcss(), ], }) 강의랑 다른 부분 3. @import ~ 3줄 @import "tailwindcss";한 줄로 초간단해짐.. 강의랑 다른 부분 4. tailwind.config.js: config.js 가 없어졌습니다. (자세한 내용: https://tailwindcss.com/blog/tailwindcss-v4#css-first-configuration)대신 index.css 에 아래와 같은 형식으로 theme 을 적용할 수 있습니다.@import 'tailwindcss'; @theme { --color-primary: #1d2745; --color-secondary: #1de5d4; --color-tertiary: #1d2745; --color-white: #ffffff; --color-mono100: #f1f1f1; --color-mono200: #bebebe; --color-mono300: #d6d7d9; --color-error: #d01e1e; --color-social: #395997; }
-
미해결TailwindCSS 완벽 마스터: 포트폴리오부터 어드민까지!
nested 리스트일때 <ul> bullet 스타일 바꾸는 방법
안녕하세요 강사님typescript next 환경에서 포트폴리오를 만들고 있는데요위 사진처럼 nested list 구조 일때 불릿 스타일이 변하지 않습니다.tailwind.config.ts 에서 기본 ul 태그 스타일을 수정해볼까 하는데ul { list-style-type: disc; } ul ul { list-style-type: circle; } ul ul ul { list-style-type: square; }이런식(?)으로요특정 요소만 기본 css 를 사용하고 싶거나 위 처럼 tailwind 스타일을 커스텀하고 싶을때 어떻게 하면될까요?
-
미해결Tailwind CSS로 만드는 멋진 웹 UI 스타일링
반응형 레이아웃 문의 드려요.
죄송하지만 질문하실 때 React 또는 Vue와 같은 자바스크립트 프레임워크에서 Tailwind CSS 설치 및 사용에 관한 질문은 하지 말아주세요. 질문하셔도 React 또는 Vue 환경을 몰라서 답변을 드릴 수가 없습니다. 오직 순수한 Tailwind CSS 관련 질문과 CSS 속성 및 활용에 관한 질문만 해주시면 감사드리겠습니다. 강의명 : 반응형 레이아웃 - Responsive Design Container 과 Responsive Design 차이가 아래가 맞을까여? Container: 전체적으로 반응형으로 설정 Responsive Design : 선언한 엘리먼트 기으로 (국소적으로) 레이아웃을 세세하게 컨트롤 한다
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
vscode에서 @material-tailwind/react component를 가져왔을 때 뜨는 빨간줄 제거할 수는 없나요?
✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다.💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다. 안녕하세요?질 좋은 강의 잘 듣고 있습니다.코드를 치면서 신경쓰이는 부분이 있어서 질문드립니다.vscode에서 @material-tailwind/react component를 가져왔을 때 뜨는 빨간줄 없앨 수는 없나요?
-
미해결Tailwind CSS로 만드는 멋진 웹 UI 스타일링
메인 폰트 사용법이 궁금합니다.
4.0 기준으로 학습하고 있습니다.input.css 파일을 아래와 같이 작성하면자동으로 Montserrat 폰트 즉 첫번째 줄 폰트가적용되는건가요?메인 폰트 적용 방법을 모르겠습니다.@theme { --font-mont: "Montserrat", "sans-serif"; --font-noto: "Noto Sans KR", "Arial", "sans-serif"; /* Color */ --color-deepgreen:#6ab04c; --color-deeporange:#f0932b;}
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
searchMovies에서 hasNextPage가 필요한 이유
안녕하세요 로펀님. 강의 잘 듣고 있습니다. useInfiniteQuery에서 반환하는 hasNextPage를 이용해 fetchNextPage를 하는데 searchMovies에서 작성한 const hasNextPage = count > page * pageSize 는 사용하지 않는 것 같아서 질문 올립니다! {data?.pages ?.map((page) => page.data) ?.flat() ?.map((movie) => ( <MovieCard key={movie.id} movie={movie} />))}에서도 searchMovies 에서 반환하는 page, pageSize, hasNextPage를 제외하고 data만 쓰시길래 작성하신 이유가 궁금합니다. useInfiniteQuery에서 반환하는 hasNextPage와는 다른 건가요??
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
Counter 컴포넌트 전부 리렌더링 되는 현상
<Counter onTotal={handleTotal} /><hr/><Counter onTotal={handleTotal}/><hr/><Counter onTotal={handleTotal}/>여기서 Counter.jsx에서 console.log 를 추가했고버튼 세 개 중 하나만 눌러도 <Counter /> 세 개 전체가 리렌더링 됩니다. (log 가 세번찍힘)왜그런건가요 ?
-
해결됨[풀스택 입문] Firebase보다 10배 좋은 Supabase
쿠폰 문의
[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14) 할인 쿠폰코드를 적용하려니까 신규 발급이 제한되었거나 발급 수량이 초과된 쿠폰이라고 하네요 ㅠ
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
npx create-react-app cra-react-app 실행시 에러가 발생합니다.
뭔가 잘 모르겠는데.. 아래 확인 부탁드려도 될까요?설정한것도 없는것 같은데 기본 생성 명령어자체가 실행이 안된다니..ㅠㅠㅠㅠ manijang2@gimseonman-ui-MacBookAir VSProjects % npx create-react-app cra-react-app Creating a new React app in /Users/manijang2/VSProjects/cra-react-app. Installing packages. This might take a couple of minutes. Installing react, react-dom, and react-scripts with cra-template... added 1324 packages in 40s 268 packages are looking for funding run `npm fund` for details Initialized a git repository. Installing template dependencies using npm... npm error code ERESOLVE npm error ERESOLVE unable to resolve dependency tree npm error npm error While resolving: cra-react-app@0.1.0 npm error Found: react@19.0.0 npm error node_modules/react npm error react@"^19.0.0" from the root project npm error npm error Could not resolve dependency: npm error peer react@"^18.0.0" from @testing-library/react@13.4.0 npm error node_modules/@testing-library/react npm error @testing-library/react@"^13.0.0" from the root project npm error npm error Fix the upstream dependency conflict, or retry npm error this command with --force or --legacy-peer-deps npm error to accept an incorrect (and potentially broken) dependency resolution. npm error npm error npm error For a full report see: npm error /Users/manijang2/.npm/_logs/2025-02-03T13_23_36_276Z-eresolve-report.txt npm error A complete log of this run can be found in: /Users/manijang2/.npm/_logs/2025-02-03T13_23_36_276Z-debug-0.log `npm install --no-audit --save @testing-library/jest-dom@^5.14.1 @testing-library/react@^13.0.0 @testing-library/user-event@^13.2.1 web-vitals@^2.1.0` failed manijang2@gimseonman-ui-MacBookAir VSProjects %
-
미해결기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)
3.2, 3.3 화면에 아무것도 나오지 않고 있습니다!
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
react 19버전에서는 recoil사용이 어렵나요?
✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다.💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다. 안녕하세요. recoil 강의 부분에서 하나의 에러로 인해서 진행이 막힌 상태입니다!TypeError: Cannot destructure property 'ReactCurrentDispatcher' of '{imported module [project]/nodemodules/next/dist/compiled/react/index.js [app-client] (ecmascript)}.default.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' as it is undefined. "dependencies": { "next": "15.1.6", "react": "^19.0.0", "react-dom": "^19.0.0", "recoil": "^0.7.7" },next 15 & react 19 버전으로 진행중이었는데구글링을 해보아도 다들 더이상 recoi은 사용하지말라 이런 답만 알려주고있어 해결하기가 어려운 상태네요. 결국 버전문제인 것 같은데, 최신 버전으로 해당 문제가 해결이 어렵다면 다른 상태관리 라이브러리를 사용하며 진행하고싶은데요,Zustand 라이브러리를 사용해도 진행에 무리없을까요?