안녕하세요 정말 열심히 듣고 있었지만 오류가 발생하자 아무리 찾아도 나오지 않아 답답해서 문의 드립니다. 강의: 크롤링 2 - puppeteerdocker-compose up 으로 실행 하였고crawler 를 node index.js 실행 하자 저런 에러들이 발생하였습니다.... 해결 방법이 있을까요??

 이렇게 코드를 작성하였는데계속 오류가 나네요 이유가 뭔지 알 수 있을까요 ?

controller\auth 랑 passport\localStrategy에서 로그인 post를 보낼때의 경우가 service로 보내서 비즈니스로직을 돌고 컨트롤러에 return값을 보내주는 방식으로 passport\localStrategy가 Service역할을 한다고 생각해도 괜찮나요? 

음 어디를 봐야할지 잘몰라서 글을 남깁니다 ㅠㅠ팔로우를 누르고 프로필을 넘어가면서다른 사람을 팔로우 했다가 자신을 팔로우 한것으로 바뀌네요 ㅠㅠ 그래서 팔로우하고 프로필 페이지로 넘어가면 팔로잉 목록하고 팔로워 목록에 자신 닉넴임이 둘다 뜹니다 ㅠㅠ일단 팔로우는 다른 사람 팔로우 했다고 정상적으로 뜹니다 

새 일기 작성이 되지 않아서 강의 따라서 해보고다른분들이 같은 문제로 올린 곳에서 문제해결 하신분들 코드를 가져와서 해봤는데 안되서 올립니다.https://github.com/lhs0698/emotion_Diary

어디 쪽에서 문제가 발생 하는지 모르겠습니다. 

강의감사합니다.

일단 저는 공개/비공개는 제외하고 만들고 있었는데 ImageContext에서 prevDara를 추가한 이후로 첫 로드시에 첫번째 이미지 리스트들을 두번 호출하는데 어떤 방식으로 해결해야 할까요???옵저버가 발동 되면 두번째 페이지 리스트들은 한번만 호출이 되는데 첫번째 페이지에 해당되는 이미지들만 두번이 호출되버립니다 ㅠㅠ 깃허브에 임시로 올려두긴 했는데 다른 파일들은 문제가 없어 보이긴 합니다ㅠㅠuseEffect(() => { if(pastImageUrlRef.current === imageUrl) return; setImageLoad(true); axios .get(imageUrl) .then((result) => setImages((prevData) => [...prevData, ...result.data])) .catch((err) => { console.error(err); setImageError(err) }) .finally(() => { setImageLoad(false); pastImageUrlRef.current = imageUrl; }); }, [imageUrl]);

안녕하세요 강의 관련된 내용은 아닌데 혹시 질문 드려도 괜찮을까요?이번에 슬랙에서 만두피님이 하신걸 보고 저에게 맞게 따라하고 있는데 잘 되지 않아 질문 드립니다.위와 같은 문제가 있는데 그 전에 비슷하게 사용했을땐 잘 되던 일이라 이것저것 해보다가 typescript 버전을 v4로 내리면 data가 IForm[] 으로 추론 된다는걸 알았습니다. typescript v5을 사용하려면 어떤 식으로 풀어가야 할까요?? rk는 v4 사용하고 있습니다.공홈에서는 저 fetchFormAPI에서 리턴 값 타입으로 Promise<IForm[]>으로 주면 된다는데 처음 보는 방법이라 맞는건지 아니면 그냥 연습을 위한 방법인지 잘 몰라 질문 드립니다.const { data, isLoading } = useQuery<IForm[]>(['forms'], () => fetchFormsAPI('test'));export function fetchFormsAPI(domain: string) { // 1 return api.get(`/forms?formId=${domain}`).then((response) => response.data); // 2 // return axios({ // method: 'get', // url: `/forms?formId=${domain}`, // }).then((response) => response.data); }export const api = axios.create({ baseURL: backUrl, withCredentials: true, }); 위 2번째 코드에서 2번을 사용하면 첫번째 사진 빨간 밑줄은 사라지는데 결국 타입 추론이 안되는건 같았습니다. 그리고 공식 문서 처럼 fetchFormAPI함수에 리턴 타입을 붙이고 useQuery에 타입을 빼면 아래와 같이 useQuery에서는 타입을 정상적으로 추론하지만 막상 데이터를 사용할 때는 이상한 값이 들어오는 것을 확인했습니다.export function fetchFormsAPI(domain: string): Promise<IForm[]> { // 1 return api.get(`/forms?formId=${domain}`).then((response) => response.data); }const { data, error, isLoading } = useQuery(['forms'], () => fetchFormsAPI('test'));typescript 버전을 v4로 내리면 정상 작동하는 것은 확인했습니다. 어제부터 해결을 못하고 있어 질문드립니다. 감사합니다.

지금 이런식으로 저는 파일구조가 되어있는데 저도 파일구조의 상태에서 npm run build를 했을때 콘솔창에 2번 myWebpackLoader에 작성한 문구가 나왔습니다. 이렇게 되면, index.js에서 한번 사용된거고 main.js에서 한번 사용된게 맞을까요.. ? 저 main.js는 output으로 build될때 만들어지도록 설정해놓은 파일인데, 로더가 output의 확장자와 겹칠때도 작동을 하는건가..? 싶어서 여쭙습니다!

Script not found: C:\Users\USER\Documents\project\linkfit-backend\dist\main.js이렇게 에러가 나서 보니까 main.js경로가 dist/src/main.js에 있던데 이게 맞나요?

안녕하세요 선생님, 알려주신 것처럼,getServerSideProps를이용해서 쿠키가 있을때만 페이지를 접근 가능하게 했습니다. 근데 sub를 생성할 수 있는 버튼을 클릭하면 아래 주소로 이동 가능하게(router.push('/sub/create')) 했는데 접근이 가능하네요? 이럴땐, 해당 버튼을 클릭하면 다시 login 페이지로 가도록 라우팅 처리를 또 해줘야 하는건가요?

안녕하세요 제로초님인피니트 스크롤링 적용하는 부분에서 스크롤이 끝에 올 때마다 mainPosts가 10개씩 추가 되지 않고 한번에 50개(draft.hasMorePost = draft.mainPosts.length < 50;)가 추가 되는데 원래라면 스크롤을 끝까지 내릴 때마다 10개씩만 추가 되어야 하는 건가요?댓글에서 SUCCESS는 한 번만 와야 된다고 하셨는데 저는 처음 한 번만 게시글이 10개 추가(success 한 번)되고 이후에는 게시글이 50개가 될 때까지 한꺼번에 success가 들어옵니다콘솔에 inView를 찍어보니 처음 10개만 들어왔을 때는 true -> false로 값의 변화가 있는데 한번에 success 되는 부분에서의 inView의 값은 계속 true로 찍힙니다..이런 경우에는 어떻게 해결해야 되나요..??index.jsconst Home = () => { const dispatch = useDispatch(); const { me } = useSelector((state) => state.user); const { mainPosts, hasMorePost, loadPostsLoading } = useSelector((state) => state.post); const [ref, inView] = useInView(); useEffect( () => { dispatch({ type: LOAD_POSTS_REQUEST, }); }, []); useEffect( () => { if (inView && hasMorePost && !loadPostsLoading) { const lastId = mainPosts[mainPosts.length - 1]?.id; dispatch({ type: LOAD_POSTS_REQUEST, lastId, }); } }, [inView, hasMorePost, loadPostsLoading, mainPosts], ); return ( <AppLayout> {me && <PostForm />} {mainPosts.map((post) => <PostCard key={post.id} post={post} />)} <div ref={hasMorePost && !loadPostsLoading ? ref : undefined} style={{ height: 10, backgroundColor: 'red' }} /> </AppLayout> ); 

다른 폴더에서 연습하다가 다시 강의할때 만든 폴더를 로컬 서버에 연결하려고 하니 안되네요npm start하면next build 하라고 나오고 그대로 하면 또 다른 에러가 떠서 에러 동굴로 들어가는 느낌이에요 다른 폴더는 또 로컬서버 3000으로는 들어가지는데 코드 변경한게 저장해도 반영이 안되고 예전 모습 그대로만 나와요 구글링 해보면 도커를 설치해서 설정 추가하라고 나오는데 이렇게 따라해볼까요?? 구글에서 하라는대로 하다가 모두 엉망진창이 될까봐 두려워요

 async loginUser({ email, password, context }) { const user = await this.userService.findOne({ email }); if (!user) throw new UnprocessableEntityException('이메일이 없습니다.'); const isAuth = bcrypt.compare(password, user.password); if (!isAuth) throw new UnprocessableEntityException('비밀번호가 틀렸습니다.'); await this.setRefreshToken({ user, res: context.res }); return await this.setAccessToken({ user, res: context.res }); }이렇게 아이디 비번이 다를때 오류 처리를 해주었는데 client에 넘어가는 status코든는 200이 뜨네요 왜 그럴까요?

안녕하세요. Section10 함수형 컴포넌트의 생명주기에서 궁금한 점이 있어 질문 드립니다.component가 unmount 되는 상황을 만들기 위해 router.push로 페이지를 이동하잖아요?그런데 router.push로 이동할 때는 return()=>{...}의 내용이 제대로 실행되는데,주소창에 직접 이동할 주소를 써서 이동했을 때에는 같은 동작이 실행되지 않더라구요.둘다 현재 컴포넌트가 제거되고 새로운 컴포넌트가 화면에 나타나는 것아닌가요? 다르게 동작하는데 이유가 있는지, 아니면 제가 코드를 잘못 쓴건지 피드백 부탁드립니다. 감사합니다! 작성코드 useEffect(() => { console.log('컴포넌트가 마운트됐습니다~'); return () => { alert('컴포넌트가 제거됩니다~'); }; }, []); useEffect(() => { console.log('컴포넌트가 변경됐습니다~'); }); const onClickButton = () => { setCount((prev) => prev + 1); }; const onClickMove = () => { router.push('/'); }; 

 안녕하세요 강사님, 강의 잘 듣고 있습니다.혹시 다음과 같은 에러가 발생하는데 뭘 잘못한지 모르겠어서 문의 남깁니다.아래 사진 파일들은 순서대로_app.tsx.eslintrc.js.eslintrc.jsonpackage.json입니다.감사합니다!

 안녕하세요 지금까지 열심히 듣고 있습니다. 다름이 아니라 몽고 db 설치에서 문제가 생겨 여쭈어 보려고 합니다. brew services start mongodb-community 실행시 아래와 같은 오류가 발생합니다. 해결방법이 있을까요??.... (맥북m1)

에러는 없고 데이터에서도 like하고 unlike가 잘되는건 확인했는데 화면에서는 새로고침 해야지만 바뀌네요그리고 좋아요하고 다시 눌러서 취소 할려는데 취소가 안되고 계속 중복으로 좋아요가 됩니다 const express = require("express"); const { Post, Image, Comment, User } = require("../models"); const { isLoggedIn } = require("./middlewares"); const router = express.Router(); router.post("/", isLoggedIn, async (req, res, next) => { try { const post = await Post.create({ content: req.body.content, userId: req.user.id, }); const fullPost = await Post.findOne({ where: { id: post.id }, include: [ { model: Image, }, { model: Comment, include: [ { model: User, // 댓글 작성자 attributes: ["id", "nickname"], }, ], }, { model: User, // 게시글 작성자 attributes: ["id", "nickname"], }, { model: User, // 좋아요 누른 사람 as: "Likers", attributes: ["id"], }, ], }); res.status(201).json(fullPost); } catch (error) { console.error(error); next(error); } }); router.post("/:postId/comment", isLoggedIn, async (req, res, next) => { try { const post = await Post.findOne({ where: { id: req.params.postId }, }); if (!post) { return res.status(403).send("존재하지 않는 게시글입니다"); //return을 붙여줘야지 send하고 밑에 json이 동시에 실행안됨 } const comment = await Comment.create({ content: req.body.content, PostId: req.params.postId, userId: req.user.id, }); const fullComment = await Comment.findOne({ where: { id: comment.id }, include: [ { model: User, attributes: ["id", "nickname"], }, ], }); res.status(201).json(fullComment); } catch (error) { console.error(error); next(error); } }); router.patch("/:postId/like", isLoggedIn, async (req, res, next) => { try { const post = await Post.findOne({ where: { id: req.params.postId }, }); if (!post) { return res.status(403).send("게시글이 존제하지 않습니다"); } await post.addLikers(req.user.id); res.json({ PostId: post.id, userID: req.user.id }); } catch (error) { console.error(error); next(error); } }); router.delete("/:postId/like", isLoggedIn, async (req, res, next) => { try { const post = await Post.findOne({ where: { id: req.params.postId }, }); if (!post) { return res.status(403).send("게시글이 존제하지 않습니다"); } await post.removeLikers(req.user.id); res.json({ PostId: post.id, userID: req.user.id }); } catch (error) { console.error(error); next(error); } }); router.delete("/", (req, res) => { res.json({}); }); module.exports = router; const express = require("express"); const { Post, Image, User, Comment } = require("../models"); const router = express.Router(); router.get("/", async (req, res, next) => { try { const posts = await Post.findAll({ limit: 10, order: [ ["createdAt", "DESC"], [Comment, "createdAt", "DESC"], ], //옵션 = ASC: 오름차순 include: [ { model: User, attributes: ["id", "nickname"], //아이디 ,닉네임만 가져오기 }, { model: Image, }, { model: Comment, include: [ { model: User, attributes: ["id", "nickname"], }, ], }, { model: User, // 좋아요 누른 사람 as: "Likers", attributes: ["id"], }, ], }); res.status(200).json(posts); } catch (error) { console.error(error); next(error); } }); module.exports = router; import { Card, Button, Avatar, Popover, List, Comment } from "antd"; import { RetweetOutlined, HeartOutlined, MessageOutlined, HeartTwoTone, EllipsisOutlined, } from "@ant-design/icons"; import { useDispatch, useSelector } from "react-redux"; import PropTypes from "prop-types"; import PostImages from "./PostImages"; import { useCallback, useEffect, useState } from "react"; import CommentForm from "./CommentForm"; import PostCardContent from "./PostCardContent"; import FollowButton from "./FollowButton"; import { REMOVE_POST_REQUEST, LIKE_POST_REQUEST, UNLIKE_POST_REQUEST, } from "../reducers/post"; const PostCard = ({ post }) => { const dispatch = useDispatch(); const { removePostLoading } = useSelector((state) => state.post); const [commentFormOpened, setCommentFormOpened] = useState(false); const id = useSelector((state) => state.user.me?.id); const onLike = useCallback(() => { if (!id) { return alert("로그인이 필요합니다."); } dispatch({ type: LIKE_POST_REQUEST, data: post.id, }); }, [id]); const onUnLike = useCallback(() => { if (!id) { return alert("로그인이 필요합니다."); } dispatch({ type: UNLIKE_POST_REQUEST, data: post.id, }); }, [id]); const onToggleComment = useCallback(() => { setCommentFormOpened((prev) => !prev); }, []); const onRemovePost = useCallback(() => { dispatch({ type: REMOVE_POST_REQUEST, data: post.id, }); }, []); const liked = post.Likers.find((v) => v.id === id); console.log("@@@", liked); return ( <div style={{ marginBottom: 10 }}> <Card cover={post.Images[0] && <PostImages images={post.Images} />} actions={[ <RetweetOutlined key="retweet" />, liked ? ( <HeartTwoTone twoToneColor="#eb2f96" key="heart" onClick={onUnLike} /> ) : ( <HeartOutlined key="heart" onClick={onLike} /> ), <MessageOutlined key="message" onClick={onToggleComment} />, <Popover key="more" content={ <Button.Group> {id && post.user?.id === id ? ( <> <Button>수정</Button> <Button type="danger" onClick={onRemovePost} loading={removePostLoading} > 삭제 </Button> </> ) : ( <Button>신고</Button> )} </Button.Group> } > <EllipsisOutlined /> </Popover>, ]} extra={id && <FollowButton post={post} />} > <Card.Meta avatar={<Avatar>{post.user?.nickname[0]}</Avatar>} title={post.user?.nickname} description={<PostCardContent postData={post.content} />} /> </Card> {commentFormOpened && ( <div> <CommentForm post={post} /> <List header={`${post.Comments.length}개의 댓글`} itemLayout="horizontal" dataSource={post.Comments} renderItem={(item) => ( <li> <Comment author={item.user?.nickname} avatar={<Avatar>{item.user?.nickname[0]}</Avatar>} content={item.content} /> </li> )} /> </div> )} </div> ); }; PostCard.propTypes = { post: PropTypes.shape({ id: PropTypes.number, user: PropTypes.object, content: PropTypes.string, createdAt: PropTypes.string, Comment: PropTypes.arrayOf(PropTypes.object), Images: PropTypes.arrayOf(PropTypes.object), Likers: PropTypes.arrayOf(PropTypes.object), }).isRequired, }; export default PostCard;

 안녕하세요.fileUpload시 google cloud storage의 keyFilename 내용을 읽지 못하는듯 합니다.코드는 하기와 같고요. 실행시 아래와 같은 오류가 발생 합니다.경로 문제 일까요?