# Material Tailwind 와 연관된 라이브러리 설치 npm install @emotion/react @emotion/styled @material-tailwind/react @mui/icons-material --save npm install @tailwindcss/typography autoprefixer --save-dev 지난주 공개된 next.js 15에서 Material Tailwind 설정하려니 안되서 도움 부탁드립니다. 아직 초보라 이런 부분들이 개인적으로 좀 어렵네요~~^^;
개요 react-modal 라이브러리를 사용하고 있다가 Storybook에 등록하여 관리하고 싶어서 작성하는데 아래와 같이 컴포넌트를 작성했다가 스토리북 화면에서에러가 발생하였습니다. 강사님께서는 Modal의 경우 어떤식으로 해서 Storybook을 동작가능하게 하셨는지 궁금합니다. 현재는 Modal.setAppElement('body')로 처리하여 임시로 실행되게 하였으나, 더 좋은 다른 방법이 있을지 질문드립니다. import Modal from 'react-modal'; Modal.setAppElement('#root'); // 모달이 열린 상태에서도 접근성을 보장하기 위해 필요합니다. const BaseModal: React.FC<BaseModalProps> = ({ Missing Context/Providers: You can use decorators to supply specific contexts or providers, which are sometimes necessary for components to render correctly. For detailed instructions on using decorators, please visit the Decorators documentation.
카카오 로그인 까지 구현 후 vercel에 배포 까지 한 상태이고 아직 도메인은 등록 하지않았습니다만 집에서 할 때는 vscode로 로컬 서버를 열어놔서 몰랏었는데 로컬 서버를 열어놨을 때는 잘되지만 밖에서 제가 vercel에 배포한 사이트를 들어가서 카카오 로그인을 시도해보니 localhost에서 연결을 거부했습니다. ERR_CONNECTION_REFUSED 에러가 나오는데 어디가 문제 인걸까요? ㅠ
기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)
7.4 PlayListCarousel - 1 강의의 6분 15초를 보시면, <div className="relative left-[-45px]"> 부분이 있는데요. left-[-45px]을 해야 화살표가 보이게 되는데, 이게 왜 그런질 모르겠습니다. 근데 제가 질문 드리고싶은 것은, 저 코드가 어떤 원리로 작동되는지가 아닙니다. 이럴때는 스스로 그냥 계속 문서를 참고하든 개발자도구를 참고하든 이해 될때까지 파고드는게 맞는 방법인지 여쭤보고 싶습니다. 이것 말고도 제가 어려웠던 부분에 대한 예시를 들자면, 1) components 폴더에 저장되는 것들과 components/elements 폴더에 저장되는 것들의 차이를 정확히 모르겠음. 2) 태그를 감쌀때 어떤 것은 div로 컨테이너를 주시고 어떤것은 안주시는 경우가 있는데, 차이를 모르겠음. 3) useUIState에 저장된 변수 이름이 "homeCategory"인데, 제 생각엔 이것 보다는 "selectedSubject" 같은 이름이 더 직관적이라 생각하는데, 그럼에도 제 생각보단 선생님 생각이 맞을건데 제 생각이 어느부분이 부족한질 모르겠음. 4) 위와 같은 문제들을 해결하고 싶어서, 책을 찾아보려 하는데 리액트 훅을 설명해주는 책들은 많은데, HTML CSS를 어떤 구조로 짜야 하는지, 리액트 앱 만들때 폴더구조는 어떻게 하는게 좋은지에 대한 책은 없어서 어떻게 해야할지 모르겠음. 이런 어려움이 있었습니다. 혹시 공부법 조언 부탁드려도 될까요?
기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)
지금 여기까지 구현 했는데 이렇게 순서 바꾸기를 해야 되는데 잘안됩니다 혹시 원인이나 해결 방법 아시나요? https://okky.kr/questions/1516211 그리고 이렇게 데이터가 복잡할 경우 프론트에서 데이터 가공해서 디비로 보내는게 어쩔수 없다고 보시나요 아니면 조금 과잉이라고 보시나요? 그점도 궁금합니다
안녕하세요 개발자님. vite초기설정할때 "Select a variant" 설정에서 typescript+ SWC대신 typescript를 하는 이유가 뭔가요? 최근에 vite를 사용하면서 검색을 한 결과 보통 react에서 사용하는 babel보다 c로 만들어진 SWC가 더 빨라서 좋다고 들어서 이전에는 typescript + SWC를 선택하여 프로젝트를 하였는데 그냥 typescript를 선택한 이유가 있나요? 현업에서는 주로 어떤걸 선택하나요? 추가로, 현업에서는 보통 번들러를 vite를 사용하나요? 현재 컴퓨터학부에 진학중인 3학년이라 궁금한 점이 많고 현업에선 어떻게 (번들러 등)쓰이는지 궁금하네요! 아는 현업자 선배분께선 보통 vite는 아직 안정하지가 않아서 다른 번들링 방법을 사용하다고 들었는데 개발자님의 생각이 궁금합니다. 말이 길어져서 죄송합니다. 긴 글 읽어주셔서 감사합니다!
$ npm run build > instagram-clone@0.1.0 build > next build ▲ Next.js 14.2.12 - Environments: .env Creating an optimized production build ... ✓ Compiled successfully Linting and checking validity of types .Failed to compile. Linting and checking validity of types ...next/types/app/page.ts:8:13 Type error: Type 'OmitWithTag<typeof import("D:/Study/React/next/Supabase/instagram-clone/app/page"), "config" | "generateStaticParams" | "revalidate" | "dynamic" | "dynamicParams" | "fetchCache" | "preferredRegion" | ... 6 more ... | "generateViewport", "">' does not satisfy the constraint '{ [x: string]: never; }'. Property 'matadata' is incompatible with index signature. Type 'Metadata' is not assignable to type 'never'. 6 | 7 | // Check that the entry is a valid entry > 8 | checkFields<Diff<{ | ^ 9 | default: Function 10 | config?: {} 11 | generateStaticParams?: Function 빌드할때 오류뜹니다 .next 안에 있는 오류인데 지웠다 다시 해도 똑같아요 어떻게 해야 할까요??
안녕하세요, 일단 이해하기 쉽게 강의 만들어주셔서 감사드린다는 말씀드리고 싶습니다. 현재 next app router에서 진행중인데요, primary라는 스토리를 생성하고, 그 내에 사용하는 Props들을 추가하였습니다. 다만 강의(DefaultTextField 컴포넌트 생성과 스토리 생성 부분)에서는 onIconClick() 이라던지, onChange와 같은 함수들에 대해서는 스토리에 추가를 하지 않아도 에러가 뜨지 않던데, 저는 args 부분에 에러 라인이 그어지더라구요. 혹시 이 이유 알 수 있을까요? 감사합니다!
기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)
next zustand 세팅 시, provider 를 사용해야한다는 글이 있어서요. 현재 강의처럼 이후에 서비스 개발 시 사용해도 이슈가 없는 부분일까요? https://zustand.docs.pmnd.rs/guides/nextjs#providing-the-store https://leonkong.cc/nextjs-zustand-
안녕하세요, 채팅 관련 부분에, reverseInfiniteQuery를 적용할 수 있을 것 같아, 도전해보던 찰나에 잘 안되어서 질문드립니다!! 혹시 역무한스크롤 방식으로 할 수 있는 방법이 있을까요?? 보통 실무에서 채팅을 어떠한 방식으로 구현하는지 매우 궁금합니다. 1. 역무한 스크롤 방식 2. 계속해서 refetch를 하는 방식
안녕하세요, Supabase 인증강좌를 너무 잘 들었습니다! 혹시 smtp 추가 강좌는 언제 추가 될 예정인지 알 수 있을까요?? 또 추가적으로, Supabase에 큰 관심이 생겨서, 학습해보면서, 개인 블로그를 제작해보고자 하는데 보통 서버비용을 얼마정도로 예상하면 될지, 뭔가 요금 같은거를 대시보드 형태로 쉽게 볼 수 있는 방법이 있는지도 궁금합니다!
