수강이 제한됩니다.
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결React로 NodeBird SNS 만들기
state에서 사용된 Key 이름과 관련한 질문
다른 영상들에도 계속 등장을 했던 부분이기도 한데,state 내의 키값들의 이름을 정의할 때 User만 첫 문자를 대문자로 쓰고, 다른 키들(content 등)은 소문자로 구분해서 쓰셨는데, 특별한 이유가 있으신지 궁금합니다. 일반적으로 네이밍 규칙은 통일해서 가져가는 경우가 많고, 그게 관리 측면에서도 효율적이라는 생각이 들거든요. State 정의시, User와 관련해서는 관례적으로 첫 문자열을 대문자로 쓴다와 같은 부분이 있는 것일지 질문드려봅니다.
- React로 NodeBird SNS 만들기
이미지업로드 404에러
삭제된 글입니다
- 미해결React로 NodeBird SNS 만들기
의존성관리 부탁드립니다.
ch3 ch4 깃허브에 있는 프로젝트 npm install npm run build npm start 하는데 도저히 안되네요.... 실행방법 없는 건가요?
- 미해결React로 NodeBird SNS 만들기
질문있습니다
1. 프론트에서 넥스트와 익스프레스를 연결했는데, 그러면 프론트에서도 익스프레스로 서버를 돌리고 백엔드에서도 익스프레스로 서버를 돌리면, 각각의 익스프레스로 프론트,백 서버를 돌리는것이 맞나요?? 2. 프론트에서 넥스트와 익스프레스를 연결한건 동적라우팅을 쓰려하는데, 넥스트에서 안되니 그저 익스프레스를 동적라우팅을 쓰기위한 수단으로 사용하는 건가요??
- 미해결React로 NodeBird SNS 만들기
high order function과 export 관한 질문
1. with redux(()=>{return something})(Nodebird);something 값을 Nodebird에 전달해주는 것 같은데 이런 함수는 처음봐서 잘 이해가 안가서요..2. (1) reducers 폴더의 user/post 에서 어떤 것은 export 붙여주고 어떤 것은 안붙여주는데 무슨 의미안가요? (2) ADD_POST 변수에 export 안붙여줘도 동작하는 이유가 reducer함수 클로저로 변수를 기억하고 있기 때문인건가요? 감사합니다..
- React로 NodeBird SNS 만들기
useRouter() 는 왜 app.js 에서 사용하지 못하는건가요?
삭제된 글입니다
- 미해결React로 NodeBird SNS 만들기
onSubmit 시에 콘솔로그 안뜨는건 왜그런걸까요
const onSubmit = (e) => { e.preventDefault(); if (password !== passwordCheck) { return setPasswordError(true); } if (!term) { return setTermError(true); } console.log({ id, nick, password, passwordCheck, term, }); }; id nick password pwchk term 콘솔로그가 안떠요.. 제가 타이핑을 잘못한줄 알고 코드 복붙해도 안뜨네요
- 미해결React로 NodeBird SNS 만들기
React의 비동기통신에 대한 질문입니다.
컴포넌트에서 리덕스의 글로벌 state가 아닌 useState로 생성한 state만을 업데이트 할때 redux saga를 사용하지 않고 컴포넌트 안에서 axios와 setState를 사용해 업데이트를 하는것은 가능하다고는 알고 있는데 redux saga를 이미 사용하는 프로젝트에서 개별적인 state 업데이트를 위해 컴포넌트 안에서 axios를 사용하는 것은 괜찮은가요?? 가능하다는것은 알고 있지만 표준이나 코드 스타일에서 올바르다고 하는 개발 방법이 맞는지, 코드의 유지보수가 어려워지거나, 선호하지 않는 개발 방법인지 궁금해서 질문 드렸습니다.
- React로 NodeBird SNS 만들기
팔로잉 목록 가져오는데 질문입니다.
삭제된 글입니다
- 해결됨React로 NodeBird SNS 만들기
다시 질문 드립니다!
안녕하세요! 아래 아래 게시글(https://www.inflearn.com/questions/30818)에 질문 드렸는데 글을 못보신것 같아 다시 질문 정리하여 올립니다! useRef를 이용해 이벤트 발생 시 input에 focus를 하는 기능을 만들고자 하는데요. 해당 input이 초기에는 존재하지 않다가, 이후 텍스트를 클릭하면 나타나도록 짰는데 (조건문 사용) 이 때에 코드상으로 input에 ref를 설정해줬음에도 ref에 focus를 줬을 때 input을 잡지 못하는 문제점이 있습니다 ㅠㅠ (input이 처음부터 존재하도록 코드를 수정해보았더니 그 때엔 제대로 잘 동작합니다) useCallback에서 변화가 생김을 감지할 배열 목록에 해당 ref를 넣어줘도 새로 생성된 input을 ref로 잡지 못하고 focus에서 오류가 생깁니다! 이렇게 초기 컴포넌트에 추가된 새로운 노드를 ref로 읽어오지 못할 때에는 어떻게 해야 하나요? (자세한 코드는 (https://www.inflearn.com/questions/30818)에 서술해두었습니다.. 도움 주시면 감사하겠습니다!!)
- React로 NodeBird SNS 만들기
유저별 마이페이지 질문
삭제된 글입니다
- 미해결React로 NodeBird SNS 만들기
제로초님
제로초님 useEffect를 쓰던중 궁금한 javascript문법이 있어서 남깁니다 예를 들어 const aa = console.log("반가워")라고 했을 때 aa를 부르지도 않았는데 console.log() 가 찍히게 되고 그래서 생각 한게 이벤트 루프 돌때 자바스크립트 안에서 처리 가능 한 부분이라서 스택에 바로 처리를 하게 되서 되는가 싶기도 한데 그래서 이제 const aa = console.log("반가워") console.log(aa) // undefined 를 했을때 스택에서 const aa = console.log("반가워")이부분이 실행 되고 사라진 뒤에 console.log(aa)에서 찾았을때 undefined가 나 오는건지 이럴 경우 return을 하면은 해결은 되던데 왜 이렇게 되는건지 이론 적으로 확실 하게 설명을 못하 곘더라구여 ㅠㅠ 답변 부탁 드리겠습니다
- 미해결React로 NodeBird SNS 만들기
실습하던 중 질문 드립니다!
제로초님 안녕하세요! 해당 강의를 듣고 포트폴리오를 만들고 있는 학생입니다. 투두리스트를 만들던 중, 이미 저장된 투두 텍스트를 클릭할 시 수정모드로 바뀌어 텍스트에서 인풋폼으로 바뀌고, 해당 인풋폼에 포커스가 맞추어지는 기능을 넣고자 합니다. state인 editingMode를 텍스트를 클릭할 경우 true로 바꾸고, editingMode가 true라면 span태그가 아닌 수정 가능한 input태그를 보여주는 방식으로 진행하고자 합니다. input폼에 포커스가 맞추어지도록 하기 위해서 useRef를 이용하여 current.focus()를 사용하였는데요. input이 없었다가 나중에 나타나는거여서 그런지 ref인 todoInput의 값이 undefined로 뜨네요 ㅠㅠ useCallback을 이용해서 변하는 배열에 todoInput.current를 넣어주었는데도 계속 todoInput이 undefined로 떠서 어떤 식으로 진행을 해야 하는지 조언을 얻고자 질문글 드립니다 ㅠㅠ 해당 코드입니다! (투두리스트의 todoItem 컴포넌트입니다) import React, {useState, useCallback, useRef} from 'react'; import { useDispatch } from 'react-redux'; import { checkTodoAction } from '../reducers/todo'; const TodoItem = ({item, index}) => { const dispatch = useDispatch(); const [editedTodo, setEditedTodo] = useState(''); const [editingMode, setEditingMode] = useState(false); const todoInput = useRef(); const checkTodo = useCallback(() => { dispatch(checkTodoAction); },[]); const editModeStart = useCallback(() => { console.log(todoInput); setEditingMode(true); todoInput.current.focus(); }, [todoInput.current]); const editTodo = useCallback((e) => { setEditedTodo(e.target.value); }, []); const editModeEnd = useCallback(() => { setEditingMode(false); // dispatch(editTodoAction); }, []); return ( <> <li> <button onClick={checkTodo}>{item.checked? '체크취소' : '체크'}</button> {editingMode? <input type="text" value={editedTodo || item && item.content} ref={todoInput} onChange={editTodo} onBlur={editModeEnd}/> : <span style={item.checked? {textDecorationLine:'line-through'}: {textDecorationLine:'none'}} onClick={editModeStart} >{item.content}</span> } </li> </> ); } export default TodoItem; 문제가 되는 코드는 editModeStart 함수와 input태그입니다. 조언 주시면 감사하겠습니다!
- 해결됨React로 NodeBird SNS 만들기
저 워크벤치 확인이 안됩니다ㅠ
터미널에서 db쿼리문 확인되었는데 워크벤치에서는 메인화면만 뜨고 자동으로 연동이 되지 않는 것 같습니다. 그래서 파일열기를 하려는데 어떤 파일을 열어야 하는지 모르겠습니다
- 미해결React로 NodeBird SNS 만들기
프론트엔드 서버에 대한 개념을 잘 모르겠습니다
웹서버에 대한 개념이 약한지라 구글링을 해봤지만 잘 이해가 안갑니다 ㅠ 프론트엔드 서버와 백엔드 서버를 둘로 나누면, 프론트엔드 서버는 페이지 렌더링에 필요한 자바스크립트 파일을 브라우저에게 전송하고, 백엔드 서버는 페이지에서 필요한 데이터 생성 및 전송을 담당하는 역할을 한다... 이렇게 찾고 개념을 대충 이해했는데요. 근데 웹을 만들 때 결국 프론트엔드 서버에서 백엔드 서버에게 api 호출해서 필요한 데이터를 다 받아오는데, 그럼 결국 클라이언트와 통신하는 것은 프론트엔드 서버인건가요? 클라이언트<->프론트엔드서버<->백엔드서버<->DB 이런식으로요... 그리고 프론트엔드서버+백엔드서버를 합쳐 웹서버라고 하는 것이 맞나요?
- 해결됨React로 NodeBird SNS 만들기
Next.js 실무에서 많이 쓰이는지 궁금합니다.
리액트로 코드스플리팅, 서버사이드렌더링을 구현하는 과정을 공부하고있는데요.. 친절한 설명이 뒷받침되는데도 불구하고 너무 어렵네요.. 리액트로 코드스플리팅, 서버사이드렌더링을 구현하는 과정을 알게되니깐 next.js가 왜 마법이라고 불리우는지 알것같습니다. next.js는 리액트 라우터와 호환이 되지않는다는게 엄청 치명적인 단점인데다, 기존의 프로젝트에 서버사이드렌더링,코드스플리팅을 적용해야하는 ( <= 이 경우를 회사에서 일할때 유지보수의 일종이라라고 생각하면될까요?) 경우에 next.js를 사용하는게 불가능하다고 알고있는데.. 실무에서 next.js가 많이쓰이나요? 흔히 React 공고에서 "react 잘 다루는 분" 이 문구가 next.js도 포함되어있는걸까요?
- 미해결React로 NodeBird SNS 만들기
ssh 키를 입력했는데, 아마존 데이터베이스 서버에 접속이 되지 않아요.
The authenticity of host 'ec2-18-190-119-159.us-east-2.compute.amazonaws.com (18.190.119.159)' can't be established. ECDSA key fingerprint is SHA256:YUdN7COo9JscaM4Gj/uaKZehD+mK1nK3HE8GKnRxujo. Are you sure you want to continue connecting (yes/no)? yes Warning: Permanently added 'ec2-18-190-119-159.us-east-2.compute.amazonaws.com,18.190.119.159' (ECDSA) to the list of known hosts. @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @ WARNING: UNPROTECTED PRIVATE KEY FILE! @ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ Permissions 0644 for 'react-nodebird.pem' are too open. It is required that your private key files are NOT accessible by others. This private key will be ignored. Load key "react-nodebird.pem": bad permissions ubuntu@ec2-18-190-119-159.us-east-2.compute.amazonaws.com: Permission denied (publickey). ➜ react-nodebird git:(master) 탄력적 ip 연결하고, pem key 디렉토리에서 ssh 키 입력후 yes 를 하였는데 아마존 db 센터에 접속이 되지 않고, 다시 git 명령어가 나오네요 왜 이럴까용 ㅜㅜ
- 미해결React로 NodeBird SNS 만들기
LOAD_HASHTAG_POSTS_FAILURE
태그는 잘 따와서 주소도 잘 붙여주는데 서버로 가는게 문제인거 같아요... LOAD_HASHTAG_POSTS_FAILURE 가 뜨는데 어디서 확인해야 되나요?
- 미해결React로 NodeBird SNS 만들기
config 오류인가요..?
이 부분은 어디서 오류가 난 걸까요? config.js로 바꿨는데
- 미해결React로 NodeBird SNS 만들기
ssr redux 질문드립니다.
서버에서 가지고 있는 redux는 각 사용자에게 고유하게 할당 된 건인가요? 그게 맞을 거 같긴 한데,, 그렇다면 그 역할은 next-redux-wrapper가 해주는 개 맞는지 궁금합니다.