172만명의 커뮤니티!! 함께 토론해봐요.
해결됨
Windows 소켓 프로그래밍 입문에서 고성능 서버까지!
안녕하세요 선생님^^ 강의를 보면서 Wireshark 분석도 따라해보고 있는데요, 제가 루프백 환경에서 진행을 하고 있어서 그런지 뭔가 뒤죽박죽 같더라구요 특히 14번 패킷은 아무데서도 Ack=5가 안나왔는데 Seq=5를 보내니까 저로서는 도저히 뭐가 뭔지 모르겠어서.. ㅠㅠ;; 어디서부터 실마리를 잡아야 할까요..? 분석 관련해서 조언을 얻고 싶습니다!!
해결됨
[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
안녕하세요. 현재 프로젝트 시작했는데 백엔드 배정받아 급하게 강의 결제후 듣고 있습니다. 인스타그램 같은 어플을 만들 예정인데, 저는 채팅쪽 파트를 맡게 되었습니다. 리액트, node.js mongodb, mongoose를 사용하기로 했으며 제가 구현해야 하는 기능은 이렇습니다. 아이디를 검색했을 때 나오는 유저와 채팅하기 버튼을 누르면, 그 유저와 1대1 채팅이 가능하도록 해야합니다. 그리고 채팅 후 방을 둘 다 나가기 하지 않는 이상 채팅방은 계속 유지되어 계속 채팅을 이어나갈 수 있어야 합니다. 스키마작성부터 CRUD 코드 작성, 서비스코드 작성, 라우터 코드 작성까지,, 손도 못대겠네요 ㅎㅎ 아무리 머리를 쥐어 짜내봐도, 어떻게 구현해야할지 감조차 안잡혀서 유튜브 검색해보면 외국인 강좌들 밖에 안나와서,, 어떻게 해야할까요ㅎㅎ figma는 위와 같습니다. 프론트만 해보다 보니 뭘 어떻게 해야할지 모르겠어요,,,ㅠㅠ
미해결
Slack 클론 코딩[실시간 채팅 with React]
안녕하세요 제로초님 mutate(0)으로 했는데도 콘솔찍어보니까 다시 1로 변합니다 channel부분만 이러네요
미해결
[리뉴얼] 처음하는 파이썬 백엔드와 웹기술 입문 (파이썬 중급, flask[플라스크] 로 이해하는 백엔드 및 웹기술 기본) [풀스택 Part1-1]
위에 코드와 같이 웹서버를 열 때 처음 실행만 정상적으로 뜨고 두 번째부터는 로드중으로 계속 화면에 아무것도 안 뜹니다. 주피터 노트북과 아나콘다 프로그램을 완전히 종료하고 다시 접속해 위에 코드를 입력하면 다시 처음만 정상실행되고 두번째부터는 무한로드중으로 뜹니다. 다른 컴퓨터로 실행해봤을 때는 정상적으로 화면에 출력되는 것을 확인했고 제 노트북만 이러네요. 이거 때문에 아나콘다도 다시 설치해보고 윈도우에 내장되어 로컬호스트 주소도 확인하고 윈도우도 재설치해보고 컴퓨터 자체를 포맷해봤는데도 계속 같은 증상이네요. 혹시 문제가 무엇일까요? 이거 때문에 수업 진도를 못 나가고 있어요. 도와주세요ㅠㅠ
해결됨
Slack 클론 코딩[실시간 채팅 with React]
npm i typescript 작성 시 아래와 같은 오류가 뜹니다. 종속성 해결 과정에서 충돌이 발생한 것으로 보이는데, 여기서 --force를 해서 설치를 하면 실행 될 것 같긴한데 그렇게 했을때는 결국 문제가 터졌던 경험들이 있어서 어떻게 하면 되는지 잘 모르겠습니다. /c/02WorkSpace/sleact/alecture (master) $ npm i typescript npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: react-custom-scrollbars@4.2.1npm ERR! Found: react@17.0.2 npm ERR! node_modules/react npm ERR! peer react@">=16.8.0" from @emotion/react@11.10.6 npm ERR! node_modules/@emotion/react npm ERR! peer @emotion/react@"^11.0.0-rc.0" from @emotion/styled@11.10.6 npm ERR! node_modules/@emotion/styled npm ERR! @emotion/styled@"^11.1.5" from the root project npm ERR! @emotion/react@"^11.1.5" from the root project npm ERR! peer react@">=16.8.0" from @emotion/styled@11.10.6 npm ERR! node_modules/@emotion/styled npm ERR! @emotion/styled@"^11.1.5" from the root project npm ERR! 10 more (@emotion/use-insertion-effect-with-fallbacks, ...) npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer react@"^0.14.0 || ^15.0.0 || ^16.0.0" from react-custom-scrollbars@4.2.1 npm ERR! node_modules/react-custom-scrollbars npm ERR! react-custom-scrollbars@"^4.2.1" from the root project npm ERR! npm ERR! Conflicting peer dependency: react@16.14.0 npm ERR! node_modules/react npm ERR! peer react@"^0.14.0 || ^15.0.0 || ^16.0.0" from react-custom-scrollbars@4.2.1 npm ERR! node_modules/react-custom-scrollbars npm ERR! react-custom-scrollbars@"^4.2.1" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retrynpm ERR! this command with --force or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! npm ERR! For a full report see: npm ERR! C:\Users\KG.Park\AppData\Local\npm-cache\_logs\2023-05-16T00_56_02_463Z-eresolve-report.txt npm ERR! A complete log of this run can be found in:
미해결
Electron과 NodeJS 그리고 Socket.io를 이용한 채팅 어플리케이션 개발
안녕하세요 리액트 관련해서 일렉트론을 수강하려고 했는데, 그 수업이 아니라고 하셔서 제의도와 맞지않아 환불을 원합니다.. 환불 부탁드려요 감사합니다.
미해결
Slack 클론 코딩[실시간 채팅 with React]
안녕하세요 제로초님 이미지가 안들어가져서 데이터를 삭제하고 다시 만들었는데 갑자기 잘되던것들이 이렇게 오류가 계속뜨네요. 아래는 현재 데이터 테이블들입니다
미해결
[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
안녕하세요 비동기 함수들은 백그라운드로 보내서 실행이 된다고 하셨는데 그럼 백그라운드에서 실행되는 애들이 멀티스레드로 실행이 되는건가요? setTimeout, promise를 호출하면 둘 다 백그라운드로 이동하는데 여기서 백그라운드 영역은 여러 스레드가 백그라운드로 온 함수들을 동시에 실행하고 태스크 큐로 보내고 이벤트 루프가 호출 스택이 비었을 때 태스크 큐에 작업이 남아있다면 호출스택으로 올려서 작업을 실행하는 것이 맞을까요? 감사합니다!
미해결
Slack 클론 코딩[실시간 채팅 with React]
안녕하세요 제로초님 npm 사이트에서 devtools 보니까 cache하고 mutate가 사라져있는데 swr하고 swr-devtools 버전을 강의하고 일치시키면 mutate 만되고 cache가 안됩니다!
미해결
Slack 클론 코딩[실시간 채팅 with React]
안녕하세요 제로초님 디엠부분에서는 안읽은 메시지 표시가 떠서 읽으면 없어지는데 채널부분에서는 없어지지않고 남아있습니다!
미해결
Slack 클론 코딩[실시간 채팅 with React]
안녕하세요 제로초님 Dm에서는 이미지가 드래그업로드가 되는데 채널에서는 500에러가 뜹니다! 백엔드코드 최신버전인데 바꿔야할것이 있나요? POST http://localhost:3095/api/workspaces/sleact/dms/%EC%9D%BC%EB%B0%98/images 500 (Internal Server Error) Error at Query.run (/Users/js/Desktop/sleact/back/node_modules/sequelize/lib/dialects/mysql/query.js:52:25) at /Users/js/Desktop/sleact/back/node_modules/sequelize/lib/sequelize.js:314:28 at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async MySQLQueryInterface.insert (/Users/js/Desktop/sleact/back/node_modules/sequelize/lib/dialects/abstract/query-interface.js:308:21) at async DM.save (/Users/js/Desktop/sleact/back/node_modules/sequelize/lib/model.js:2432:35) at async DM.create (/Users/js/Desktop/sleact/back/node_modules/sequelize/lib/model.js:1344:12) at async /Users/js/Desktop/sleact/back/routes/api.js:522:20 POST /api/workspaces/sleact/dms/%EC%9D%BC%EB%B0%98/images 500 7.558 ms - 898
미해결
모든 개발자의 실무를 위한 올인원 기본기 클래스
강의 자료 링크가 동작이 안되는데 확인 부탁 드립니다!
미해결
Slack 클론 코딩[실시간 채팅 with React]
안녕하세요~ 그전까지 잘되다가 오랜만에 다시 강의를 이어가려고하는데 갑자기 안됩니다 ㅠㅠ 뭐가 문제일까요.. 회원가입시에도 페이지가 넘어가지않고 계속 CORS 오류가 생기네요.. https://github.com/nuring9/react-SWR-SlackClone_front 제가 따라한 코드 깃허브 주소올립니다 ㅠㅠ
미해결
Slack 클론 코딩[실시간 채팅 with React]
안녕하세요 SWR관련 질문이 있습니다. 혹시 React 18버전에서는 SWR DevTools를 어떻게 사용할 수 있는지 부탁 드립니다. 감사합니다.
미해결
Slack 클론 코딩[실시간 채팅 with React]
안녕하세요 제로초님! 채팅보내기 강의를 보고있는데 workspace/index.tsx에서 갑자기 socket 코드 가 생겼는데 강의에는 설명이 없는거 같아서 문의 남깁니다!
미해결
안녕하세요 colab을 이용하던 도중에 갑자기 이상한 현상이 생겨서 질문 남깁니다! 영어를 사용하면 별 문제가 없는데 이상하게 한글만 사용하면 글씨색도 변하고 위의 사진 처럼 셀의 화면이 내려가거나 확대 됩니다. 주석뿐만 아니라 코드에도 한글을 넣으면 똑같은 현상이 발생합니다. 작성시에는 화면이 보이지 않지만 작성후 방향키나 공백을 넣으면 다시 원래 화면으로 돌아옵니다. ㅠㅠㅠㅠ 너무 거슬려서 주석을 작성 할 수 가 없습니다ㅠㅠㅠ 해결책이 있을까요 이것저것 옵션 다 만져봤지만 해결이 안돼서 여쭙니다.
미해결
[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
에러처리 해줄때 app.js에 에러처리 미들웨어를 해주시는데 꼭 이 방식으로 에러 처리를 해줘야하나요? 아니면 보통 router를타고 특정 함수에서 res.status(405).json(dfsa);이렇게 하나하나 처리해주면 안되나요?
해결됨
코딩테스트 [ ALL IN ONE ]
해당 코드에서 LCA에 첫번째 인자값에 배열을 넣어주는데 LCA의 함수에서 root는 left와 right를 가지고 있습니다. 무엇인가요...
미해결
Slack 클론 코딩[실시간 채팅 with React]
예상하지 못한 부분에서 에러가 나와서 질문 남겨드립니다 ! ChatBox.tsx import React, { useCallback, useEffect, useRef, VFC } from 'react'; import { ChatArea, EachMention, Form, MentionsTextarea, SendButton, Toolbox } from './styles'; import autosize from 'autosize'; import { Mention, SuggestionDataItem } from 'react-mentions'; import { useParams } from 'react-router'; import useSWR from 'swr'; import { IUser } from '@typings/db'; import fetcher from '@utils/fetcher'; import gravatar from 'gravatar'; interface Props { chat: string; onSubmitForm: (e: any) => void; onChangeChat: (e: any) => void; placeholder?: string; } const ChatBox: VFC<Props> = ({ chat, onSubmitForm, onChangeChat, placeholder }) => { const { workspace } = useParams<{ workspace: string }>(); const { data: userData, error, revalidate, mutate, } = useSWR<IUser | false>('/api/users', fetcher, { dedupingInterval: 2000, // 2초 }); const { data: memberData } = useSWR<IUser[]>(userData ? `/api/workspaces/${workspace}/members` : null, fetcher); const textareaRef = useRef<HTMLTextAreaElement>(null); useEffect(() => { if (textareaRef.current) { autosize(textareaRef.current); } }, []); const onKeydownChat = useCallback( (e) => { if (e.key === 'Enter') { if (!e.shiftKey) { e.preventDefault(); onSubmitForm(e); } } }, [onSubmitForm], ); const renderSuggestion = useCallback( ( suggestion: SuggestionDataItem, search: string, highlightedDisplay: React.ReactNode, index: number, focus: boolean, ): React.ReactNode => { if (!memberData) return; return ( <EachMention focus={focus}> <img src={gravatar.url(memberData[index].email, { s: '20px', d: 'retro' })} alt={memberData[index].nickname} /> <span>{highlightedDisplay}</span> </EachMention> ); }, [memberData], ); return ( <ChatArea> <Form onSubmit={onSubmitForm}> <MentionsTextarea id="editor-chat" value={chat} onChange={onChangeChat} onKeyPress={onKeydownChat} placeholder={placeholder} inputRef={textareaRef} allowSuggestionsAboveCursor > <Mention appendSpaceOnAdd trigger="@" data={memberData?.map((v) => ({ id: v.id, display: v.nickname })) || []} renderSuggestion={renderSuggestion} /> </MentionsTextarea> <Toolbox> <SendButton className={ 'c-button-unstyled c-icon_button c-icon_button--light c-icon_button--size_medium c-texty_input__button c-texty_input__button--send' + (chat?.trim() ? '' : ' c-texty_input__button--disabled') } data-qa="texty_send_button" aria-label="Send message" data-sk="tooltip_parent" type="submit" disabled={!chat?.trim()} > <i className="c-icon c-icon--paperplane-filled" aria-hidden="true" /> </SendButton> </Toolbox> </Form> </ChatArea> ); }; export default ChatBox; 혼자서 해결해보려다가 못찾고 있어서 질문 남겨드려요 ㅠㅠ
미해결
Slack 클론 코딩[실시간 채팅 with React]
const onSubmitForm = useCallback( (e) => { e.preventDefault(); if (chat?.trim() && chatData) { const savedChat = chat; mutateChat((prevChatData) => { prevChatData?.[0].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).then(() => { localStorage.setItem(`${workspace}-${id}`, new Date().getTime().toString()); setChat(''); if (scrollbarRef.current) { console.log('scrollToBottom!', scrollbarRef.current?.getValues()); scrollbarRef.current.scrollToBottom(); } }); axios .post(`/api/workspaces/${workspace}/dms/${id}/chats`, { content: chat, }) .then(() => console.log('first')) .catch(console.error); } }, [chat, workspace, id, myData, userData, chatData, mutateChat, setChat], ); const onMessage = useCallback( (data: IDM) => { if (data.SenderId === Number(id) && myData.id !== Number(id)) { mutateChat((chatData) => { chatData?.[0].unshift(data); return chatData; }, false) 이부분은 socket?.on('dm', onMessage) dm보내는 페이지에서 디엠을 보낼 때 onSubmitForm에서 mutate가 먼저 실행돼서 화면 데이터를 먼저 바꿔주고 그 다음 서버로 데이터를 보낸 뒤 처리하는 과정에서 socket.emit()이 실행되고 onMessage가 실행되는 걸로 이해했는데요. onMessage가 받는 데이터가 onSumbitForm의 mutate가 인자로 받는 함수랑 똑같아서 중복작업이 아닌가 싶어서 onMessage mutate 안의 chat.Data ?.[0].unshift(data)를 지우고 실행해봐도 똑같은 결과가 나오는데 이 코드는 왜 있는 건가요?
