안녕하세요. 소플님. 강의 정말 잘 듣고 있습니다. 컴포넌트 합성과 추출에서 props에 관련하여 질문이 있어 질문을 드립니다. // Component 추출 전 function Comment(props){ return ( <div className = "comment"> <div className = "user-info"> <img className = "avatar" src = {props.author.avatarUrl}, alt = {props.author.name} /> <div className = "user-info-name"> {props.author.name} </div> </div> <div className = "comment-text"> {props.text} </div> <div className = "comment-date"> {formatDate(props.date)} </div> </div> ); } 첫 코드가 Component를 추출하기 전의 코드이고 /* Component 추출 후 */ // 1. Avatar Component 추출 function Avatar(props){ return( <img className = "avatar" src = {props.user.avatarUrl}, alt = {props.user.name} {/* 재사용성을 측면을 높이기 위해 보편적인 단어인 user를 사용 */} /> ); } // 2. UserInfoName Component 추출 function UserInfoName(props){ return( <div className = "user-info-name"> {props.user.name} </div> ); } // 3. UserInfo 추출하기 function UserInfo(props){ return( <div className = "user-info"> {/* 이미 추출한 Avatar Component도 적용 */} <Avatar user = {props.user} /> {/* 이미 추출한 UserInfoName Component도 적용 */} <UserInfoName user = {props.user}/> </div> ); } // 4. CommentText 추출하기 function CommentText(props){ return( <div className = "comment-text"> {props.text} </div> ); } // 5. CommentDate 추출하기 function CommentDate(props){ return( <div className = "comment-date"> {formatDate(props.date)} </div> ); } // 6. 추출한 Component들로 Comment 재합성 function Comment(props){ return( <div className = "comment"> <UserInfo user = {props.user}/> <CommentText text = {props.text}/> <CommentDate date = {props.date}/> </div> ); } 이 코드가 강의에서 작성해주신 코드를 제 나름대로 완성한 컴포넌트를 추출한 형태입니다. userData가 아래의 형태라고 가정하겠습니다. const commentData = { user: { avatarUrl: "https://example.com/avatar.jpg", // 아바타 이미지 URL name: "Soaple" // 사용자 이름 }, text: "안녕 리액트!", date: new Date() // 댓글 작성 날짜 }; 처음 Comment Component에 Props로는 CommentData 자체가 전달될 것이고, 그 다음 UserInfo의 props로는 props.user, 여기서는 아래의 commentData.user가 전달이 되는 것까지는 논리적 흐름대로 이해를 했습니다. // UserInfo가 받은 props(commentData.user) user: { avatarUrl: "https://example.com/avatar.jpg", name: "Soaple" } 그런데 Avatar의 props로는 props.user가 전달되어야 하는데 그렇게 되면 Avatar에 전달하는 props가 commentData.user.user가 되어 전달할 수 없지 않나요? UserInfoName도 commentData.user.user 가 되어 이상하다는 생각이 드는데... chatGPT나 뤼튼과 AI에 물어봐도 이상이 없는 정상 코드라는 답변을 받았습니다. React에서 props가 굉장히 중요하다고 강조하신 만큼 이 부분은 꼭 집고 넘어가야겠다는 생각이 듭니다. 답변 부탁드립니다!
영상을 3:29 이 부분을 똑같이 하려고하는데, http://localhost:3000/home 로 접속하면 파일이 없다고 합니다.. app 안에 (afterLogin) (beforeLogin)로 나뉘고, home 폴더를 만들어서 layout.tsx 와 page.tsx를 만들어 홈페이지와 홈 레이아웃을 작성하여 루트 레이아웃과 층계별 확인하려고 http://localhost:3000/ 를 들어가면 루트레이아웃은 잘나오는데 http://localhost:3000/home 는 페이지가 없다고 나옵니다.. (afterLogin) 안이 아니라 밖으로 app/home/layout.tsx 와 page.tsx가 있어야만 http://localhost:3000/home 가 잘나오는데 왜이럴까요?
failed to retrieve generated types: {"message":"Your account does not have the necessary privileges to access this endpoint. For more details, refer to our documentation https://supabase.com/docs/guides/platform/access-control "} generate-types씨 발생하는 에러 해결방법이 궁금합니다.
채팅을 계속 올려서 몇개월 치를 사용자가 본다면 위로 채팅 기록이 엄청 쌓일텐데, 실무에서 메모리가 넘치는걸 방지하는 방법으로 사용하시는게 있는지 어떤걸 사용하시는지 궁금합니다. 찾아보니 react-window 같은 라이브러리를 사용해서 실제 랜더링 하는 요소 갯수를 제한하고 스크롤을 유지 시켜서 성능 향상을 하는 글을 봤습니다. 실제로 실무에서 이런 방법을 주로 쓰는지 궁금합니다.
현재 문제 자동적으로 여러개의 선택상자를 입력하고 어떤것이 체크되었는지 확인하여 리턴할 것을 정해야하는 함수를 구현하려 합니다. 1번, 3번이 선택 되었다면 1, 3을 리턴하는 방식을 구현하려 했습니다. 제가 질문드린 내용을 구현하려면 [HwpAutomation.hwp 내부 사진] 다음사진에서 IHwpObject - IXHwpDocuments - IXHwpFormCheckButtons의 IXHwpFormCheckButton:양식 개체 체크 버튼 오브젝트에서 caption값을 수정하는 방법 value 값을 리턴하는 것 여기에서 사실 XHwpDocuments.XHwpFormCheckButtons를 해야한다고 생각했는데 안되는거 같아서 혹여 이 부분을 참고하여서 개발을 하려면 어떻게 이해를 해야할까요 ㅠㅠ
섹션2의 Grid Search 예제에서 학습/테스트 데이터 분리시 train_test_split()함수에서 stratify옵션없이 사용되었는데요, 계층 분할을 위해 stratify=iris _data.targe t 옵션을 넣어야 하는거 아닌가요? stratify옵션 넣고 테스트해보니 학습데이터 score는 강의동영상의 점수보다 낮았는데, test data에 대한 스코어는 강의 동영상과 동일하게 나왔습니다.
[리뉴얼] 파이썬입문과 크롤링기초 부트캠프 [파이썬, 웹, 데이터 이해 기본까지] (업데이트)
안녕하세요. 패턴으로 실습하며 익히기: 네이버 Open API로 클롤링하기 강의를 듣고 있습니다. 강의들 듣다 보면 JSON을 '데이터 포맷'이라고 부릅니다. Q1 그런데 이 데이터 포맷이 파이썬 에서 나왔던 변수를 표현하는 데이터 구조인 딕셔너리, 튜플과 비교하면 어떻게 정리할 수 있을까요? 인터넷에 찾아보고 다음과 같이 정리했는데, 코멘트 해주시면 감사하겠습니다. 딕셔너리는 파이썬에서 일반적인 데이터 구조의 한 종류입니다. JSON은 자바스크립트에서 데이터 교환의 상황에서 쓰이는 데이터 포맷입니다. 데이터 구조와 데이터 포맷의 공통점은 둘다 문자열로 표기된다는점입니다. 차이점은 데이터 포맷은 포맷 즉 껍데기 이기에 딕셔너리 이외 형태로 불러올 수 있습니다. 이에 반해 데이터 구조는 다른 데이터 형태로 불러올 수 없습니다.
[리뉴얼] 파이썬입문과 크롤링기초 부트캠프 [파이썬, 웹, 데이터 이해 기본까지] (업데이트)
안녕하세요. 패턴으로 실습하며 익히기: 네이버 OpenAPI로 크롤링하기 강의배우고 있습니다. 본 강의에서는 header_params 의 키와 값으로 {'X-Naver-Client-Id':client_id, 'X-Naver-Client-Secret':client_secret} 를 쓰시더라구요. 그런데 이게 계속 오류가 나서 GPT에 오류를 점검해달라고 했더니 id대신 key를 쓰라 말했습니다. 실제 써보았더니 그제서야 크롤링이 되더라구요. 왜 그런까요?
안녕하세요 아직은 강의를 초반까지만 듣고서 갑자기 생각이 나서 질문드립니다. 강의는 윈도우기반으로 해서 설명해주시고 있는데요.. 파이썬으로 웹사이트를 만들어서 웹호스팅에 올릴려고 하는데요.. 윈도우기반으로 웹호스팅으로 해서 올려야 하나요 ? 혹시, 리눅스 기반으로 해서 하는 방법은 없는것인지 궁금합니다. 강의 초반까지 듣고서 질문드린거라서 뒷쪽에 해답이 있을수도 있겠지만.. 궁금해서 올립니다
Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
api/(site)/page.tsx 에 actions/todo/todo.actions.ts를 사용하고 하위컴포넌트들에서는 ex) api/(site)/compoents/...container.ts 내부에서는 hook을 임포트한것들이 apis/todo-no-rls.ts를 사용하면 될까요? *위 예시는 강의에서 다룬 파일만을 예를 들었보았습니다.
동일한 폴더 내에 있는 파일 중 style.scss만 css로 컴파일 하고 싶습니다 하단의 Watch Sass 클릭하여 컴파일 진행시 style.scss 뿐 아니라 common.scss도 동시에 css로 컴파일 되어 방법을 찾다 문의 남깁니다 하나의 파일만 컴파일 가능한지 궁금합니다
ec2 터미널에서 node를 14버전으로 설치 후에 강의대로 따라가는 중인데요 git clone해와서 yarn install시에 node의 버전이 맞지 않아서 설치가 안되고 있습니다 ec2의 node 버전을 업그레이드하면 /lib64/libm.so.6: version GLIBC_2.27 not found(required by node) 가 뜨면서 ec2의 버전이 맞지 않는거같고 14버전으로 진행하면 설치한 프로젝트의 버전이 달라서 안되는데 class_build의 버전은 이런데 react의 버전을 바꿔야 해결되는걸까요? "dependencies": { "react": "^18", "react-dom": "^18", "next": "14.2.5" }
앞 강의인 바둑이 승차 영상을 보며 떠올렸습니다. n,m = map(int,input().split()) data = [list(map(int,input().split())) for _ in range(n)] rst = 0 tot = sum(a for a,b in data) def dfs(num,s,t,tsum): global rst if tot - tsum + s < rst: return if t > m: return if n == num: rst = max(rst,s) else: dfs(num + 1,s + data[num][0],t+data[num][1],tsum+data[num][0]) dfs(num + 1, s, t, tsum + data[num][0]) dfs(0,0,0,0) print(rst)