안녕하세요 위 제목 같이  import {} 중괄호 차이점 1:import useCounter from "../context/counter/useCounter";2: import {useCounter} from "../context/counter/useCounter"; 중괄호 할때와 안할때의 차이점을 알고 싶습니다. 문의 답변 부탁드립니다. 

 후 connect 를 시도하면 아래와 같이 권한 문제로 접속이 안되고 있습니다.  (source tree는 관리자 권한으로 실행 되고 있습니다.)강사님~무엇이 문제인지요? 

제공되는 react_code.zip 중에 ..D:\su\code\SECTION11\11-02 D:\su\code\SECTION11\11-03 안에 소스가 없네요.당연히 제가 작성하면 되겠지만...참조하는 차원에서.. ㅡㅡ;;소스를 얻을 수 있을까요? 다른 폴더안에는 소스가 제공되고 있는데 말이줘 .. 

구입을 했는데 ...아래 비활성화 된 강의 리스트는 뭔가요? 뒤 강의를 보고 싶거든요

안녕하세요. 설명하시는 개념들이 매우 어렵게 느껴집니다. 굉장히 기본 개념을 설명하고 계신 것 같은데요. 강의를 어떤 자세로 수강해야 할까요? 부분 부분 계속 끊어져 있으니 이해가 안 됩니다. 책을 구매해서 보면 도움이 될까요?  

안녕하세요 강사님. 자바스크립트에 대한 기본을 어느 정도 공부하고 와야 할까요?

 // main.tsx import { StrictMode } from "react"; import { createRoot } from "react-dom/client"; import App from "./App.tsx"; import { ThemeProvider } from "styled-components"; const theme = { colors: { primary: "red", secondary: "#gray", }, fontSizes: { normal: "16px", large: "20px", }, }; createRoot(document.getElementById("root")!).render( <StrictMode> <ThemeProvider theme={theme}> <App /> </ThemeProvider> </StrictMode>, ); // App.tsx import styled, { keyframes, css } from "styled-components"; const boxShadowMixin = css` margin: 20px; box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.5); `; const fadeIn = keyframes` from { opacity: 0; } to { opacity: 1; } `; const Title = styled.h1<{ $color: string; $decoration: string }>` color: ${(props) => props.$color}; text-decoration: ${(props) => props.$decoration}; animation: ${fadeIn} 2s ease-in; `; const BigTitle = styled(Title)` font-size: 50px; `; const Wrapper = styled.section` padding: 2rem; border: 1px solid red; `; const BlueBorderWrapper = styled(Wrapper)<{ $shadow: boolean }>` border-color: ${(props) => props.theme.colors.primary}; ${(props) => props.$shadow && boxShadowMixin}; `; export default function App() { return ( <> <BlueBorderWrapper $shadow={true}> <Title $color="#00ff00" $decoration="line-through" as="p"> App Component </Title> <BigTitle $color="#0000ff" $decoration="underline"> App Component </BigTitle> </BlueBorderWrapper> </> ); } border-color: ${(props) => props.theme.colors.primary};적용하는 부분에서 에러가 발생합니다.Property 'colors' does not exist on type 'DefaultTheme'.혹시 문제가 있는걸까요?

2 퀴즈  강의에서 설명된 Create React App(CRA)과 Bit의 비교 중, Bit의 특징으로 언급된 것은 무엇인가요?  이거 오타 아닌가요? Bit -> Vite?

if (previewImage) { const formData = new FormData(); formData.append("file", previewImage); formData.append("upload_preset", "react_blog"); // formData.append("api_key", "688125195814112"); // formData.append("api_secret", "S2HFi155abf2HkDpkcgArvWP5HE"); // formData.append("public_id", "87f7932d-354d-4a7f-8f39-5dbf751f1c46"); const { data } = await axios.post( "https://api.cloudinary.com/v1_1/dptshe37e/image/upload", { formData }, ); console.log(data); https://api.cloudinary.com/v1_1/dptshe37e/image/upload  { "error": { "message": "Upload preset must be specified when using unsigned upload" }}일단 강의가 정말 훌륭합니다. 잘 듣고 있고 정말이지 많은 도움이 되고 있습니다.게시글 등록하기 -4 강을 듣고 있는데 파일 업로드 부분에서 좀 막히네요.요청 시 오류가 나는데요. 여러가지 방향으로 시도해 봤는데 잘 안되네요. 강의 촬영 시점하고 cloudnary 가 개편되었는데 특별하게 다른 점은 없어 보입니다. 일단 업로드 부분은 보류하고 다음 강의 들어야겠네요. 한번 살펴 봐 주시면 감사하겠습니다. 

import axios from "axios"; import { Heart } from "lucide-react"; import { useEffect, useState, useTransition } from "react"; interface Posts { id: number; isLike: boolean; } export default function App() { const [posts, setPosts] = useState<Posts[]>([]); const [isPending, startTransition] = useTransition(); useEffect(() => { startTransition(async () => { const { data } = await axios.get("http://localhost:3000/posts"); setPosts(data); }); }, []); if (isPending) return <h3>loading..</h3>; return ( <> {/* fill: 'none', stroke: 'currentColor' */} {/* fill: 'rgb(255,0,0)', stroke: 'rgb(255,0,0)' */} {posts.map((post) => { <Heart key={post.id} fill={post.isLike ? "rgb(255,0,0)" : "none"} stroke={post.isLike ? "rgb(255,0,0)" : "currentColor"} />; })} </> ); }   posts에 값이 설정되지 않는데요. 이런 경우가 처음이라 다른 예제는 이런 적이 없었습니다.몇 시간에 해보는데 뭐가 잘못되었는지 잘 모르겠네요.

안녕하세요, 디스코드 초대장이 올바르지 않다고 합니다.혹시 디스코드 채널을 닫으신걸까요?

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>

보통 상위 컴포넌트에 함수를 정의하고 하위 컴포넌트에서는 이벤트가 발생했을 때 상위 컴포넌트의 함수를 호출하는 방식이 맞는건가요?강의를 보니 하위 컴포넌트에서도 함수를 정의하는 것 같아서 질문드립니다. 어느 쪽에 함수를 정의하는 것이 맞는 것인지 궁금합니다.

안녕하세요 axios가 fetch보다 편리해 보여서 거의 axios만 사용할 것 같은데,그래도 fetch를 사용해야 하는 상황이 존재하나요?실제 현업에서는 어떤 쪽을 더 많이 사용하나요?

안녕하세요복습하러 들어왔습니다.그나저나 코딩님.. 뭐하나 여쭤봐도..다른 어느 소스를 보니까.. component 1index.jscomponent2index.jscomponent3index.js.. 폴더마다..죄다 ...... index.js 가 있는데...짐코딩님께 여쭤 봐도 될련지요.. ?번거로우시겠지만.. 고견 , 첨언 부탁드립니다.(P.S: 또 ..AI가 답변할라나? .쩝) [ AI ]" 컴포넌트 폴더에 index.js를 두는 리팩토링 팁???? "리팩토링?... 엥? 저렇게 리팩토리 하라고?( 거 참..머 할라고 저렇게 한데??? .. ㅡㅡ;;) 코딩님..헬프용. ㅜㅜ;;;  

안녕하세요.아직 Zustand강의 까지 보지는 않았는데,전역 상태 관리 방법으로는Redux Toolkit, Context API, Zustand 이렇게 세 가지가 있는 것 같습니다.결국 이 세 가지 모두 전역으로 상태를 관리한다는 점에서는 비슷해 보이는데, 나중에 제가 프로젝트를 할때 이 중에서 어떤 기준으로 선택하는 게 좋은지 궁금합니다.!

안녕하세요 강의를 너무 잘 보고 있습니다. 강의를 보다가 문득 궁금한점이 있는데 프론트엔드 취업을 위해서 어느정도로 알고 있어야 되는지 그리고 어디까지 공부를 하고 회사를 지원을 해야되는지 궁금하더라구요. 뭔가 완벽히 그리고 많이 알야된다는 걱정에 지원을 못하고 계속 공부만 하게 되는거 같은데 조언 부탁드립니다

안녕하세요.결론부터 말씀드리면, 언제 Tailwind CSS를 사용해야 하는지 아직 감이 잘 오지 않습니다.CSS를 적용하는 여러 가지 방식을 배우긴 했지만,리액트를 사용하다 보니 실무나 강의에서는 Tailwind CSS를 사용하는 경우가 특히 많다는 느낌을 받았습니다.그래서 “요즘은 거의 Tailwind가 기본처럼 쓰이는 건가?”라는 생각도 들게 됩니다.수코딩님이 항상 말씀해 주시는 것처럼,기술 자체보다도 어떤 상황에서 어떤 기술을 사용하는지가 더 중요하다고 생각하고 있습니다.그래서 단순히 “요즘 많이 쓰인다”는 이유로 선택하는 게 맞는지, 아니면 분명한 기준이 있는지 궁금해졌습니다.죄송합니다만 아직 이해가 부족해서 질문드리고 싶습니다.Tailwind CSS는 어떤 상황에서 사용하는 것이 적절한지실제로 실무에서 거의 고정적으로 사용되는 편인지CSS Module, Styled Components 같은 다른 방식들은 요즘 잘 사용되지 않는지만약 사용된다면 각각은 어떤 상황에 더 적합한지이 부분을 비교해서 정리해 주실 수 있을지 궁금합니다.“언제 어떤 CSS 방식을 선택해야 하는가”라는 관점에서 설명해 주시면 감사하겠습니다

현재 카카오 개발자 페이지에서 플랫폼에 계정상태 변경 웹 훅 , 연결 해제 웹훅 , 카카오톡 공유 웹훅 이 있는데 수업에서 보여주시는게 달라서 질문드립니다 이 화면에서 계정 상태 변경 웹훅 설정을 들어가면 이 화면이 나오는데 여기서는 https 프로토콜만 사용이 가능하다고 나오는데 이 설정은 어떻게 해야 할까요? 현재 mongdb 와 그 이외에 모든 환경설정은 강의와 똑같이 했는데 카카오로그인 페이지 이동 자체가 안되서요!!