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

안녕하세요 제로초님인피니트 스크롤링 적용하는 부분에서 스크롤이 끝에 올 때마다 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> ); 

 안녕하세요 지금까지 열심히 듣고 있습니다. 다름이 아니라 몽고 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 내용을 읽지 못하는듯 합니다.코드는 하기와 같고요. 실행시 아래와 같은 오류가 발생 합니다.경로 문제 일까요?

로그인 후 게시물에 댓글을 달면 500에러가 뜨면서 실패합니다 ㅠㅠ 백엔드에는 comment.comment 없다고 에러 뜨는거같은데 어디가 문제인지 잘모르겠습니다지금까지 해본건 오타 찾아보고 대소문자를 바꿔보고 했는데도 안되서 결국에 질문하네요 ㅠㅠ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.delete("/", (req, res) => { res.json({}); }); module.exports = router;

 안녕하세요.'이미지 업로드 API' 수업 따라가다 Postman으로 'uploadFile' 호출시 'Cross-Site Request Forgery(CSRF)' 오류 발생에 대해서 확인 후 원인에 대해서 시원한 답변 부탁 드릴께요.위와 같이 CSRF 오류가 발생 합니다. 구글후 headers에 하기 값을 추가하니 문제 없네요. 원인에 대해서 쉽게 설명좀 부탁 드립니다. :)

const TextAreaStyle = { resize: 'none', height: 120, marginBotton: 5, }; function EditPostCard() { return ( <> <TextArea rows={4} style={TextAreaStyle} /> <Space wrap> <Button type="primary">수정</Button> <Button type="primary" danger>취소</Button> </Space> </> ); } export default EditPostCard; 컴포넌트 밖에서 스타일객체를 선언한 경우 function EditPostCard() { const TextAreaStyle = useMemo(() => ({ resize: 'none', height: 120, marginBotton: 5, })); return ( <> <TextArea rows={4} style={TextAreaStyle} /> <Space wrap> <Button type="primary">수정</Button> <Button type="primary" danger>취소</Button> </Space> </> ); } 컴포넌트 안에서 useMemo를 사용한 경우리렌더링때문에 스타일을 따로 선언해주었는데요.두 가지 경우가 큰 차이가 있나요? useMemo안 쓰고컴포넌트 밖에다 선언해줘도 상관없나요?

예를들어 api 들은/api로 요청을 받아서 api들만 따로 빼주었는데여기서 한번더 /api/user/api/board이런식으로 분리하고싶다면 어떤 방법이 가장 좋을까요..?

1. 뭔가 프론트는 문제가 없는거같은데 백에서는 어디에서 문제가 있는지 잘모르겠습니다 ㅠㅠ에러는 없습니다3. 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) => { 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) => { 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, }); res.status(201).json(comment); } catch (error) { console.error(error); next(error); } }); router.delete("/", (req, res) => { res.json({}); }); module.exports = router; import { Form, Input, Button } from "antd"; import { useCallback, useRef, useEffect, useState } from "react"; import { useDispatch, useSelector } from "react-redux"; import { ADD_POST_REQUEST } from "../reducers/post"; import useInput from "./hooks/useInput"; const PostForm = () => { const { imagePaths, addPostDone, addPostLoading } = useSelector( (state) => state.post ); const [text, setText] = useState(""); const dispatch = useDispatch(); const imageInput = useRef(); useEffect(() => { if (addPostDone) { setText(""); } }, [addPostDone]); const onSubmitForm = useCallback(() => { dispatch({ type: ADD_POST_REQUEST, data: text, }); }, [text]); const onChangeText = useCallback((e) => { setText(e.target.value); }, []); const onClickImageUpload = useCallback(() => { imageInput.current.click(); }, [imageInput.current]); return ( <Form style={{ margin: "10px 0 20px" }} encType="multipart/form-data" onFinish={onSubmitForm} > <Input.TextArea value={text} onChange={onChangeText} maxLength={140} placeholder="어떤 일이 생겼나요" /> <div> <input type="file" multiple hidden ref={imageInput} /> <Button onClick={onClickImageUpload}>이미지 업로드</Button> <Button type="primary" style={{ float: "right" }} htmlType="submit" loading={addPostLoading} > 짹쨱 </Button> </div> <div> {imagePaths.map((v) => ( <div key={v} style={{ display: "inline-block" }}> <img src={v} style={{ width: "200px" }} alt={v} /> <div> <Button>제거</Button> </div> </div> ))} </div> </Form> ); }; export default PostForm; //saga - AddPost function addPostAPI(data) { return axios.post("/post", { content: data }); } function* addPost(action) { try { const result = yield call(addPostAPI, action.data); yield put({ //put : dispatch type: ADD_POST_SUCCESS, data: result.data, }); yield put({ type: ADD_POST_TO_ME, data: result.data.id, }); } catch (err) { yield put({ type: ADD_POST_FAILURE, data: err.response.data, }); } } // reducer case ADD_POST_REQUEST: draft.addPostLoading = true; draft.addPostDone = false; draft.addPostError = null; break; case ADD_POST_SUCCESS: draft.addPostLoading = false; draft.addPostDone = true; draft.mainPosts.unshift(action.data); break; case ADD_POST_FAILURE: draft.addPostLoading = false; draft.addPostError = action.error; break;

 계속 yarn을 설치해도 command not found라고만 뜨는데 어떻게 하면 좋을까요 

프론트서버를 ec2 에서 npm start를 하면 자꾸 client_loop: send disconnect: connection reset by peer 이라는 에러가 나오는데 해결방법이 있을까요 구글링도 해봤지만 해답을 찾지 못했습니다

mongoose.connect 콜백함수 수정했고 다만들고 실행했는데Operation users.find() buffering timed out after 10000msMongoServerSelectionError: connect ECONNREFUSED ::1:27017mongod연결했는데 이렇게 에러 뜨네요 ㅜㅠ schemas/index.js에서 콜백함수 수정한 코드입니다 혹시 제가 잘못수정한건가요? const mongoose = require("mongoose"); const connect = () => { if (process.env.NODE_ENV !== "production") { mongoose.set("debug", true); } mongoose .connect("mongodb://root:nodejsbook@localhost:27017/admin", { dbName: "nodejs", useNewUrlParser: true, }) .then(() => { console.log("몽고디비 연결 성공"); }) .catch(() => { console.log("몽고디비 연결 에러"); }); }; mongoose.connection.on("error", (error) => { console.error("몽고디비 연결 에러", error); }); mongoose.connection.on("disconnected", () => { console.error("몽고디비 연결이 끊겼습니다. 연결을 재시도합니다."); connect(); }); module.exports = connect;

Movie, User 테이블하고 many-to-many 로 만든 Favorite 테이블이 있는데 Favorite 테이블에 저장하려고 할 때 이런 에러가 납니다.query failed: INSERT INTO `favorite`(`id`, `userId`, `movieId`) VALUES (DEFAULT, DEFAULT, DEFAULT) error: Error: Unknown column 'id' in 'field list' query: ROLLBACK [Nest] 782975 - 04/08/2023, 6:59:26 PM ERROR [ExceptionsHandler] Unknown column 'id' in 'field list' Movie 는 이렇게 만들어져있구요import { Entity, Column, PrimaryGeneratedColumn, ManyToMany, JoinTable } from 'typeorm'; import { User } from '../users/users.entity'; @Entity() export class Movie { @PrimaryGeneratedColumn() readonly id: number; @Column({ length: 100 }) title: string; @Column('text', { nullable: true }) desc: string; @ManyToMany(() => User, (user) => user.favorites) @JoinTable({ name: 'favorite' }) favorites: User[]; }User 는import { Entity, Column, PrimaryGeneratedColumn, ManyToMany, JoinTable } from 'typeorm'; import { Movie } from '../movies/movies.entity'; @Entity() export class User { @PrimaryGeneratedColumn() readonly id: number; @Column() username: string; @ManyToMany(() => Movie) @JoinTable({ name: 'favorite' }) favorites: Movie[]; }그리고 Favorite 은import { Entity, ManyToOne, PrimaryGeneratedColumn } from 'typeorm'; import { User } from '../users/users.entity'; import { Movie } from '../movies/movies.entity'; @Entity() export class Favorite { @PrimaryGeneratedColumn() id: number; @ManyToOne(() => User, (user) => user.favorites) user: User; @ManyToOne(() => Movie, (movie) => movie.favorites) movie: Movie; } 그런데 DB 를 보면 Favotie 테이블에 id 칼럼이 없습니다.그래서 favoriteRepository.save() 할때 에러가 난다고 의심하고 있는데요, favorites.service.ts는import { Injectable } from '@nestjs/common'; import { InjectRepository } from '@nestjs/typeorm'; import { Repository } from 'typeorm'; import { Favorite } from './favorites.entity'; @Injectable() export class FavoritesService { constructor( @InjectRepository(Favorite) private readonly favoriteRepository: Repository<Favorite>, ) {} async create(userId: number, movieId: number): Promise<Favorite> { const favorite = new Favorite(); favorite.user = { id: userId } as any; favorite.movie = { id: movieId } as any; return await this.favoriteRepository.save(favorite); } }이렇게 되어있습니다.어디를 고쳐야 하는걸까요?

connect에 콜백 이제 안된다고해서 코드를 promise로 썻는데 잘작성이안되네요 어떻게 쓰면될까요? ㅠㅠ

안녕하세요 제로초님.getServerSideProp를 적용한 이후 새로고침 시 로그인 문제가 발생합니다.로그인을 하고 -> 1번째 새로 고침 시 로그인이 풀립니다.하지만 1번째 새로 고침 이후, 끈기를 가지고 계속해서 새로고침을 하다보면 로그인 상태로 다시 돌아옵니다.보통 3번째 정도 새로고침을 하면 로그인이 돌아옵니다..이거는 됐다가 안됐다가 하는 문제이기 때문에 제 코드 문제는 아닌 거 같습니다..새로고침을 n번째 시도 했을 때 로그인이 불규칙 하게 돌아옵니다.그리고 mui ssr 문제도 있는데요.styled-components는 _document와 babelrc? 를 적용하지 않아도 잘 적용되는 반면에, mui ssr은 https://github.com/mui/material-ui/issues/33072 여기에서 시키는 대로 해봐도 적용이 안 되네요1번째 사진은 새로고침 해서 ssr이 적용된 스타일 입니다.2번째 사진은 /profile 페이지 갔다가, 왼쪽 상단 mui 눌러서 홈페이지로 이동 했을때 csr이 적용된 스타일 (= 원래 디자인) 입니다. 혹시 짚이는 게 있으시면 답변 부탁드릴게요.. 감사합니다.

faker를 개발자가 망쳐두고 튀었다고 듣긴했는데 그럼 몇버젼을 사용해야할까요 게시글들 보면서 보이는 버전들은 다 사용했는데 안먹혀서 ㅠㅠ 요즘에는 몇버전 사용하나요?

운영 단계에서의 데이터베이스와개발 단계에서의 데이터베이스를 분리하여 운영한다고 하면,테스트를 위한 데이터베이스도 만들어야할까요?

안녕하세요 Postman을 윈도우에서 깔아서 쓰려고 하는데 자꾸만 셋업로그가 잘못되었다고 에러가 뜹니다. 다시 시도해 봐야 하나요? 아니면 postman을 launch부터 하고 나서 깔아야 하나요? 참고로 postman을 launch하고 나서 또 다시 다운로드 시도해봤습니다.

[제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.2.3.case ADD_POST_TO_ME: return { ...state, me: { ...state.me, Posts: [{ id: action.data }, ...state.me.Posts], }, };const PostCardContent = ({ postData }) => ( //#해쉬태그 <div> {postData?.split(/(#[^\s#]+)/g).map((v, i) => { if (v.match(/(#[^\s#]+)/)) { return ( <Link href={`/hashtag/${v.slice(1)}`} key={i}> <a>{v}</a> </Link> ); } return v; })} </div> ); function* addPost(action) { try { //const result = yield fork(addPostAPI, action.data); yield delay(1000); const id = shortId.generate(); yield put({ //put : dispatch type: ADD_POST_SUCCESS, data: { id, content: action.data, }, }); yield put({ type: ADD_POST_TO_ME, data: id, }); } catch (err) { yield put({ type: ADD_POST_FAILURE, data: err.response.data, }); } }로그인하고 게시물을 아무거나 입력하고 짹짹을 누르면 에러가뜹니다postData.split이 읽히지가 않아서 ?까지 넣어봤는데 같은오류가 나옵니다.<PostCardContent postData={post.content} />여기서 post.content는 콘솔로 찍어본 결과 "첫 번째 게시글 #해시태그 #jangsan"만 뜹니다어디가 문제인지 잘모르겠습니다