묻고 답해요
167만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
faker가 안먹혀요 ㅠㅠ
faker를 개발자가 망쳐두고 튀었다고 듣긴했는데 그럼 몇버젼을 사용해야할까요 게시글들 보면서 보이는 버전들은 다 사용했는데 안먹혀서 ㅠㅠ 요즘에는 몇버전 사용하나요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
postData.split is not a function 에러
[제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.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"만 뜹니다어디가 문제인지 잘모르겠습니다
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
swr이 ssr을 지원하지 않는건가요?
19:20에서 load action이 꼭 ssr이 되어야 하는 거 아니면, swr를 쓰는 걸 추천한다고 하셨는데,이게 무슨 의미인지 모르겠어요..ssr은 그냥 getServerSideProps 함수 안에다가, 아무 action 함수를 넣으면 ssr로 data가 불려와 지는 거 아니였나요?그러면 swr 뿐만 아니라 RTK Query나 thunk를 써도 ssr이 안 되는 거는 마찬가지인가요? 갑자기 잘 모르겠네요 ...
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
빌드 아이디 바꾼 후 적용 안됨
안녕하세요. 강의 진행 중 빌드 아이디가 적용이 안되어 문의 드립니다. 우선 next.config.js파일에generateBuildId: () => "codecamp_deploy",라는 명령을 통하여 빌드 아이디를 일치시키고 빌드하였습니다. 그런데 ec2에서는 빌드아이디가 계속 이전 것으로 유지됩니다. 원인이 무엇일까요? 아래는 제가 진행한 과정입니다. 1. 빌드 후 aws S3에 다시 올림, 퍼블릭 설정완료 2. git push 완료 ec2에서 git pull 완료 4-1 .next 변경사항 확인 결과는 안됨혹시 제가 놓친 부분이 있을까요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
S3 관련
Aws s3 프리티어 조건을 보니 5GB 제공에 get 요청 2만건 put요청 2000건까지 무료라고 되어있는데 get요청이라는게 노드버드로 치면 게시글 에 있는 이미지를 조회할때마다 요청이되는건가요? 그럼 새로고침 될때마다 요청이 되는거고 새로고침 2만번하면 프리티어에서 초과되는 이런 개념인가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
댓글 삭제 에러 관련질문
댓글 삭제가 잘 진행이 되다가 .. 다음과 같은 에러창이 뜨면 더이상 삭제가 진행되지 않습니다.
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
오타로 인한 오류 제보 입니다.
9분:15초쯤 commented on다음에 작성코드[변경전]<span>commented on</span> <Link href={`/u/${comment.post?.url}`} className="cursor-pointer font-semibold hover:underline" > {comment.post?.title} </Link>[변경후]<span>commented on</span> <Link href={`${comment.post?.url}`} className="cursor-pointer font-semibold hover:underline" > {comment.post?.title} </Link>
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
대댓글 기능 구현
대댓글 기능을 구현하라고 했는데, graphql을 보면대댓글 기능을 구현할 수 있는 query가 보이지 않아요.fetchBoardcomments는 있는데, 이건 그냥 댓글 리스트를 가져오는 query고 대댓글 리스트를 가져오는 query는 안보여요.혹시나 해서 포트폴리오 리뷰를 참고했지만 SECTION9-1에서 대댓글 기능 구현에 대한 언급은 따로 없는거같아서요. 제가 못찾는건가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
강의 난이도와 강의가 취업에 충분한지 궁금합니다
안녕하세요 취업을 위해 강의를 구매하고 듣고 있습니다혹시 이강의 만으로 취업이 가능할까요?보통 국비학원이나 오프라인 코드캠프 과정에 비해 내용이 좀 적은 편인가요?난이도가 입문이라고 되어 있어서 더 따로 공부해야 취업을 위한 실력이 가능한 건지 궁금합니다혹시 부족하다면 어떤 부분을 따로 공부하는게 좋나요?그리고 또 알고리즘같은 것도 여기서 다루나요? 따로 공부해야 하나요?
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
isEmpty 체크
안녕하세요 선생님,커뮤니티를 생성하는 핸들러 생성하기(1) 강의 9:29분에 보면 sub Name, Title이 있는지 isEmpty로 체크를 해주고 있습니다.이런 체크은 백엔드에서만 해주는건가요 아니면 프론트, 백엔드 둘 다 해줘야 하는건가요? 강의에서 말씀하신 것처럼, 만약 프론트에서 체크를 해줘서 프론트에 error를 전달하기 위한 목적이 아니라면, 백엔드에서 isEmpty 메서드로 체크 해줄 필요가 없는건가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
qql
qql에서 백틱 다음에 저는 문자열로 모든게 표현되는데, 강의 화면에서는 다르게 나오던데 어떤 익스텐션을 추가해야 되나요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
cloudFront에 원본 프로토콜
원본 도메인을 적는 칸에 강의와는 다른 프로토콜 칸이 생겼습니다.해당 부분은 어떻게 진행하는 것인가요?++ 우선 뷰어 일치로 진행하였는데, 받은 주소가 자꾸 에러가 나네요.자물쇠는 걸렸지만 아래처럼 나옵니다!
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
쿠키 공유 질문이요
제가 어디서부터 흐름이 끊겼는지 모르겠는데 우선 로컬에서 브라우저랑 백엔드서버가 쿠키공유를 할 때 origin이 서로 달라서 브라우저에서는 axios.defaults.withCredentials = true를 해주고 백엔드서버에서는 credentials: true 하고 origin: http://localhost:3060을해서 쿠키를 서로 공유했는데 배포 할 때도 백엔드서버에서 브라우저 ip주소를 origin에 적어주면 공유 되는 거 아닌가요? 왜 배포할 떄는 브라우저와 백엔드서버 origin이 서로 같아야 쿠키가 공유 되는 건가요?
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
회원가입 에러
로컬에서는 문제 없는데 배포 후 에러가 뜹니다... 무슨 에러인지 해결을 못하겠어요..ㅠㅠ
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
Error: Data too long for column 'src' at row 1
게시글 작성에서 이미지를 업로드할때 이런 에러가 나옵니다 s3를 적용한 다음부터인데 검색을 해보니 db에 지정해둔 길이 보다 s3로 부터 가져온 이미지 문자열이 길어서 그런거 같은데 어떻게 하면 좋을까요? 이미지 부분 datatype string을 기존 200에서 300으로 늘려도 에러가 나오네요
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
.git 파일
초기 세팅부분에서 ls -al 했을때 .git 파일이 나오면 어떻게 삭제를 해야하죠? 그리고 이전 수업에서는 .git 파일을 따로 삭제하진 않았던것같은데 혹시 했었다면 어떤 강의에서 했는지 알 수 있을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
[CSS-in-js] Emotion styled components 관련 질문입니다.
const Wrapper = styled.div` @media (max-width: 767px) { width: 760px; & > div { width: 700px; } }; width: 1200px; padding: 30px; display: flex; flex-direction: column; justify-content: space-between; align-items: center; margin: 0 auto; & > div { width: 1000px; } `1) 위의 내용과 같이 CSS-in-js 코드 작성하고 화면 너비를 767px 이하로 조정하였음에도 Wrapper 자손 div 선택자들의 너비가 width: 700px로 조정되지 않습니다. 아래 그림과 같이 @mobile 밖의 코드인 1000px로 계속 강제적용이 되는것으로 보입니다. 왜 이런 것인지 알 수 있을까요?2) 논외로 위의 코드와 같이 & > div 를 이용하여 자손 div 태그들에 너비를 정해준 후, 따로 const 이용하여 자손 div 중 하나를 상수 지정하여 너비를 설정해주면, Wrapper에서 &>div를 이용해서 지정한 너비로 또 계속 강제적용되는 것으로 보입니다. & > div가 가장 우선적인 설정인가요? 답변 부탁드리겠습니다ㅠ
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
도메인 구매
혹시 도메인 구매할때 .com만 구입하는게 좋을까요? .site같은 도메인을 쓰게 되면 문제되는게 있을까요?
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
더미데이터와 포스터폼 만들기 강좌 질문
[제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.2.Unhandled Runtime ErrorError: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports. Check the render method of PostForm.Sourcecomponents/LoginForm.js (15:4) @ eval 13 | 14 | const onSubmitForm = useCallback(() => { > 15 | dispatch( | ^ 16 | loginAction({ 17 | id, 18 | password,터미널 에러 메세지/!\ You are using legacy implementation. Please update your code: use createWrapper() and wrapper.useWrappedStore().4. withRedux(Sansbook) created new store with { giapState: undefined, gspState: null, gsspState: null, gippState: null}{}4. withRedux(Sansbook) created new store with { giapState: undefined, gspState: null, gsspState: null, gippState: null}{}3. import React, { useCallback } from "react"; import { Button, Form, Input } from "antd"; import Link from "next/link"; import { useDispatch } from "react-redux"; import useInput from "./hooks/useInput"; import { loginAction } from "../reducers/user"; const LoginForm = () => { const [id, onChangeId] = useInput(""); const [password, onChangePassword] = useInput(""); const dispatch = useDispatch(); const onSubmitForm = useCallback(() => { dispatch( loginAction({ id, password, }) ); }, [id, password]); return ( <Form onFinish={onSubmitForm} style={{ padding: "10px" }}> <div> <label htmlFor="user-id">아이디</label> <br /> <Input name="user-id" value={id} onChange={onChangeId} required /> </div> <div> <label htmlFor="user-password">비밀번호</label> <br /> <Input name="user-password" value={password} onChange={onChangePassword} type="password" required /> </div> <div style={{ marginTop: "10px" }}> <Button type="primary" htmlType="submit" loading={false}> 로그인 </Button> <Link href="/signup"> <a> <Button>회원가입</Button> </a> </Link> </div> </Form> ); }; export default LoginForm; import { Form, Input, Button } from "antd"; import { useCallback, useState, useRef } from "react"; import { useDispatch, useSelector } from "react-redux"; const PostForm = () => { const { imagePaths } = useSelector((state) => state.post); const [text, setText] = useState(""); const dispatch = useDispatch(); const imageInput = useRef(); const onChangeText = useCallback((e) => { setText(e.target.value); }, []); const onSubmit = useCallback(() => { dispatch(addPost); }, []); const onClickImageUpload = useCallback(() => { imageInput.current.click(); }, [imageInput.current]); return ( <Form style={{ margin: "10px 0 20px" }} encType="multipart/form-data" onFinish={onSubmit} > <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"> 짹쨱 </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; 포스트폼까지 만들고 로그인버튼 누르면 저 에러가 뜨면서 안되네요 ㅠㅠ 에러메시지를 보면 LoginForm에 dispatch가 문제가 있다하고 PostForm 렌더링 방법을 한번 체크해보라는데 잘모르겠습니다
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
도메인
도메인 주소를 만드려고 하는데요선생님께서는 어떤 웹호스팅 업체를 사용하셨는지 여쭤봐도 될까요????