173만명의 커뮤니티!! 함께 토론해봐요.
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
다른 폴더에서 연습하다가 다시 강의할때 만든 폴더를 로컬 서버에 연결하려고 하니 안되네요 npm start하면next build 하라고 나오고 그대로 하면 또 다른 에러가 떠서 에러 동굴로 들어가는 느낌이에요 다른 폴더는 또 로컬서버 3000으로는 들어가지는데 코드 변경한게 저장해도 반영이 안되고 예전 모습 그대로만 나와요 구글링 해보면 도커를 설치해서 설정 추가하라고 나오는데 이렇게 따라해볼까요?? 구글에서 하라는대로 하다가 모두 엉망진창이 될까봐 두려워요
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요. 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.json package.json 입니다. 감사합니다!
미해결
[리뉴얼] React로 NodeBird SNS 만들기
에러는 없고 데이터에서도 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;
미해결
[리뉴얼] React로 NodeBird SNS 만들기
로그인 후 게시물에 댓글을 달면 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;
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요 멘토님. 항상 강의 잘 보고 있습니다. 예전부터 문의드리려다가 자꾸 잊어먹던게 있었는데 이제서야 질문드립니다. export default function aaa() { const bbb = () => { ... } ... } 위와 같이 강의를 들을 때 마다 왜 컴포넌트 부분의 최초 함수 선언 부분만 화살표 함수가 아닌 일반 함수 선언 방식으로 하시는지, 특별한 이유가 있는 것인지 궁금합니다. 감사합니다.
미해결
[리뉴얼] React로 NodeBird SNS 만들기
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안 쓰고 컴포넌트 밖에다 선언해줘도 상관없나요?
미해결
[리뉴얼] React로 NodeBird SNS 만들기
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;
미해결
[리뉴얼] React로 NodeBird SNS 만들기
프론트서버를 ec2 에서 npm start를 하면 자꾸 client_loop: send disconnect: connection reset by peer 이라는 에러가 나오는데 해결방법이 있을까요 구글링도 해봤지만 해답을 찾지 못했습니다
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요 멘토님, 항상 틈틈히 강의 잘 보고 있습니다. 질문부터 말씀드리자면, OAuth로 로그인 기능을 만들면 백엔드에서 별도로 JWT관련 인증, 발급, 재발급 등의 로직을 개발해주지 않아도 되는지 궁금해서 질문을 드리게 되었습니다. 제 상황을 말씀드리자면 토이프로젝트 개발을 슬슬 시작하려는데요, 시작하기에 앞서 백엔드 서버부터 먼저 만들고 있었습니다. 해당 강의에서 제공해주는 백엔드 서버의 중고마켓이나 게시판 API를 활용한 것이 아닌, 다른 주제로 개인 토이프로젝트를 새로 프론트부터 백엔드단까지 직접 만들어보려고 합니다. 기존 웹 개발 경력이 조금 있어서인지 자바나 노드 백엔드 구축 등을 배워서 API를 개발하는 것은 할만했습니다. 하지만 백엔드에서 딱 하나, JWT 관련 로직을 추가하는 부분이 제 기준으로 너무 어렵고 벽이더라구요. (현업에서도 JWT 경험이 없습니다) 그래서 시간이 너무 걸려서 보류해두었다가 다시 강의를 듣고 있었는데 이번 강의에서 OAuth 관련 내용을 보게 되었습니다. 더 찾아보니까 인증, 발급과 같은 각종 로그인 관련 기능들을 해당 OAuth 서버에서 제공해준다고 되어있더라구요. 그래서 해당 부분들을 활용하면 기존의 JWT 발급이나 인증 관련 로직을 백엔드에서 직접 구축해야하는 부분을 스킵하고 진행할 수 있지 않을까 궁금해져서 질문 글을 올리게 되었습니다. 강의 내용의 OAuth 부분을 보고 궁금해져서 질문을 올려야 겠다고 생각했는데 어쩌다 보니 백엔드 느낌의 질문 글이 되어 죄송합니다. 하지만 멘토님이 백엔드쪽 강의도 하시는걸로 알고 있어 혹시나 질문을 드려봅니다. 감사합니다.
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
import { useState } from "react"; import { Modal } from "antd"; import { Address } from "react-daum-postcode/lib/loadPostcode"; import DaumPostcodeEmbed from "react-daum-postcode"; const ModalCustomPage = () => { const [isModalOpen, setIsModalOpen] = useState(false); const onToggleModal = () => { setIsModalOpen((prev) => !prev); }; const handleComplete = (address: Address) => { console.log("실행되었습니다."); console.log(address); onToggleModal(); }; return ( <> {isModalOpen && ( <Modal title="모달 제목" open={true} onOk={onToggleModal} onCancel={onToggleModal} > <DaumPostcodeEmbed onComplete={handleComplete} /> </Modal> )} </> ); }; export default ModalCustomPage; 안녕하세요, 한 가지 궁금증이 들어 질문합니다. onToggleModal 함수를 보면 prevState를 사용해서 isOpenModal 값을 바꾸는데 굳이 그럴 필요가 있을까? 라는 생각이 들어서요. const onToggleModal = () => { setIsModalOpen((!isModalOpen); }; onToggleModal 안에서 여러개의 setIsModalOpen이 실행되는 것이 아니기 때문에 그냥 이렇게 코드를 작성해도 함수가 끝나면 isOpenModal 값이 바뀌고 리렌더링되어 버그 없이 잘 실행될 것 같은데 혹시 다른 이유가 있나요? 아님 setState 사용할때 prevState를 사용하는 것이 암묵적인 원칙인가요?
미해결
[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요 제로초님. 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이 적용된 스타일 (= 원래 디자인) 입니다. 혹시 짚이는 게 있으시면 답변 부탁드릴게요.. 감사합니다.
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
섹션 6 포트폴리오 리뷰 영상 보면서 따라하고 있는데 아무래도 createBoard의 파라미터랑 리턴값이 강의와 다른 것 같아서 오류가 발생하는 것 같은데 어떻게 해야 같은 API를 사용할 수 있을까요?
미해결
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
하루에 한강의씩 들었더니 어느덧 배포까지 완강 하였네요. 알차고 좋은강의 만들어 주셔서 감사합니다.
미해결
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
ls -a 명령어를 사용하였을때, .git .gitignore client docker-compose.yml server 이렇게 밖에 구성이 없을경우, 저같은 경우에도 .gitignore에 .env파일을 추가 해두어서 git에 없습니다. .env파일에는 DB_USER_ID= DB_USER_PASSWORD= 데이터베이스 아이디와 비밀번호가 입력되어 있는데 .env 환경변수 파일이 없어서 docker-compose up 명령어를 실행 했을때 문제가 발생합니다. 이를 해결하려면 간단하게 .env파일을 만들어주면 됩니다. cd명령어로 docker-compose.yml파일과 같은경로에 가주신 다음에 .env 파일 생성 명령어 $ sudo vim .env 내용을 작성하려면 키보드에서 Insert키 눌려야 됩니다. 디비유저 아이디와 패스워드를 작성해주신다음에 esc키 누른후 wq! 명령어로 저장해주시면 끝입니다. 잘 저장 되었는지 확인 하는 방법은 다시 $ sudo vim .env 명령어를 치시면 잘 저장되어 있는지 확인 가능합니다. 이후에 docker-compose up 사용하시면 잘됩니다. 요약 docker-compose.yml파일과 같은경로로 이동 $ sudo vim .env 명령어로 .env파일생성 vim명령어로 열려진 .env파일에 키보드에 Insert키 눌려서 작성상태로 만든뒤 DB_USER_ID= DB_USER_PASSWORD= 작성하기.(복사 붙여넣기도 됨) 꼭!! esc키 누른 후 wq!명령어 치고 엔터로 저장하기. 다시 $ sudo vim .env 명령어로 잘 저장되어 있는지 확인하고 esc + q! 저장 안하고 나오기. docker-compose up 명령어로 실행 하기
미해결
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
도커 다운받는 링크 복사 할때 공백 생겨서 필요 하신분 쓰시라고 링크 올려 두겠습니다. https://www.digitalocean.com/community/tutorials/how-to-install-and-use-docker-on-ubuntu-22-04
미해결
[리뉴얼] React로 NodeBird SNS 만들기
faker를 개발자가 망쳐두고 튀었다고 듣긴했는데 그럼 몇버젼을 사용해야할까요 게시글들 보면서 보이는 버전들은 다 사용했는데 안먹혀서 ㅠㅠ 요즘에는 몇버전 사용하나요?
미해결
[리뉴얼] React로 NodeBird SNS 만들기
[제로초 강좌 질문 필독 사항입니다] 질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다. 도움이 되는 질문을 하는 방법을 알려드립니다. https://www.youtube.com/watch?v=PUKOWrOuC0c 0. 숫자 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"만 뜹니다 어디가 문제인지 잘모르겠습니다
해결됨
[개념반] 배워서 바로 쓰는 Pandas
section1. where 강의자료 문제 16번 풀이에서 첫번째 파라미터에 ':'을 입력해주셨는데 어떤 의미인가요?
미해결
[리뉴얼] React로 NodeBird SNS 만들기
19:20에서 load action이 꼭 ssr이 되어야 하는 거 아니면, swr를 쓰는 걸 추천한다고 하셨는데, 이게 무슨 의미인지 모르겠어요.. ssr은 그냥 getServerSideProps 함수 안에다가, 아무 action 함수를 넣으면 ssr로 data가 불려와 지는 거 아니였나요? 그러면 swr 뿐만 아니라 RTK Query나 thunk를 써도 ssr이 안 되는 거는 마찬가지인가요? 갑자기 잘 모르겠네요 ...
