async로 선언된 함수의 반환형은 promise아닌가요? console.log(res)가 문자열 hello async를 출력하는 이유를 모르겠습니다.

redux toolkit을 이용해서 코딩을 하고 있고 credentials까지 강의 나와있는대로 다 작성을 한 상태입니다post action creator는 이렇게 작성하였고export const addPost = createAsyncThunk( "/post", async (data, { fulfillWithValue, rejectWithValue }) => { try { console.log(data); const response = await axios.post("/post", data); console.log(response.data); return fulfillWithValue(response.data); } catch (error) { throw rejectWithValue(error.response); } } );에러메시지는 POST http://localhost:3065/post 500 (Internal Server Error)redux dev tools에 rejected 요청으로 온 여러 정보가 있는데 그중에 뭐가 필요한 정보인지 몰라서 제로초님이 필요하신 정보를 얘기해주시면 추가적으로 추가 하겠습니다status(pin):500statusText(pin):"Internal Server Error"일단 이 두개가 상태 메시지입니다

상품 업로드에 관한 이슈과정을 다 마치고, fly.io와 vercel.com을 통하여 배포한 페이지 중에서 상품 업로드가 제대로 이뤄지지 않습니다.github 주소 : https://github.com/arominddo/Inflearn_full_stack_boot_campvercel을 통해 배포된 web 어플리케이션 url :https://grab-market-client-ashen.vercel.app/ grab_market_web > src > upload > index.js에 코드 내용이 작성되어 있습니다.  배포된 페이지의 DB 초기화 문제프로젝트를 전부 마치면서, 다시 한번 fly.io에 최신 코드로 재배포를 해보고 실험을 해보았는데도, web에서 특정 상품을 업로드하거나(오류가 나지 않았을 당시), 상품 구매하기 기능을 통하여 soldout 값을 1로 바꿔줬음에도,약 5분이 지나면 DB가 배포 됐을 당시의 내용으로 계속 초기화가 됩니다.해결 방안이 궁금합니다.ex) A라는 물건 업로드 -> 5분 지남 -> 새로고침 해보면 A라는 물건이 리스트에서 삭제ex) B라는 물건 구매 하기 버튼 클릭 -> soldout 값 1로 변경 -> 약 5분 지남 -> 다시 soldout 값 0으로 복귀

Button(props) 에서 props로 받은 title이 버튼 목록에 표시하고props로 받은 onClick은 <StyleButton>에 onClick에 넣어 주므로써 <질문> onClick이벤트를 상위 컴포넌트에서 받을수 있도록 해 주었다고 설명하셨는데~질문입니다? onClick={onClick} 이벤트를 상위 컴포넌트에서 받을수 있도록 해 주었다라고위에서 설명 하셨는데, 이해가 잘 안되어서 질문합니다onClickItem(post)도 같은 맥락인것 같은데 이해가 안됩니다

MDN의 가이드에 따라 DragNDrop 코드를 작성하는데파일을 가져오기 위한 코드인 event.dataTransfer.items 에서 아래와 같은 오류가 발생햇습니다.'DataTransferItemList' 형식은 배열 형식이 아닙니다.ts(2461)MDN DataTransfer: items 속성 가이드에서는 목록을 반환하고 항목이없어도 빈목록을 반환한다고 되어있고MDN DataTransferItemList 타입 가이드에서 객체라고 명시되어 있던데 개별항목에는 [ ]표기법으로 접근할수 있다는걸로 보아 event.dataTransfer.items의 타입은 리스트가 아닌 오브젝트에 숫자를 KEY로 값을 넣어놓은 형태인가요?? 아님 또다른 타입인건가요?코드 function dropHandler(ev: React.DragEvent<HTMLDivElement>): void { console.log('File(s) dropped'); // Prevent default behavior (Prevent file from being opened) ev.preventDefault(); if (ev.dataTransfer.items) { // Use DataTransferItemList interface to access the file(s) [...ev.dataTransfer.items].forEach((item, i) => { // If dropped items aren't files, reject them if (item.kind === 'file') { const file = item.getAsFile(); if (file) { console.log(`… file[${i}].name = ${file.name}`); } } }); } else { // Use DataTransfer interface to access the file(s) const files = ev.dataTransfer.files; [...files].forEach((file, i) => { console.log(`… file[${i}].name = ${file.name}`); }); } }MDN DragNDrop가이드https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API/File_drag_and_dropMDN DataTransfer: items 속성 가이드https://developer.mozilla.org/ko/docs/Web/API/DataTransfer/itemsMDN DataTransferItemList 타입 가이드https://developer.mozilla.org/en-US/docs/Web/API/DataTransferItemList

안녕하세요. 윈도우 환경에서 수업을 듣고 있습니다.routes.tsx에서 \문제가 발생하여 이전에 답변해주신 내용을 토대로 vite-plugin-next-react-router를 지우고 강의를 따라가려고 했는데,아래의 코드에서 다음과 같은 에러가 발생합니다const DynamicIndex = lazy(() => import('./pages/index')); '''''Promise<typeof import("c:/Users/zcvpa/OneDrive/\uBC14\uD0D5 \uD654\uBA74/shoplive/shopping-mall/src/pages/index")>' 형식은 'Promise<{ default: ComponentType<any>; }>' 형식에 할당할 수 없습니다.'typeof import("c:/Users/zcvpa/OneDrive/\uBC14\uD0D5 \uD654\uBA74/shoplive/shopping-mall/src/pages/index")' 형식은 '{ default: ComponentType<any>; }' 형식에 할당할 수 없습니다.'default' 속성의 형식이 호환되지 않습니다.'() => void' 형식은 'ComponentType<any>' 형식에 할당할 수 없습니다.'() => void' 형식은 'FunctionComponent<any>' 형식에 할당할 수 없습니다.'void' 형식은 'ReactElement<any, any> | null' 형식에 할당할 수 없습니다.ts(2322)index.d.ts(868, 18): 필요한 형식은 이 시그니처의 반환 형식에서 가져옵니다.'''' 해당 에러를 해결할 수 있는 방법이 있을까요?

자유게시판 대댓글 등록 & 조회 기능 구현을하는데 playground에서 회원정보 인증에서 오류가 발생합니다.피그마 상에서도 일반회원에 대한 내용만 있고 비회원일 경우없는 것을 보면 대댓글 기능 자체가 로그인이 되어있을 경우를 상정한건가요?일단 docs에는 유저토큰 정보를 요구하지는 않는데... 회원정보가 필요한가요? 대댓글 자유게시판에서 대댓글기능 작동하는 건가요...?

2-9강 따라하는도중에 에러가 났는데요.에러가 난 이유는 제 코드에는 output란에 publicPath가 없어서인것 같은데, 정확한 이유를 모르겠습니다.제로초님코드에는 output에 publicPath가 자동으로 생성되어있고, devServer란에 그대로 따라치라 하셨는데 저는 애초에 publicPath가 없어서요. 그런데 궁금한건 2-8강 제로초님코드를 보니 저처럼 output에 publicPath가 없었는데, 2-9강에서 갑자기 생겨있더라고요.

만약 Page의 단위를 5로 잡아서 최초 랜더링한 페이지가 스크롤이 되지않는다면 onScroll 이벤트가 발생하지 않으니 setSize 이벤트도 발생할수 없습니다.이렇게 최초 데이터의 개수가 모자라서 이벤트 자체가 발생하지 않으면 별개의 이벤트로 scroll이 가능할때까지 페이지를 불러와야 하는데 좋은 방법이 잇는가요?페이지를 5개로 잡을떄페이지를 20개로 잡을떄참조 코드import ChatBox from '@components/ChatBox'; import ChatList from '@components/ChatList'; import useInput from '@hooks/useInput'; import { Header, Container } from '@pages/DirectMessage/styles'; import fetcher from '@utils/fetcher'; import makeSection from '@utils/makeSection'; import axios from 'axios'; import gravatar from 'gravatar'; import React, { FC, FormEventHandler, useCallback, useEffect, useRef, useState } from 'react'; import Scrollbars from 'react-custom-scrollbars-2'; import { useParams } from 'react-router'; import useSWR from 'swr'; import useSWRInfinite from 'swr/infinite'; const PAGE_SIZE = 5; const DirectMessage: FC = () => { const { workspace, id } = useParams(); const { data: myData } = useSWR<IUser, false>('/api/users', fetcher); const { data: userData } = useSWR<IUser, false>(`/api/workspaces/${workspace}/users/${id}`, fetcher); const [chat, onChangeChat, setChat] = useInput(''); // const scrollbarRef = useRef(null); const { data: chatData, mutate: mutateChat, setSize, } = useSWRInfinite<IDM[]>( (index) => `/api/workspaces/${workspace}/dms/${id}/chats?perPage=${PAGE_SIZE}&page=${index + 1}`, fetcher, ); const isEmpty = chatData?.[0]?.length === 0; const isReachingEnd = isEmpty || (chatData && chatData[chatData.length - 1]?.length < PAGE_SIZE); const chatSection = makeSection(chatData ? [...chatData].flat().reverse() : []); const onSubmitForm = useCallback<FormEventHandler>( (event) => { event.preventDefault(); if (!chat || !chat?.trim()) { return; } axios .post(`/api/workspaces/${workspace}/dms/${id}/chats`, { content: chat, }) .then(() => { mutateChat(); setChat(''); }) .catch(console.error); console.log('제출'); }, [chat, id, mutateChat, setChat, workspace], ); const scrollbarRef = useRef<Scrollbars>(null); return !userData || !myData || !chatData ? null : ( <Container> <Header> <img src={gravatar.url(userData.email, { s: '24px', d: 'retro' })} alt={userData.nickname} /> <span>{userData.nickname}</span> </Header> <ChatList chatSections={chatSection} isEmpty={isEmpty} isReachingEnd={isReachingEnd} setSize={setSize} ref={scrollbarRef} /> <ChatBox onSubmitForm={onSubmitForm} chat={chat} onChangeChat={onChangeChat} placeholder={`Message ${userData.nickname}`} otherData={[userData]} /> </Container> ); }; export default DirectMessage;import Chat from '@components/Chat'; import { ChatZone, Section, StickyHeader } from '@components/ChatList/styles'; import React, { FC, MutableRefObject, forwardRef, useCallback } from 'react'; import { Scrollbars, positionValues } from 'react-custom-scrollbars-2'; interface Props { chatSections: { [key: string]: (IDM | IChat)[] }; isEmpty: boolean; isReachingEnd?: boolean; setSize: (f: (size: number) => number) => Promise<(IDM | IChat)[][] | undefined>; } const ChatList = forwardRef<Scrollbars, Props>(({ chatSections, isReachingEnd, isEmpty, setSize }, scrollRef) => { const onScroll = useCallback( (values: positionValues) => { if (values.scrollTop === 0 && !isReachingEnd) { setSize((size) => size + 1).then(() => { const current = (scrollRef as MutableRefObject<Scrollbars>)?.current; if (current) { current.scrollTop(current.getScrollHeight() - values.scrollHeight); } }); } }, [isReachingEnd, scrollRef, setSize], ); return ( <ChatZone> <Scrollbars autoHide ref={scrollRef} onScrollFrame={onScroll}> {Object.entries(chatSections).map(([dateData, chatData]) => ( <Section className={`section-${dateData}`} key={dateData}> <StickyHeader> <button>{dateData}</button> </StickyHeader> {chatData.map((chat) => ( <Chat key={chat.id} data={chat} /> ))} </Section> ))} </Scrollbars> </ChatZone> ); }); export default ChatList; 

원본값을 유지하기위해 concat을 사용하셧는데지금 같은 1차원 배열일때는 문제가 없지만 2차원 배열일 경우 해당 배열이 다쪼개져서 1차원 배열이 되는걸로 알고있습니다 그래서 저는 원본을 유지할때 스프레드 문법을 사용하는데 concat이 더 좋은경우도 있나요?두가지 방법을 다 알려주시긴 하셧는데 차이점이 잇는가 궁금합니다.예시상황const chatData = [[1, 2], [3, 4], [5, 6]];[].concat(...chatData).reverse() => [6, 5, 4, 3, 2, 1][...chatData].reverse()=> [[5, 6], [3, 4], [1, 2]]

제로초님 그대로 따라했고,성공적으로 빌드 되었단 메시지도 받았습니다만, WordRelay.htmld을 실행하면, 이런 메시지가 뜨면서 연결이 안되어, 구글링을 통해, 해결방법을 다 따라해봤습니다. 네트워크 옆에 화살표 제한없음으로 변경해보는 방법은 효과가 없었고, launch.json파일을 수정하면 된다는 글을 보고 따라해봤으나, 아까 나왔던 빨간 메시지와함께 이런 화면이 뜹니다... 어떻게 해야될까요 문제는 이게 세번째하는겁니다. lecture1에서 lecture3까지 완전 처음부터 다시 해봤으나 계속 똑같은 문제가 발생합니다. 이런걸로 리액트공부를 포기하고싶진 않은데, 아무리 해봐도 안되니 너무 답답하네요...

기존 윈도우 스크롤바의 경우 스크롤바가 width를 잡아먹어 의도햇던 디자인이 찌그러 지는경우가 있어서 고민이엿습니다.이번 강의에서 알려주신 react-custom-scrollbars 의경우 width를 잡아먹지 않고 내부에 생성되는걸로 확인되는데vw,vh를 100%로 잡은 최상위 레이아웃을 만들고 react-custom-scrollbars 를 추가한뒤 그 자식으로 기존 코드들을 옮기려 합니다.이때 문제가 될만한 이슈 또는 더 나은 방법이 잇을까요?

웹팩은 빌드가 된거같아요. 다만 제로초님처럼 plugin은 하지 않았어요. 오히려 그걸 쓰면 에러가 나더라고요. 그리고 이제 크롬을 열었는데, 처음에는 페이지는 뜨는데 'Hello, webpack'이 안떴고, 이후에 다시 크롬에 연결해보니 아래와같은 화면이 뜨네요. 처음부터 다시해야하는걸까요?

setProducts(products);가 products라는 state를 변경하는 거잖아요.그런데 products는 바로 위 line에서 const로 정의되었는데 setProducts(products); 의 의미가 const 정의된 products라는 변수로 state를 변경한다는 의미인가요? 만약 state가 products가 아닌 다른 것이었다면 어떻게 되는 건가요? 정확히 어떤 과정인지 이해되지 않습니다.

useEffect를 setProducts(products);앞에 쓰는 것은 왜 에러인가요? 재실행하고 싶은 구간에만 써주면 되는 것이 아닌가요?

이번에 처음으로 앱 개발 공부를 해보려고 react native를 열심히 실행해 봤습니다.중간에 계속 에러가 나고 막히는 부분이 있었지만 겨우 마지막에 npm run android부분까지 왔습니다. 그런데 실행을 할려고 하면 계속C:\Users\aladi\MyApp\NewApp>npx react-native run-android info Starting JS server... info 💡 Tip: Make sure that you have set up your development environment correctly, by running react-native doctor. To read more about doctor command visit: https://github.com/react-native-community/cli/blob/main/packages/cli-doctor/README.md#doctor FAILURE: Build completed with 2 failures. 1: Task failed with an exception. ----------- * Where: Build file 'C:\Users\aladi\MyApp\NewApp\android\app\build.gradle' line: 2 * What went wrong: A problem occurred evaluating project ':app'. > Could not find implementation class 'com.facebook.react.ReactPlugin' for plugin 'com.facebook.react' specified in jar:file:/C:/Users/aladi/.gradle/caches/jars-9/e787d8a8f912d81d210d8e27e6fa5ed3/react-native-gradle-plugin.jar!/META-INF/gradle-plugins/com.facebook.react.properties. * Try: > Run with --stacktrace option to get the stack trace. > Run with --info or --debug option to get more log output. > Run with --scan to get full insights. ============================================================================== 2: Task failed with an exception. ----------- * What went wrong: A problem occurred configuring project ':app'. > compileSdkVersion is not specified. Please add it to build.gradle * Try: > Run with --stacktrace option to get the stack trace. > Run with --info or --debug option to get more log output. > Run with --scan to get full insights. ============================================================================== * Get more help at https://help.gradle.org BUILD FAILED in 12s error Failed to install the app. Command failed with exit code 1: gradlew.bat tasks FAILURE: Build completed with 2 failures. 1: Task failed with an exception. ----------- * Where: Build file 'C:\Users\aladi\MyApp\NewApp\android\app\build.gradle' line: 2 * What went wrong: A problem occurred evaluating project ':app'. > Could not find implementation class 'com.facebook.react.ReactPlugin' for plugin 'com.facebook.react' specified in jar:file:/C:/Users/aladi/.gradle/caches/jars-9/e787d8a8f912d81d210d8e27e6fa5ed3/react-native-gradle-plugin.jar!/META-INF/gradle-plugins/com.facebook.react.properties. * Try: > Run with --stacktrace option to get the stack trace. > Run with --info or --debug option to get more log output. > Run with --scan to get full insights. ============================================================================== 2: Task failed with an exception. ----------- * What went wrong: A problem occurred configuring project ':app'. > compileSdkVersion is not specified. Please add it to build.gradle * Try: > Run with --stacktrace option to get the stack trace. > Run with --info or --debug option to get more log output. > Run with --scan to get full insights. ============================================================================== * Get more help at https://help.gradle.org BUILD FAILED in 12s > Task :gradle-plugin:compileKotlin UP-TO-DATE > Task :gradle-plugin:compileJava NO-SOURCE > Task :gradle-plugin:pluginDescriptors UP-TO-DATE > Task :gradle-plugin:processResources UP-TO-DATE > Task :gradle-plugin:classes UP-TO-DATE > Task :gradle-plugin:jar UP-TO-DATE > Task :gradle-plugin:inspectClassesForKotlinIC UP-TO-DATE 5 actionable tasks: 5 up-to-date. 이런 에러가 뜨더라구요정말 이쪽부분은 하나도 모르는 코린이라 아무리 구글링해보고 혼자 머리 굴려봐도해결이 되지 않습니다.. 에뮬레이터까지는 뜨는데 react native화면은 뜨지 않고 저렇게 에러 메세지만 나옵니다. 어떻게 해야될까요.. 제발 도와주세요ㅜ

어떤 부분때문에 이런 오류가 나는 걸까요? 이미지 등록 버튼을 눌러서 파일 선택하면 이 오류 메세지가 뜹니다.

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 고양이 이미지 깨지는데, 어떻게 하면 될까요?

DiaryItem의 버튼에있는 onClick에서 사용되는 id는 props로 받아온 걸 사용하는건가요? 🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.

가비아 에서 도메인 결제 후 터미널 dig 부분에서 막혀서 질문 드립니다. 가비아  AWS 여기까지 잘 따라 왔는데 터미널에서 오류가 뜨네요 강의에서 2-3일 걸릴수도 있다했는데 현재 6시간 이상 지나도 안돼서 궁금함에 질문 남겨요.. 기다리면 될까요? 아님 잘못한 부분이 있을까요?