#20 리액트 라우터 돔
미해결
따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
라우터 돔 사이트에서 베이직이 안보이는데 어떤걸 복사하면되는건가요?
- react
- node.js
173만명의 커뮤니티!! 함께 토론해봐요.
미해결
따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
라우터 돔 사이트에서 베이직이 안보이는데 어떤걸 복사하면되는건가요?
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
인코딩을 할때 선생님이 어쩔때는 원핫인코딩을 하시고 어쩔때는 레이블인코딩을 하시던데 그 인코딩을 정하시는 기준을 잘 모르겠습니다! 인코딩을 정하실때 그 경우에 대해서 자세히 알려주시면 감사하겠습니다 그리고 인코딩을 할때 컬럼도 몇개 정하셔서 하시던데 그 컬럼고르는 기준도 잘 모르겠습니다 그 기준에 대해서도 선택하는 방법을 알려주시면 감사하겠습니다 ㅠㅠ
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
보통 작업형2에서는 예측값을 물어보는 문제가 나오던데요. 문제가 나올때 어느문제는 분류모델을, 어느문제는 회귀모델을 사용해야하는지 궁금합니다. 지금까지 강의+기출문제를 보면서는 분류/회귀를 결정하는 부분이 평가 모델을 통해 진행된다는 느낌을 받았는데요. 1) roc_auc_score, accuracy_score 이 평가모델로 쓰일 경우, 분류형 모델 사용(Classifier) 2) rmse, mean_squared_error 이 평가모델로 쓰일 경우, 회귀모델 사용(Regressor) 이렇게 생각하면서 작업형2를 접근하는게 맞는지 궁금합니다.
해결됨
손에 익는 Next.js - 공식 문서 훑어보기
SSR 방식에 서버 컴포넌트와 클라이언트 컴포넌트를 둘 다 적절히 사용하는 것인가요?? 서버 컴포넌트는 데이터 페칭, 보안, 캐싱, JS 번들크기 감소와 같은 장점이 있고 event와 hook을 사용하지 못한다는 특징도 이야기해주셨는데, 그렇다면 데이터를 받아서(페칭해서) 클라이언트 컴포넌트에 데이터를 뿌려주는 느낌으로 조합해서 사용하는 건가요?? 서버컴포넌트는 event를 사용하지 않으므로, TTI를 개선하기 위해 나온 개념은 아닌거죠???
미해결
Slack 클론 코딩[실시간 채팅 with React]
import Chat from '@components/Chat'; import { ChatZone, Section, StickyHeader } from '@components/ChatList/style'; import { IChat, IDM } from '@typings/db'; import React, { FC, RefObject, VFC, forwardRef, useCallback, useRef } from 'react'; import { Scrollbars } from 'react-custom-scrollbars'; interface Props { scrollRef: RefObject<Scrollbars>; chatSections: { [key: string]: IDM[] }; setSize: (f: (index: number) => number) => Promise<IDM[][] | undefined>; isEmpty: boolean; isReachingEnd: boolean; } const ChatList: VFC<Props> = (({ chatSections, setSize, isEmpty, scrollRef, isReachingEnd}) => { const onScroll = useCallback((values) => { // 끝에 도달하면 불러오지 않기 if(values.scrollTop === 0 && !isReachingEnd){ console.log('가장 위'); setSize((prevSize) => prevSize + 1).then(()=>{ // 스크롤 위치 유지 if(scrollRef?.current){ scrollRef.current?.scrollTop(scrollRef.current?.getScrollHeight() - values.scrollHeight); } }); } }, []); return ( <ChatZone> <Scrollbars autoHide ref={scrollRef} onScrollFrame={onScroll}> {Object.entries(chatSections).map(([date, chats]) => { return ( <Section className={`section-${date}`} key={date}> <StickyHeader> <button>{date}</button> </StickyHeader> {chats.map((chat) => ( <Chat key={chat.id} data={chat} /> ))} </Section> ); })} </Scrollbars> </ChatZone> ); }); export default ChatList; 이쪽 코드는 문제가 없는것같은데 희한하게 위치가 유지가 되지않고 원래처럼 쭉 올라가버립니다.. ref쪽이 문제인가요..? 혹시몰라 DirectMessage 컴포넌트도 아래에 첨부하겠습니다. import React, { useCallback, useEffect, useRef } from 'react'; import gravator from 'gravatar'; import useSWR, { mutate } from 'swr'; // swr 인피니티스크롤링 전용 메서드 import useSWRInfinite from 'swr/infinite'; import { IDM, IUser } from '@typings/db'; import fetcher from '@utils/fetcher'; import { useParams } from 'react-router'; import ChatBox from '@components/ChatBox'; import { Container, Header } from '@pages/DirectMessage/style'; import ChatList from '@components/ChatList'; import useInput from '@hooks/useInput'; import axios from 'axios'; import makeSection from '@utils/makeSection'; import Scrollbars from 'react-custom-scrollbars'; const DirectMessage = () => { const { workspace, id } = useParams<{ workspace: string; id: string }>(); const { data: userData } = useSWR(`http://localhost:3095/api/workspaces/${workspace}/users/${id}`, fetcher); // 내정보 const { data: myData } = useSWR(`http://localhost:3095/api/users`, fetcher); const [chat, onChangeChat, setChat] = useInput(''); // 과거 채팅리스트에서 채팅을 치면 최신목록으로 바로 스크롤을 내려줄려면 ref를 // 이 컴포넌트에서 props로 내려줘야하기 때문에 forwardRef를 사용해서 props로 넘겨준다 // 💡 HTML 엘리먼트가 아닌 React 컴포넌트에서 ref prop을 사용하려면 React에서 제공하는 forwardRef()라는 함수를 사용해야 합니다 const scrollbarRef = useRef<Scrollbars>(null); // 채팅 받아오는곳 (setSize : 페이지수를 바꿔줌) // useSWRInfinite를 쓰면 [{id:1},{id:2},{id:3},{id:4}] 1차원배열이 [[{id:1},{id:2}],[{id:3},{id:4}]] 2차원배열이 된다. const { data: chatData, mutate: mutateChat, setSize, } = useSWRInfinite<IDM[]>( (index) => `http://localhost:3095/api/workspaces/${workspace}/dms/${id}/chats?perPage=20&page=${index + 1}`, fetcher, ); // 데이터 40 개중에 20개씩 사져오면 첫번째페이지부터 20 + 20 + 0 세번째 페이지 0 이되면 isEmpty, isReachingEnd는 true가 됨 // 반대의 상황에서 데이터가 45개면 20 + 20 + 5 isEmpty는 0이 아니라서 false isReachingEnd는 여전히 데이터 가져옴 const isEmpty = chatData?.[0]?.length === 0; const isReachingEnd = isEmpty || (chatData && chatData[chatData.length - 1]?.length < 20) || false; const onSubmitForm = useCallback( (e) => { e.preventDefault(); if (chat?.trim() && chatData) { const savedChat = chat; // 💡 옵티미스틱 UI // 서버쪽에 다녀오지 않아도 성공해서 데이터가 있는거처럼 보이게 미리 만듦 mutateChat((prevChatData) => { // infinite 스크롤링은 2차원 배열이다. prevChatData?.[0].unshift({ // unshift : 앞쪽에 추가 id: (chatData[0][0]?.id || 0) + 1, content: savedChat, SenderId: myData.id, Sender: myData, ReceiverId: userData.id, Receiver: userData, createdAt : new Date(), }); return prevChatData; },false) // 옵티미스틱 UI 할땐 이부분이 항상 false .then(()=>{ setChat(''); // 버튼클릭 시 기존 채팅지우기 scrollbarRef.current?.scrollToBottom(); // 채팅 첬을때 맨 아래로 }) axios .post( `http://localhost:3095/api/workspaces/${workspace}/dms/${id}/chats`, { content: chat, }, { withCredentials: true, }, ) .then(() => { mutateChat(); // SWR에서 데이터를 다시 불러와서 캐시를 갱신하는 역할을 합니다. }) .catch(() => { console.error; }); } }, [chat, chatData, myData, userData, workspace, id], ); // (채팅이 최신것을 아래에 두기 위함) = 기존것 데이터를두고 새 데이터를 뒤집어서 출력 / flat() 배열을 1차원 배열로 만들어줌 const chatSections = makeSection(chatData ? [...chatData].flat().reverse() : []); // 로딩 시 스크롤바 제일 아래로 useEffect(()=>{ if(chatData?.length === 1){ // 채팅 데이터가 있어서 불러온 경우 scrollbarRef.current?.scrollToBottom(); // 가장 아래쪽으로 내려줌 } },[chatData]) // 로딩 if (!userData || !myData) { return null; } return ( <Container> <Header> <img src={gravator.url(userData.email, { s: '24px', d: 'retro' })} alt={userData.nickname}></img> <span>{userData.nickname}</span> </Header> {/* 컴포넌트 위치를 미리 지정해도 좋다. */} {/* 전역 상태관리 라이브러리를 사용해도 컴포넌트상황에따라 props 로 넘겨줌*/} <ChatList scrollRef={scrollbarRef} chatSections={chatSections} setSize={setSize} isEmpty={isEmpty} isReachingEnd={isReachingEnd} /> <ChatBox chat={chat} onChangeChat={onChangeChat} onSubmitForm={onSubmitForm} /> </Container> ); }; export default DirectMessage;
해결됨
[게임 프로그래머 도약반] DirectX11 입문
수업 내용과는 관련이 없을 수도 있을 것 같은데, 개인적으로 dx 포폴에 리플렉션을 구현해 보고 싶어서 궁금해서 찾아보다가 해결이 안 되어서 질문 남깁니다. 금속이나 물, 거울 등 반사되어 렌더링 하는 물체는 카메라의 높이나 각도에 따라 실시간으로 새로 그려지는데 이건 어떤 식으로 구현하나요? 1주차에 배운 samplerstate의 mirror를 활용하게 되는건지.. 제가 고민해 본 방법은 주변 환경을 실시간으로 캡처해서 캐시로 만들고 큐브맵으로 텍스처를 재가공해서 사용하면 될까 싶은데 어렴풋이 떠올리는 방법이랑 실제 구현의 갭은 너무 크네요 ㅜㅜ 리플렉션 종류가 많고 해서 너무 광범위한 질문일 거 같은데 디테일하게 질문할 실력이 안되어서 죄송합니다. 참고할만한 책이나 자료라도 추천해주시면 감사하겠습니다.
미해결
[C++과 언리얼로 만드는 MMORPG 게임 개발 시리즈] Part2: 게임 수학과 DirectX12
VS_PointLight 의 VS_OUT에 있는 pos가 SV_Position으로 되어있으니, PS_PointLight에서의 input.pos 범위는 -1~1이 되어야하지 않나요? 그래서 왜 Resolution으로 나눠주는건가 하고 디버그 해보니 0~ 1920 범위로 나오더라구요... 왜그런가요
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! 질문과 관련된 영상 위치를 알려주면 더 빠르게 답변할 수 있어요 먼저 유사한 질문이 있었는지 검색해보세요 안녕하세요 선생님, 질문은 3가지 입니다. 1) 저는 문제를 딱 접했을때 분류모형을 써야할지, 예측모형을 써야할지 판가름을 정확하게 못하는 것 같습니다. 쉽게 판별하는 방법이 있을까요? 2) 이 문제의 경우 target인 output 컬럼을 train.head() 로 보면 0과 1로 구분되어있어서, 0 또는 1로 분류하는(분류모형) 것인가 생각했다가도 문제 맨위에서 참조해주는 예시에서 id,output 41,0.633 28,0.123 222,0.355 를 보면 output이 확률값으로 되어있어서 회귀모형을 사용해야하는 것인가? 라고 헷갈리곤합니다. 어디서 개념을 잡지 못하는 것일까요 3) 최종 예측을 할때 pd.DataFrame({'id':test_id, 'output':pred_proba[:,1]}).to_csv("00000.csv", index=False) output에 pred_proba 를 쓰셨는데 참조예시에서 확률값을 OUTPUT에 담았기 때문에 pred_proba를 사용한 것일까요? 그렇다면 output에 pred 를 담는 경우는 어떤 경우인지요?
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! 질문과 관련된 영상 위치를 알려주면 더 빠르게 답변할 수 있어요 먼저 유사한 질문이 있었는지 검색해보세요 df = df.T df.head() mean_2001 = df[2001].mean() mean_2003 = df[2003].mean() a = sum(df[2001] > mean_2001) b = sum(df[2003] < mean_2003) print(a+b) 이렇게 작성하면 결과가 다르게 나오는데,, 어디서 잘못된 것일까요?
해결됨
React + GPT API로 AI회고록 서비스 개발 (원데이 클래스)
GPT API 호출, 프롬프트 연동 강의 0:24 계속해서 useState에 다음과 같은 오류가 뜹니다. import { useState } from "react"; 오류 사유는'useState' is declared but its value is never read. 대체 왜 해결이 안되는 것일까요..?ㅜ.ㅜ
해결됨
[게임 프로그래머 도약반] DirectX11 입문
자기 자신을 기준으로 하는 행렬에서 루트를 기준으로 하는 행렬로 변환하기 위해서는 "루트까지 부모의 월드를 곱한다" 라고 말씀해주셨는데, "부모의 월드"라는게 잘 이해가 가지 않습니다. 월드 행렬이 왜 개입하는건가요 ? 루트까지 부모의 SRT를 곱한다가 맞는 것 아닌가요 ?? 만약 루트까지 부모의 월드 행렬을 곱한다면 그냥 자기 자신의 월드 행렬이 나오지 않나요 ? 이해가 잘 가지 않아 질문드립니다.
미해결
[C++과 언리얼로 만드는 MMORPG 게임 개발 시리즈] Part2: 게임 수학과 DirectX12
항상 좋은 수업 감사드립니다. 다름이 아니라 드래곤 모델 뿐만 아니라 다른 모델도 로드해보았더니 텍스처가 잘 입혀지는 부분이 있고 잘 입혀지지 않은(일그러지는 현상) 부분도 있는데 왜 이런 현상이 발생하는 것일까요? 제 프로젝트도 그렇고 수업자료 예시도 그렇고 똑같이 텍스처가 일그러지게 그려지네요 그리고 다른 모델을 로드할 때 텍스처 이름을 바꾸거나 FBXLoader에서 텍스처들의 이름을 받아올때 이름을 가져올 수 없거나 이상한 이름이 로드되는 경우가 있던데 이러한 상황에서는 어떻게 해결할 수 있을지 궁금합니다. 위 사진에서 오른쪽 상단과 같이 일그러지게 렌더링이 됩니다.
미해결
실습으로 끝장내는 웹 크롤링과 웹 페이지 자동화 & 실전 활용
driver = webdriver.Chrome () 여기서 계속 오류가 나는데요. 혹시 최근에 바뀐게 있나요? 강의 내용 외 개인적인 실습 사이트의 질문은 답변이 제공되지 않습니다. 문제가 생긴 코드, 에러 메세지 등을 꼭 같이 올려주셔야 빠른 답변이 가능합니다. 코드를 이미지로 올려주시면 실행이 불가능하기 때문에 답변이 어렵습니다. 답변은 바로 제공되지 않을 수 있습니다. 실력 향상을 위해서는 직접 고민하고 검색해가며 해결하는 게 가장 좋습니다.
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! 질문과 관련된 영상 위치를 알려주면 더 빠르게 답변할 수 있어요 먼저 유사한 질문이 있었는지 검색해보세요 무게에서 - 120을 뺀 이유가 무엇인가요?
미해결
[리뉴얼] 처음하는 파이썬 데이터 분석 (쉽게! 전처리, pandas, 시각화 전과정 익히기) [데이터분석/과학 Part1]
위 코드를 실행하니 'could not convert string to float: 'Abbeville' 라는 에러가 전시됩니다. Abbeville를 float으로 바꿀 수가 있나요?
해결됨
[게임 프로그래머 도약반] DirectX11 입문
퀴즈의 내용은 LeftFoot의 월드 행렬은 어떻게 구하는가 ? 입니다. 해당 퀴즈를 보고, 왜 인지는 모르겠지만 갑자기 햇갈리는 부분이 생겨서 질문 드립니다. 만약 계층 구조가 Root | +-- Parent | +-- Child 이런식으로 되어있다고 가정했을 때, child의 월드 행렬을 구하고 싶다면 child_L X parent_W 이렇게 해도 되고, child_L X parent_L X root_L 이렇게 해도 되는건가요? 만약 저렇게해서 된다면 child_L X parent_W X root_W 를 하면 child는 parent와 root의 하위 객체라는 뜻이니까 이렇게 해도 child의 월드 행렬이 나오나요 ?
해결됨
React + GPT API로 AI회고록 서비스 개발 (원데이 클래스)
setUserInput("")을 하면 userInput 값이 ""로 바뀌고 그다움 num 선언문에 ""의 숫자변환값이 들어가는게 아닌가 궁금합니다.
미해결
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
33-05 강의에서 test에서 자꾸 이 오류가 뜹니다 apis.js import { graphql } from "msw"; const gql = graphql.link("http://mock.com/graphql") export const apis = [ gql.mutation("createBoard", (req, res, ctx) => { const { writer, title, contents } = req.variables.createBoardInput return res( ctx.data({ createBoard: { _id: "qqq", writer, title, contents, __typepname: "Board", }, }) ); }), // gql.query("fetchBoards", () => {}) ]; jest.setup.js import { server } from "./src/commons/mocks/index" beforeAll(() => server.listen()); afterAll(() => server.close()); index.test.tsx import { fireEvent, render, screen, waitFor } from "@testing-library/react"; import StaticRoutingMovedPage from "../../pages/section33/33-05-jest-unit-test-mocking"; import { ApolloClient, ApolloProvider, HttpLink, InMemoryCache, } from "@apollo/client"; import fetch from "cross-fetch"; import mockRouter from "next-router-mock"; jest.mock("next/router", () => require("next-router-mock")); it("게시글이 잘 등록되는지 테스트 하자!", async () => { const client = new ApolloClient({ link: new HttpLink({ uri: "http://mock.com/graphql", fetch, }), cache: new InMemoryCache(), }); render( <ApolloProvider client={client}> <StaticRoutingMovedPage /> </ApolloProvider> ); fireEvent.change(screen.getByRole("input-writer"), { target: { value: "맹구" }, }); fireEvent.change(screen.getByRole("input-title"), { target: { value: "안녕하세요" }, }); fireEvent.change(screen.getByRole("input-contents"), { target: { value: "방가방가" }, }); fireEvent.click(screen.getByRole("submit-button")); await waitFor(() => { expect(mockRouter.asPath).toEqual("/boards/qqq"); }); }); 도와주십쇼 ㅠㅠ
미해결
[개정판] 파이썬 머신러닝 완벽 가이드
강의 회귀 실습 1: 자전거 대여(공유) 수요 예측 -02에서 19분 52초 경에 나오는 선형 회귀의 피처별 회귀계수 시각화 부분에서 저 회귀계수 값들이 다르게 나올 수가 있는지, 질문드립니다. github의 주피터노트북 코드 다운로드 받아서 그대로 시행했는데 LinearRegression/Lasso/Ridge 각 회귀에 대한 RMSLE, RMSE, MAE까지는 값이 정확히 동일하게 나오는데 회귀 계수의 값을 보려고 lr_reg.coef_ 부분에서 결과가 다르게 나옵니다. 상식적으로 회귀 모형에서 이런 결과가 나올 수가 없다고 생각되는데 무슨 이유인지 모르겠어서 질문드립니다! 감사합니다
미해결
따라하며 배우는 리액트 네이티브 기초
<SafeAreaView> 써도 이러네요.. 환경은 윈도우, 안드로이드 스튜디오 pixel4 썼습니다