월 17,600원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
https 적용 자동 갱신을 안 했는데 갱신이 되어 있어서..
crontab으로 https 적용 자동 갱신을 안 했는데, 자동 갱신이 되어 있어서 그 이유가 궁금해서 질문을 남겨봅니다. https 적용은 동영상으로 설명해 준 방식 말고, (아마 잘 안 됐나 봐요) 제로초님 블로그 글 보고 적용했던 것 같아요. (아래 링크) https://www.zerocho.com/category/NodeJS/post/5ef450a5701d8a001f84baeb let's encrypt에서 이젠 자동 갱신이 되는 것으로 바뀐 것일까요?
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
커스텀훅과 훅을 같이 쓸수있나요?
안녕하세요 제로초님! '더미데이터와 포스트폼 만들기' 부분을 보고 있습니다. 글작성(짹짹)을 클릭하면 textarea 내용물을 클리어해주고 싶은데, 만약 여기서 const [text, onChangeText] = useInput(""); 이렇게 커스텀 훅을 사용하였다면 setText를 사용해서 따로 상태를 변경할 수는 없는건가요? 감사합니다 !
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
pm2 start 이후에 사이트 연결이 계속 안됩니다.
sudo npx pm2 start yarn -- start 명령어 치고나서 sudo npx pm2 monit을 해보니 찍혀야 할 로그가 찍히지도 않고, 계속 사이트는 연결이 되지 않습니다. ( 아래그림 참고 ) 혹시나 해서 sudo npx pm2 logs로 해서 로그 찍어보니 문제가 딱히 없어보입니다. 혹시나 443포트랑 80포트가 개방이 되지 않아서 그런걸까 싶어서 $ sudo iptables -I INPUT -p tcp --dport 80 -j ACCEPT $ sudo iptables -I OUTPUT -p tcp --sport 80 -j ACCEPT $ sudo iptables -I INPUT -p tcp --dport 443 -j ACCEPT $ sudo iptables -I OUTPUT -p tcp --sport 443 -j ACCEPT 위와 같은 명령어도 실행했습니다. 그 결과 현재 Listen하고 있는 포트를 조회해보니 이렇게 나오더라고요. tcp 하나가 established상태인데 이거는 완료 후 서버까지 연결된 상태인 거로 알고 잇는데, 대체 왜 사이트에 연결이 되지 않는걸까요? ㅠㅠㅠㅠㅠㅠ
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
find함수에서 proxy질문이요
안녕하세요 const post = draft.mainPosts.find(v => console.log(v)) 를 했을 때 console에 proxy라는 객체들이 뜨고 draft.mainPosts 배열안에 객체들은 안보여주더군요 proxy가 데이터를 감춰주는 역할을 하는건가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
redux와 react-query 설정
다른 질문 들도 보다가 궁금한 점이 생겨 여쭤봅니다. 프로젝트에서 내에서 상태관리를 redux로 하고 server에서 데이터 패칭하는 부분을 (공부해 보니 server state라고 부르더군요) react-query(또는 swr)로 사용하려는 경우 설정을 어떻게 해야하나 궁금해서 검색해봤는데 마땅한 자료가 없어서 질문드려요 CRA기준으로 index.js에 import React from "react"; import ReactDOM from "react-dom"; import App from "./App"; import reducer from "./reducer"; import { Provider } from "react-redux"; import { configureStore } from "@reduxjs/toolkit"; import { Global } from "@emotion/react"; import { GlobalStyle } from "./index.style"; import { QueryClientProvider, QueryClient } from "react-query"; const store = configureStore({ reducer }); const queryClient = new QueryClient(); ReactDOM.render( <Provider store={store}> <QueryClientProvider client={queryClient}> <App /> <Global styles={GlobalStyle} /> </QueryClientProvider> </Provider>, document.getElementById("root") ); 이런식으로 사용해서 reducer 함수 정의하고 각 컴포넌트에서 queryClient를 import해서 사용하는 건가요? 제로초님 강의 들으면서 react-query를 이제 막 공부하고 있는데 react-query가 내부적으로 contextAPI 사용한다고 알고있는데 redux랑 contextAPI를 같이 쓴다는게 정확히 감이 안잡히네요 제가 잘못알고 있는 부분이나 공부해야할 키워드를 알려주시면 감사하겠습니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
fullPost의 model에 대해 질문이요
const fullPost = await Post.findOne({ where: { id: post.id}, include: [{ model: Image, }, { model:Comment, }, { model:User, }] include에서 model User를 넣어주셨는데 로그인하면 user에 대한 정보가 브라우저에 전달되고 그 user를 가져다 쓰면 되지 않나요?? 안적어도 되는건지 궁금합니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
useQuery refetch
제로초님 제가 react-query useQuery Hook을 사용하여 데이터를 받아왔습니다. 이 데이터 값들을 버튼 onClick 함수를 만들어서 버튼을 클릭할 때마다, useQuery api 요청을 콜을 해 주고 싶습니다. 그래서 찾아보니 useQuery refetch 를 알게되었고, refetch 함수를 onClick 함수에 넣어주었는데, 동작을 하지 않네요 ㅠㅠ. useQuery api를 버튼을 클릭할 떄 마다 api call 을 해주고 싶은데 어떻게 해줘야 할까요...
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
analyze 브라우저가 자동으로 안뜨는 문제 질문입니다.
안녕하세요 제로초님. next.config.js 를 생성하고 bundle-analyzer 도 설정을 해주고 package.json 에서 실행코드도 입력해주었는데 제로초님 처럼 자동!으로 브라우저가 뜨질 않습니다... 아예 빌드가 안된건 아니고 터미널에 html 주소가 뜬걸 입력하면 화면이 보이는데 제로초님 처럼 자동으로 브라우저가 띄워지는게 아니라 터미널에 뜬 주소로 직접 이동을해야 보여서, 제가 혹시 뭔가 잘못한건지 궁금해서 질문 남깁니다!! bulid 를 했을때 이렇게 analyze true, env production 으로 잘 빌드되는거 같고 마지막까지 에러없이 빌드도 완료했는데 왜 자동으로 브라우저가 띄워지지 않을까요?? 앞서 말씀드린대로 터미널에 적힌 주소로 이동하면 analyzer 빌드된 화면이 잘 보이긴 합니다... 제로초님처럼 자동으로 브라우저가 안띄워지는 현상에 큰 문제가 있는지 궁금합니다... 제 환경이 맥이라 맥에선 자동으로 안띄워지는건가 생각도 들구요...음...큰 문제는 아닐까요..?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
실무에서도 styled component를 해당 컴포넌트에 다 작성하나요?
antd같은 ui 컴포넌트를 사용안하면 한 컴포넌트 안에서 styled component가 차지하는 코드량이 상당히 많을 것 같은데 실무에서도 styled component의 코드길이에 상관없이 해당 컴포넌트에 다 적는지 아니면 따로 폴더에 분리해서 import하는지 궁금합니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
session secret질문이요
session 옵션중에서 secret이 있는데 이 secret이랑 login할때 서버에서 보내주는 세션에 대한 cookie랑 조합해서 더 안전한 cookie를 브라우저에 보내주는건가요? 어떤 방식으로 동작하는 지를 모르겠습니다. ㅠㅠ
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
질문이 있습니다.
다름이아니라 node 질문입니다. 이 강좌랑은 상관이 없는 질문이긴한데... 너무 궁금해서 질문드립니다. 다름이아니라 제가 woker_threads 모듈을 공부하는 도중 궁금한게 있어 남깁니다. 제가 다른언어로 멀티쓰레드를 코드적으로 구현해본적이 없어서..뭔가 비교대상은 못 찾겠는데 왜 node로 woker_threads모듈을 굳이 쓰지말고 cpu hard 한 작업을 할 일이 있다면 그 부분은 다른언어로 해서 api로 붙여야한다라고 생각하는 사람들이 많은것 같아서요 제로초님도 그러신 것같고 이유가 뭔가요? worker_threads로 코드적으로 구현하기가 다른 타 언어보다 불편한가요? 형태가 다른가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
글쓰고 완료버튼 누르면 화면에 적용이 안돼요ㅠ
redux에 action에는 분명 데이터가 있는데 state로 보면 없고 어디가 문제일까요.. 도와주세요
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요 route 쪽 주소 질문입니다!
안녕하세요 강의를 보면서 한가지 궁금한 점이 생겼습니다. 저는 강의를 진행하다가 GET /user/2/posts?lastId=0 200 38.841 ms - 3117 GET /user/2 500 16.997 ms - 2228 라는 에러를 직면했는데요, 게시글은 가져오지만 작성자의 정보는 가져오지 못하더라구요..! 해당 에러는 ssr 처리를 위해 작성했던 동적 주소를 router.get('/:userId', async (req, res, next) => {}) // 위에서 아래로 변경했습니다. router.get('/:id', async (req, res, next) => {}) 로 변경을 하니까 해결이 됐습니다. 그런데 해당 에러가 뜬 이유가 혹시 이 강의에서 특정 유저의 게시글을 불러오는 주소에 :userId 를 적어주었기 때문인가요?? 같은 라우터에서 같은 동적 주소가 사용되면 문제가 생기나요? 제 코드는 router.get('/:userId/posts', async (req, res, next) => {}) 이 강의에서 작업한 유저의 포스트를 불러오는 라우터가 상단에, router.get('/:userId', async (req, res, next) => {}) SSR 을 위한 유저 정보를 가져오는 라우터가 맨 하단에 위치해 있었습니다! 제 생각으로는 /:userId 가 겹쳐서 하단에 라우터가 500에러가 뜬거라는 생각이 드는데... 제 생각이 맞을까요? 맞다면 같은 라우터에 같은 동적 주소를 사용하면 안되는건가요?? (하나의 라우팅 주소, 노드 라우팅 주소 규칙 등.. 구글링 해봤지만 잘 찾지 못하겠어서 질문드립니다 ㅠㅠ)
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
이미지와 함께 게시글 업로드 시 오류
안녕하세요 제로초님 강의 듣다 막바지에 막히는 부분이 있어 찾다찾다 해결이 되지않아 질문 드립니다 SequelizeDatabaseError: Data too long for column 'src' at row 1 at Query.formatError (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\REACT.SNS\back\node_modules\sequelize\lib\dialects\mysql\query.js:247:16) at Query.handler [as onResult] (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\REACT.SNS\back\node_modules\sequelize\lib\dialects\mysql\query.js:68:23) at Query.execute (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\REACT.SNS\back\node_modules\mysql2\lib\commands\command.js:36:14) at Connection.handlePacket (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\REACT.SNS\back\node_modules\mysql2\lib\connection.js:456:32) at PacketParser.onPacket (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\REACT.SNS\back\node_modules\mysql2\lib\connection.js:85:12) at PacketParser.executeStart (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\REACT.SNS\back\node_modules\mysql2\lib\packet_parser.js:75:16) at Socket.<anonymous> (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\REACT.SNS\back\node_modules\mysql2\lib\connection.js:92:25) at Socket.emit (events.js:315:20) at addChunk (internal/streams/readable.js:309:12) at readableAddChunk (internal/streams/readable.js:284:9) at Socket.Readable.push (internal/streams/readable.js:223:10) at TCP.onStreamRead (internal/stream_base_commons.js:188:23) POST /post 500 23.702 ms - 1784 해당 오류가 나타나면서 게시글과 이미지가 업로드 되지 않는데 무슨 문제인지 여쭤볼 수 있을까요?ㅜ
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
응답할때 send,json 차이 질문이요
19:27초에 응답을 res.json(user)로 보내주셨는데 제가 res.send(user)로도 바꿔서 해보니깐 둘이 다른게 없더군요. 둘의 차이점이 뭔지 궁금해요 json대신 send로 보내도 상관 없는건가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
next auto refresh 대해서
코드를 변경하면 next 에서 자동적으로 hot loader 실행돼서 웹 사이트에서 변경이 되어야 하는데 웹 사이트에서 변경이 되지 않습니다. 그래서 현재 수동으로 새로고침으로 하고 있는데요 왜 안되는걸까요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요
안녕하세요 강의 다 마무리하고 추가 기능 추가하면서 해결안되는게 있어 질문드립니다. 모달로그인 기능을 추가하였습니다. (로그인 두곳에서 가능 =>일반, 모달)여기서 로그인실패 message 상태값을 사용하는 component들이 다 호출되는데 이걸 어떻게 해결 해야될지 잘모르겠습니다. (설명하기가 좀 어렵네요) 모달or 일반 로그인 실패 msg => const { loginErr} = useSelector((state) => state.user) loginErr 사용되는 곳은 모달로그인 컴퍼넌트와 일반 로그인 컴퍼넌트 ... 로그인 실패시 const { loginErr, } = useSelector((state) => state.user) useEffect(() => { if (!mounted.current) { mounted.current = true } else { if (loginErr) { console.log(loginErr) alert(loginErr) // } } }, [loginErr]) 위 코드가 모달로그인과 일반 로그인 똑같이 되어있는데 둘 중하나로 로그인하여 실패시 alert 창이 두번 실행됩니다. 이걸 해결할수 있는 방법 없을까요? 버튼 클릭시 모달내부 코드들이 실행될줄 알고 했는데 생각 처럼 잘 안죕니다. 왜 그런지는 알겠는데 해결방법을 잘 모르겠습니다. 사이트는 tweeter.ga 입니다. 항상 감사합니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
질문이 있습니다.
다름이아니라 질문이 있습니다. 제가 그 AWS말고 개인적으로 포트포워딩해서 핸드폰으로 접속하면서 테스트를 해보고있는데 (내부ip로컬서버환경도 동일) 외부접속이 아닌 로컬로 할때도 그렇고 그 프론트에서 백엔드 포트쪽으로 요청을 보낼때 응답이 오기까지의 딜레이가 랜덤인 것 같아요... 다시 프론트 응답로딩까지 오래 걸리는 것같은느낌? 그럴때마다 백엔트 포트 실행시킨 터미널쪽에서 엔터키를 누르면 바로 터미널 로그에 시퀄라이즈 쿼리문이 찍히면서 응답이 오는데 왜 그런건가요? 이유를 알고 싶네요 질문 1. 프론트에서 백엔드로 요청을보낼떄 응답하는 속도가 랜덤인 것 같다(어쩔땐 빠르고 어쩔땐 느린...) 질문2. 그럴때마다 백엔드 터미널에서 엔터키를 치는데 프론트에서 백으로 요청보내고 바로 엔터키를 치면 바로 요청->응답 페이지 로딩 되는데 이부분 관련해서 왜 엔터키를 치면 바로 요청 된 값이 응답이 되는가에 대해 궁금하네요 질문3 아 그리고 제가 외부ip 내부 ip로 로그인 관련 테스트 해본결과 같은 아이디로 로그인 되더라구요 이 부분 관련해서 코딩을 안해줘서 당연하지만 예상을 해보면 여기에서 다루는 전략은 세션에서 아이디 값을 가지고있는게 아니라 프론트에서 쿠키로 가지고 있잖아요? 그럼 쿠키에 같은 값이 왔을때 뭐 어떻게 처리해줘야할 것같은데 AWS 배포 강의 부분을 아직 다 보지 못했는데 거기 설명해주시면서 알려주시나요? 만약 그 내용이 없다면 구글에 키워드를 뭐라고 치면 나올까요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
useCallback 배열 질문
안녕하세요 제로초님, useinput과 export default (initialValue = null) => { const [value, setValue] = useState(initialValue) const handler = useCallback((e) => { setValue(e.target.value); }, [여기]); return [value, handler]; } 이번 강의에서 사용하신 useCallback 함수 const onChangeText = useCallback((e) => { setText(e.target.value) }, [여기]); 내부에 있는 배열에 useinput에는 value, onChangeText에는 text를 넣지 않아도 되는건가요? 사용자가 입력할 때 마다 어차피 컴포넌트가 리렌더링 되니까 넣어도 안넣어도 똑같기 때문에 굳이 넣지 않는 것인가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
로그인 에러, 500 Internal Server Error
안녕하세요. 회원가입기능은 잘되는데 로그인이 안됩니당. 회원가입해서 DB에 email, 비번 저장되는거 확인하였습니다 그걸로 이제 로그인하려니깐 아래 그림처럼 에러가 뜹니다. 사진1] Network 스크린샷 아래와 같이 "500 internal Server Error"라고 써져있습니다. [사진2] Network>Headers 사진3] Network>Response