학습 관련 질문을 남겨주세요 성실히 답변해드립니다! 강의와 관련이 없어도 유사한 학습 질문도 괜찮습니다 강의에서 나오는대로 따라 모두 설치를 했습니다. 근데 제 vscode에서는 강의처럼 자동 완성을 강의처럼 제공해주지 않고 있어요... 혹시 어떤 익스텐션인지 알 수 있을까요? 그리고 fastapi와 react에서 더 유용한 익스텐션들이 있다면 알고 싶어요!
import { useId } from "react"; type CheckboxProps = Omit<React.ComponentPropsWithoutRef<"input">, "type"> & { type?: "checkbox"; parentClassName: string; }; export default function Checkbox(props: CheckboxProps) { const uuid = useId(); const { parentClassName, children, ...rest } = props; return ( <> <div className={parentClassName}> <input id={uuid} {...rest} /> <label htmlFor={uuid}>{children}</label> </div> </> ); } useEffect(() => { const randomText = Array.from( { length: 100 }, (_, index) => `Todo Item #${index + 1}`, ); randomText.forEach((text) => addTodo(text)); }, []); 대량 데이터 생성 후 테스트를 하는데 중복 키값이 생성되었는데요. uuid 부분인 것 같은데. 노트북 장비 사양 때문에 그런건지요? installHook.js:1 Encountered two children with the same key, 1770775434402 . Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.
안녕하세요 저도 아래에 글 남기신 분과 같은 질문사항인데요 카카오개발자센터가 리뉴얼 되면서 Web 플랫폼 등록을 어디서 해야될지 모르겠습니다. 올려주신 리뉴얼 영상에서는 리다이렉트 URL 설정하는 부분만 나와있습니다. 그리고 앱 띄워서 로그인 버튼을 클릭하면 아무런 반응이 없는데 onClick 같은 요소가 존재하지 않아서 그런 것 같습니다. 확인해주시면 감사하겠습니다. {/* 카카오 로그인 버튼 */} <button className="w-full flex items-center justify-center gap-2 bg-[#FEE500] text-[#000000] py-3 rounded-lg hover:bg-[#FDD800] transition-colors font-medium"> <img src="https://developers.kakao.com/assets/img/about/logos/kakaolink/kakaolink_btn_small.png" alt="Kakao Logo" className="w-5 h-5" /> Continue with Kakao </button>
안녕하세요. 아직 Zustand강의 까지 보지는 않았는데, 전역 상태 관리 방법으로는 Redux Toolkit, Context API, Zustand 이렇게 세 가지가 있는 것 같습니다. 결국 이 세 가지 모두 전역으로 상태를 관리한다는 점에서는 비슷해 보이는데, 나중에 제가 프로젝트를 할때 이 중에서 어떤 기준으로 선택하는 게 좋은지 궁금합니다.!
안녕하세요. 결론부터 말씀드리면, 언제 Tailwind CSS를 사용해야 하는지 아직 감이 잘 오지 않습니다. CSS를 적용하는 여러 가지 방식을 배우긴 했지만, 리액트를 사용하다 보니 실무나 강의에서는 Tailwind CSS를 사용하는 경우가 특히 많다 는 느낌을 받았습니다. 그래서 “요즘은 거의 Tailwind가 기본처럼 쓰이는 건가?”라는 생각도 들게 됩니다. 수코딩님이 항상 말씀해 주시는 것처럼, 기술 자체보다도 어떤 상황에서 어떤 기술을 사용하는지가 더 중요하다 고 생각하고 있습니다. 그래서 단순히 “요즘 많이 쓰인다”는 이유로 선택하는 게 맞는지, 아니면 분명한 기준이 있는지 궁금해졌습니다. 죄송합니다만 아직 이해가 부족해서 질문드리고 싶습니다. Tailwind CSS는 어떤 상황에서 사용하는 것이 적절한지 실제로 실무에서 거의 고정적으로 사용되는 편인지 CSS Module, Styled Components 같은 다른 방식들은 요즘 잘 사용되지 않는지 만약 사용된다면 각각은 어떤 상황에 더 적합한지 이 부분을 비교해서 정리해 주실 수 있을지 궁금합니다. “언제 어떤 CSS 방식을 선택해야 하는가”라는 관점에서 설명해 주시면 감사하겠습니다
현재 카카오 개발자 페이지에서 플랫폼에 계정상태 변경 웹 훅 , 연결 해제 웹훅 , 카카오톡 공유 웹훅 이 있는데 수업에서 보여주시는게 달라서 질문드립니다 이 화면에서 계정 상태 변경 웹훅 설정을 들어가면 이 화면이 나오는데 여기서는 https 프로토콜만 사용이 가능하다고 나오는데 이 설정은 어떻게 해야 할까요? 현재 mongdb 와 그 이외에 모든 환경설정은 강의와 똑같이 했는데 카카오로그인 페이지 이동 자체가 안되서요!!
안녕하세요. 리액트를 공부하면서 컴포넌트 나누는 기준이 헷갈려서 질문드립니다. 강의에서 컴포넌트 분리에 대해 설명을 듣긴 했는데, 막상 제가 직접 코드를 짜다 보니까 어디까지 나누는 게 맞는지 감이 잘 안 옵니다. 제가 헷갈리는 부분은 이런 점들입니다. 컴포넌트는 중복되는 UI가 있을 때만 나누는 건지, 아니면 처음부터 최대한 작고 이해하기 쉬운 단위로 나누는 게 좋은 건지 잘 모르겠습니다. 또 컴포넌트 안에서 코드를 작성하다 보면 “이건 그냥 이 컴포넌트 안에 둬도 되나?” “아니면 여기서 한 번 더 분리하는 게 맞나?” 이런 판단을 어떤 기준으로 해야 하는지도 잘 모르겠습니다. 폴더 구조도 사람마다 다 달라서 어떤 구조가 좋은 구조인지, 초보자 입장인 저한테는 아직 잘 모르겠습니다 이론적으로는 이해한 것 같은데, 실제 코드에서는 이 분리가 과한 건지, 부족한 건지 판단이 잘 안 됩니다. 리액트에서 컴포넌트를 나눌 때 어떤 생각 흐름으로 판단하면 좋은지 , 알기 쉽게 설명해주시면 감사하겠습니다.
안녕하세요. 강의 너무 잘 보고 있습니다. 강의자님은 이 부분에 빨간줄이 안나오는데 저는 빨간줄이 나오고 있어서 문의 드립니다. 리액트는 19버젼인 것 확인 했습니다. intervalId 으로 시간 받는 부분인데요. 기능은 잘 작동하고 있지만 강사님은 안나오고 저만 나오고 있어서 문의 드립니다. 항상 감사합니다!! ㅎㅎ
폼을 만들 때 input, textarea, radio, checkbox 같이 태그 종류가 달라도 하나의 객체 상태로 묶어서 관리하는 방식으로 만들어 보았습니다만 실무에서나 보통은 하나씩 만드는지 아니면 이것또한 정답이 없는지 궁금합니다! 아니면 상황에 따라 상태를 나누는 기준이 따로 있는지도 궁금합니다.
안녕하세요. class로 되어 있어서 에러가 나는 부분을 전부 className으로 수정하실 때선택할떄에 윈도우는 컨트롤+쉬프트+L을 눌르셨었나요? 그게 저는 안되서 일단 컨트롤 + D로 하나하나 선택을 했었느데요. 여러 row를 한번에 선택해서 수정할 떄에 어떤 키를 누르시는지 궁긍합니다.
안녕하세요. 지금 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. 이 부분을 넣지 않아도 괜찮을지에 관하여서 문의 드려봅니다. 강의 너무 잘 보고 있습니다 감사합니다.
안녕하세요. 누르신 키보드가 어떤것인지 질문 드립니다. useSta까지 입력하시고 자동생성된 useStateSnippet를 선택을 하셔서 const [first, setFirst] = useState 이게 자동으로 생성이 되는데 생성이 되자마자 어떤 키보드를 누르셨는지 [showNotification, setShowNotification]= useState(second) 로 변경이 되더라구요.. 어떤 것을 입력하셔서 변경이 됬는지 알 수 있을까요?
안녕하세요. App.tsx에서 스트링이랑 넘버로 보낸 이 후에 그 값을 받아오는 PrintValue.tsx에서 모든 타입들을 boolean으로 설정을 했는데 에러가 나고 있지 않습니다. 제가 뭘 잘못한건지를 아무리 찾아봐도 모르겠어서 질문을 올려봅니다... 강의 너무 잘 보고 있습니다.