173만명의 커뮤니티!! 함께 토론해봐요.
미해결
[리뉴얼] React로 NodeBird SNS 만들기
reducers 폴더의 index파일의 rootReducer함수에서 defalut: return state 들어가는이유 설명해주실때 액션타입해서 그 다음상태 만들어주는것을 처리해주는대 리듀서 초기화할때 또 rootReducer함수가 실행이되는대 그때defalut: return state이 부분이 없으면 리턴값이 undefined된다 이렇게 설명해주셨는대 리듀서가 왜 초기화되는지 이유가 궁금합니다!
미해결
[리뉴얼] React로 NodeBird SNS 만들기
AppLayout에서 store에서 IsLoggedIn 가져오는데서 에러가 발생합니다. const isLoggedIn = useSelector ( ( state ) => state . user . isLoggedIn ) ; 에러 코드 TypeError: Cannot read property 'user' of undefined const initialState = { user : { isLoggedIn : false , user : null , signUpdata : {}, loginData : {}, }, post : { mainPosts : [] , }, } ; const rootReducer = ( state = initialState , action ) => { switch ( action . type ) { case " LOG_IN " : return { ... state , user : { ... state . user , isLoggedIn : true , user : action . data , }, }; case " LOG_OUT " : return { ... state , user : { ... state . user , isLoggedIn : false , user : null , }, }; default: return ; } } ; 뭐가 문제일까여...힝ㅜㅜㅜㅜ
미해결
리액트로 나만의 블로그 만들기(MERN Stack)
되게 여러번 따라 했는데, 새로고침 하고난 후 로그인이 유지가 되지 않습니다..ㅠㅠ authSaga 속의 함수들이 제대로 작동하지 않는것 같습니다.... authoSaga속 함수를 호출하는 시작이 어딘지 순서 또한 잘 파악되지 않습니다..ㅠ 계속 401에러가 뜹니다. ㅠㅠ
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요!! 강의를 구매하고 시작합니다. 그런데 궁금한 점이 있는데..... 구글에서 '노드버드'라고 검색하니깐, 검색이 되는 것을 확인했습니다. 그런데 네이버에서 '노드버드'를 검색을 해보니 아무것도 보이지 않네요?? 1. 네이버 검색엔진에 등록은 안하신 건가요? 2. 네이버에서는 검색엔진 최적화가 안되는 건가요? 3. 개인 포트폴리오를 만들고 싶은데요, 리액트로 블로그를 만들어서 검색엔진 최적화를 하고 싶은데요. 제가 게시물을 작성 한다면.... 그 각자의 게시물이 검색엔진에 의해서 검색이 될 수 있는거죠? p.s. 조현영 강사님~ 리액트로 검색엔진 최적화가 된다길래.. 뒤도 돌아보지 않고 질렀습니다. 강의 열심히 들어볼께요! 그리고 이걸 마스터 하면 다른 타입스크립트 강좌도 구매할 예정입니다^^
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
리액트 네이티브와 네이티브 언어(스위프트, 코틀린)도 합쳐서 개발을 할 수 있는 걸까요?
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요 제로초님, 강의 잘 보고 있다가, 댓글 삭제 기능도 만들고 싶어 만들어 보았는데요... 삭제시 삭제는 되나 새로고침을 해야 사라지는 부분이 있더라구요, 삭제 버튼 클릭시 바로 사라지도록 하고 싶은데 어느 부분이 잘못 됬는지 감이 잡히질 않습니다ㅠㅠ 한번 확인 부탁드려요ㅠㅠ reducer api onClick 삭제 버튼 사가
미해결
리액트로 나만의 블로그 만들기(MERN Stack)
강의와 별개의 내용일수도 있지만, 한가지 여쭙고 싶습니다. 선생님 강의를 듣고 테이블을 좀 많이 사용하는 프로젝트를 하나 해보고 있습니다. 각 테이블마다 saga/reducer를 하나씩 만들고 있는데요, 이럴경우 문제가 될 수 있나요? 공통된 부분은 묶어내고 싶긴 한데, 분류하기가 조금 복잡해서요. 예를 들어, authReducer, customerReducer, productReducer 등등 각 테이블마다 다 만들었거든요. 이런 경우 퍼포먼스 면에서 부족함이 있을까요? 내용이많고 큰 프로젝트보단 중/소 규모의 프로젝트가 리액트에 어울리다라는 이야기를 들은적이 있었지만, 개발하는 사람의 능력에 따라 다르겠지만, 제가 배운 내용을 기반으로 한번 프로젝트를 진행해보고 싶어서 이렇게 시도해보고 있습니다. 강의와 관련있는 질문 을 남겨주세요. • 강의와 관련이 없는 질문은 지식공유자가 답변하지 않을 수 있습니다. (사적 상담, 컨설팅, 과제 풀이 등) • 질문을 남기기 전, 비슷한 내용을 질문한 수강생이 있는지 먼저 검색 을 해주세요. (중복 질문을 자제해주세요.) • 서비스 운영 관련 질문은 인프런 우측 하단 ‘문의하기’ 를 이용해주세요. (영상 재생 문제, 사이트 버그, 강의 환불 등) 질문 전달 에도 요령이 필요합니다. • 지식공유자가 질문을 좀 더 쉽게 확인할 수 있게 도와주세요. • 강의실 페이지 (/lecture) 에서 '질문하기'를 이용해주시면 질문과 연관된 수업 영상 제목이 함께 등록됩니다. • 강의 대시보드에서 질문을 남길 경우, 관련 섹션 및 수업 제목을 기재 해주세요. • 수업 특정 구간에 대한 질문은 꼭 영상 타임코드 를 남겨주세요! 구체적인 질문 일수록 명확한 답을 받을 수 있어요. • 질문 제목은 핵심 키워드를 포함해 간결하게 적어주세요. • 질문 내용은 자세하게 적어주시되, 지식공유자가 답변할 수 있도록 구체적으로 남겨주세요 . • 정확한 질문 내용과 함께 코드 를 적어주시거나, 캡쳐 이미지 를 첨부하면 더욱 좋습니다. 기본적인 예의 를 지켜주세요. • 정중한 의견 및 문의 제시, 감사 인사 등의 커뮤니케이션은 더 나은 강의를 위한 기틀이 됩니다. • 질문이 있을 때에는 강의를 만든 지식공유자에 대한 기본적인 예의를 꼭 지켜주세요. • 반말, 욕설, 과격한 표현 등 지식공유자를 불쾌하게 할 수 있는 내용 은 스팸 처리 등 제재를 가할 수 있습니다.
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
const express = require ( 'express' ); const bcrypt = require ( 'bcrypt' ); const { User } = require ( '../models' ) // 구조분해 할당 const router = express . Router (); router . post ( '/' , async ( req , res , next ) => { try { const exUser = await User . findOne ({ where : { email : req . body . email , } }); // 비동기 fidOne 찾는 함수 if ( exUser ) { return res . status ( 403 ). send ( '이미 사용중인 아이디입니다.' ); } const hashedPassword = await bcrypt . hash ( req . body . password , 12 ) await User . create ({ email : req . body . email , password : hashedPassword , nickname : req . body . nickname , }) res . status ( 200 ). send ( 'success' ); } catch ( error ) { console . error ( error ); next ( error ); } }) module . exports = router ; 이미 있는 이메일로 가입 했을경우, status 403과 send로 에러 메세지를 보냈습니다. 이미 있는 이메일로 가입 했을 경우에 SIGN_UP_REQUEST 만 실행되고 SIGN_UP_FAILUTE 실행되지 않아 alert창이 뜨질 않습니다 ㅠㅠ 뭐가 문제 일까요..
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
AppLayout . prototype = { children : Protypes . node . isRequired } 꼭 사용해야 next 에서 children 를 사용할수 있는건가요? react에서는 prototype을 사용하지 않고 children를 사용한것으로 기억해서요
미해결
[리뉴얼] React로 NodeBird SNS 만들기
질문1. 리덕스사가에 액션이 전달되는 과정 dispatch({ type: LOG_IN_REQUEST, data: { email, password }, }); 위와 같이 로그인 버튼을 눌렀을때 인자로 전달된 액션을 dispatch 하게 되는데. function* watchLogIn() { yield takeLatest(LOG_IN_REQUEST, logIn); } 이후 사가에서 LOG_IN REQUEST 에관한 액션이 왔을떄 login 함수가 실행된다는 흐름은 이해를 했습니다. 하지만 액션객체의 type 속성인 LOG_IN_REQUEST 가 어떻게 위에 takeLatest 의 첫번째 인자로 인식이되어 login 함수가 실행되는지 직관적으로 이해가 가지않습니다. 이미 사가 라이브러이에서 정해진 규칙같은 건가요 ? 액션을 디스패치 할때 {type: `액션타입`} 형태여야만 takeLatest('액션타입') 이 인식이되는지 궁금합니다. 질문2. yield function* logIn(action) { try { console.log('saga logIn'); // const result = yield call(logInAPI); yield delay(1000); => 멈춤? yield put({ => 멈춤? type: LOG_IN_SUCCESS, data: action.data, }); } catch (err) { console.error(err); yield put({ type: LOG_IN_FAILURE, error: err.response.data, }); } } yield 는 중단점 역활을 한다고 이해했습니다. 그럼 위에 takeLatest 의 두번째인자로 위 login 함수가 실행될때 첫번째 yield delay(1000) 이 실행되고 멈추는게아니라 계속에서 아래 yelid put 쪽을 실행되는부분이 이해가 잘 가지않습니다.! 영상 몇번 돌려보고 찾아도 봤는데 스스로 해결하지 못해 질문 드립니다 ㅜㅠ..
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
/front/sagas/index.js 에서 axios . defaults . baseURL = 'http://localhost:3065' ; axios . defaults . withCredentials = true ; 이렇게 공통으로 지정을 해주는데, 만약에 예외적으로 다른 URL을 사용하고 싶으면 어떻게 하나요? function loadPostsAPI ( data ) { return axios . get ( 'http://naver.com/test' , data ); } 이런식으로 개별적으로 URL 넣어주면 될까요? 아니면 애초에 공통URL을 지정해주지 말고 각자 넣어줘야 하는걸까요? 공통URL과 더불어 withCredentials 값도 각자 넣으려면 어떻게 해야하는지 궁금합니다!
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
index 페이지에 /Posts 요청에서 sequelizeeagerloadingerror Image is not associated to Comment 에러가 나고 로그인도 안되요 models 폴더 말고 다른 파일도 수정해야하는 곳이 있나요?
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
/user/[id].js 로 Link 태그를 통해 접근했을 때 userInfo 가 null 인 에러를 해결하려고 이것저것 해보던중 /user/[id].js 안에 { /* <title>{userInfo.nickname}님의 글</title> <meta name="description" content={`${userInfo.nickname}님의 게시글`} /> <meta property="og:title" content={`${userInfo.nickname}님의 게시글`} /> <meta property="og:description" content={`${userInfo.nickname}님의 게시글`} /> <meta property="og:image" content="https://nodebird.com/favicon.ico" /> <meta property="og:url" content={`https://nodebird.com/user/${id}`} /> */ } Head 안에 위 부분을 주석처리하니까 정상적으로 렌더링 되었어요! 혹시 원인이 뭔지 알 수 있을까요? 스크립트가 실행되기 전 Head 안에 userInfo 를 찾다가 에러를 나는 것인지.. 다른 이유에서인지.. 그리고 제로초님 깃헙 클론받아서 실행할 때 next 디펜던시 버전을 9.5.3으로 변경해서 실행해보니 저와 동일한 에러가 났었어요 혹시 확인 가능하실까요?
미해결
따라하며 배우는 노드, 리액트 시리즈 - 영화 사이트 만들기
안녕하세요 :) !!! mainimage에서 이미지불러오는데 이미지가 화면에 표시되지않습니다. props로 로그찍어보고 거기에 나오는 주소로 검색하면 이미지가 잘나오는데 왜 안뜨는지 궁금해요...ㅠㅠ title 명도 분명 가져오는데 안가져오더라구요! -- LandingPage.js import React,{useEffect,useState} from 'react' import { FaCode } from "react-icons/fa" ; import {API_URL,API_KEY,IMAGE_BASE_URL} from '../../Config' import MainImage from './Sections/MainImage' function LandingPage() { const [Movies,setMovies]=useState([]) const [MainMovieImage,setMainMovieImage]=useState( null ) useEffect(() => { const endpoint= ` ${ API_URL } movie/popular?api_key= ${ API_KEY } &language=en-US&page=1` ; fetch(endpoint) .then(response => response.json()) .then(response => { console.log(response) setMovies([...response.results]) setMainMovieImage(response.results[ 0 ]) }) },[]) return ( <div style = { {width: '100%' ,margin: '0' } } > { /* Main Image */ } { MainMovieImage && <MainImage image = { ` ${ IMAGE_BASE_URL } w1280 ${ MainMovieImage.backdrop_path } ` } title = { MainMovieImage.original_title } text = { MainMovieImage.overview } /> } <div style = { { width: '85%' , margin: '1rem auto' } } > <h2> Movies by latest </h2> <hr/> /* Movie Grid Cards */ </div> <div style = { { display: 'flex' , justifyContent: 'center' } } > <button> Load More </button> </div></div> ); }; export default LandingPage -- MainImage.js import React from 'react' ; function MainImage(props){ return ( <div style = { {background: `linear-gradient(to bottom,rgba(0,0,0,0) 39%,rgba(0,0,0,0) 41% rgba(0,0,0,0.65) 100%), url(" ${ props.image } "),#1c1c1c` , height: '500px' , backgroundSize: '100%,cover' , backgroundPostition: 'center,center' , width: '100%' , position: 'relative' } } > <div> <div style = { {position: 'absolute' , maxWidth: '500px' , bottom: '2rem' , marginLeft: '2rem' } } > <h2 style = { {color: 'white' } } > { props.title } </h2> <p style = { {color: 'white' ,fontSize: '1rem' } } > { props.text } </p> </div> </div> </div> ) } export default MainImage
미해결
[리뉴얼] React로 NodeBird SNS 만들기
vscode에서 git bash 로 사용 했는데 다 작성하고 esc 누르고 wq 누르고 엔터 눌러도 반응이 없습니다..
미해결
[리뉴얼] React로 NodeBird SNS 만들기
이미지 업로드와 관련해서 궁금한게 있습니다. 업로드 버튼을 눌러 이미지를 하나만 선택한 뒤 제거 버튼을 눌러 제거하면, 다시 같은 이미지를 선택했을 때 업로드가 안됩니다. 에러가 발생하는 게 아니라 아예 UPLOAD_IMAGES_REQUEST 액션이 디스패치되지 않아요. 제 나름대로 코드를 살펴봤지만 액션이 디스패치되지 않는 이유를 알 수가 없습니다. 원인이 뭔지 알려주시면 감사하겠습니다.
미해결
Node.js 웹개발로 알아보는 백엔드 자바스크립트의 이해
1분20초 부분에서 submit을 눌러도 반응이 없는데 어떤문제일까요???
미해결
Node.js 웹개발로 알아보는 백엔드 자바스크립트의 이해
network status가 200이 아니라 304가 뜨는데 왜 그런걸까요?
미해결
테스트주도개발(TDD)로 만드는 NodeJS API 서버
app.get('/', function(req, res){ res.send('Hello World!'); }); 이 부분에서 http 의 req, res를 한번 wrapping 한 express의 객체라고 하셨는데 그 의미가 이해가지 않습니다 ㅜㅜ
미해결
Node.js 웹개발로 알아보는 백엔드 자바스크립트의 이해
Connection.connect(); 를 추가한 후 저장하면 다음과 같은 에러가 뜹니다. Error: ER_NOT_SUPPORTED_AUTH_MODE: Client does not support authentication protocol requested by server; consider upgrading MySQL client 해결책을 검색해 다음을 입력해보니, use mysql; update user set authentication_string=password(''), plugin='mysql_native_password' where user='root'; FLUSH PRIVILEGES; 다음과 같은 에러가 자꾸 나타나면서 해결을 못하고 있습니다.: ERROR 1064 (42000): You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '(''), plugin='mysql_native_password' where user='root'' at line 1 어떻게 하면 mysql 연동 에러를 해결할 수 있을까요? 도움주시면 정말 감사하겠습니다. ㅜㅜ
