묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
안녕하십니까 강의 정말 잘봤습니다
강사님의 강의 중에 사이트 베포를 다루는 영상이 있을지 궁금합니다 있다면 알려주시면 꼭 수강하겠습니다 감사합니다
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
_app.js 특정페이지에 적용하고싶지 않을때
_app.js 를 적용하면 모든페이지에 적용된다 했는데 특정페이지만 _app.js 를 적용하고싶지 않으면 어떻게 해야되나요?
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
강의 목록 순서 관련 질문이 있습니다.
안녕하세요, 리액트 공부를 시작한 직장인 입니다. 선생님의 강의가 많이 있어서 어떤 강의부터 시작을 해야할지? 그 순서가 궁금하여 질문합니다. 선생님의 강의에서 제 생각으로 순서를 정해보았는데 이렇게 리액트 학습을 진행해도 되는지? 확인 부탁 드립니다. 1. 리액트 시리즈 - 기본강의 2. 리액트 시리즈 - 유튜브 사이트 만들기 3. 리액트 시리즈 - 영화 사이트 만들기 4. 리액트 시리즈 - 챗봇 사이트 만들기 5. 리액트 시리즈 - 쇼핑몰 사이트 만들기 6. 리액트, 파이어베이스 - 채팅 어플리케이션 만들기 7. 리액트 테스트 이 순차대로 진행하면 괜찮을 까요?? 난이도를 낮은 것에서 시작하여 단계를 높여가며 배우고 싶어서요..!
-
미해결
리액트 state로 css변경 함수 질문드립니다.
import React, { useEffect, useState } from 'react'; import styles from './product_list.module.css'; import Product from './product_item/product_item'; const ProductList = ({products}) => { const [filterDisplay, setFilterDisplay] = useState('none'); const filterHandler = () => { if (filterDisplay === 'none') { setFilterDisplay('display'); console.log(filterDisplay); } else { setFilterDisplay('none'); console.log(filterDisplay); } } return ( <section className={styles.product_list}> <button onClick={filterHandler} className={styles.filterBtn}><i className="fas fa-filter"></i></button> <div style={{ display: filterDisplay, }} className={styles.filterBox}> <div className={styles.bikeBox}> <button className={styles.bikeBtn}>MTV</button> <button className={styles.bikeBtn}>하이브리드</button> <button className={styles.bikeBtn}>로드바이크</button> </div> </div> {/* <button className={styles.btn_regiprod}>버튼</button> */} { products.map(product => <Product key={product.id} product={product} /> ) } </section> ) }; export default ProductList; 해당 코드입니다. filterHandler()함수가 작동하면 하단 div의 스타일 display 속성값이 display로 바뀌어서 박스가 보였다 안보였다하게 만들고싶은데, 콘솔에는 변경된 state가 나오는데 실제로 작동이 안되네요... 해결법있을까요?
-
미해결
리액트 쿠키 관련 문제
리액트로 프론트를 개발하고 있고 친구는 스프링 부트로 백엔드를 개발한 후 포스트 맨을 통해서 api를 제공해 줬는데 토큰을 쿠키에서 받아오는 형식입니다. 그런데 제 localhost의 쿠키를 넣으면 401이 뜨고 백엔드 친구의 url 에 토큰 값을 저장해지만 되는데 어떻게 해결 할 수 있을까요.
-
미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
React 관련 궁금한게 있습니다.
리액트 관련해서 질문이 있습니다. 지금까지는 리액트를 로컬에서만 불러오고 있는데요. 외부에서 접근을하려면 서버에 올려야하잖아요? 이런건 어떻게 aws서버에 올리는지 궁금합니다. aws와 react 강의니깐 강의에 맞는 질문 같은데 아니면 알려주세요.
-
해결됨웹 게임을 만들며 배우는 React
작동은 잘되는데 콘솔창에 이런 오류가 뜨네요
injectGlobalHook.js:1648 Fetch API cannot load webpack://lotto/./LottoHooks.jsx?. URL scheme "webpack" is not supported. 테스트해봤는데 크롬에서는 저게 뜨는데 엣지에서는 안뜨네요 왜그런걸까요?
-
해결됨웹 게임을 만들며 배우는 React
성격급한사람이...
성격급한사람은 가위바위보 게임할때 결과 보여주는 대기시간에 마구 클릭해서 interval 가 계속쌓여 속도가 빨라지는데 setTimeout() 종료되기전까지 클릭 막을려면 어케해야되나요?
-
해결됨웹 게임을 만들며 배우는 React
리액트 반복문
제로초님은 key 값을 뭘로 두시나요? index 는 삭제될떄 문제가 생기고 그냥 value 값은 중복이 발생할수 있어서 마땅히 생각이 안나네요 uuid v4 방식으로 해도 괜찮을까요?
-
미해결웹 게임을 만들며 배우는 React
React.createRef()와는 무슨차이인가요?
안녕하세요 선생님 강의 정말 잘 듣고 있습니다. 리액트의 ref를 만들때 input = React.createRef(); <input ref={input} /> 이것도 같은 코드인가요?
-
미해결
리액트 화면 잘림
세로가 길면 화면이 잘리는 현상이 있는데 어떻게 해결해야 될까요?
-
미해결웹 게임을 만들며 배우는 React
안녕하세요 제로초님
안녕하세요 제로초님 이번에 판교에 있는 10인 스타트업 회사에 신입으로 취업하게된 학생입니다. 다름이 아니라 회사 출근일인 9월 1일까지 시간이 있어서 회사가기전에 회사에서 사용하는 기술스택 공부를 하고자 합니다. 회사에서 사용하는 기술 스택이 Javascript와 React 그리고 Ant Design Pattern을 쓴다고 하는데.. 제로초님 React 웹게임 강의만 들으면서 복습해도 회사에 가기전까지 충분히 연습이 될까요? 어떤 연습을 하는게 좋을지 모르겠습니다. 그리고 회사가기전에 환경셋팅하는 법도 충분히 알아두어야 할것 같아서요.. 제가 여쭈어보고 싶은 것의 결론은 최대한 실무에 가깝게 공부하고 연습하려면 제로초님 강의중 어떤 강의를 위주로 공부하는게 좋을지 여쭈어보고 싶습니다.
-
미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
질문있어요~ 꼭 봐주세요 퓨ㅠㅠ
제가 지금 여기까지 잘 따라 오고 있는데 갑자기 오류가 잘 해결이 안되요.. 뭐가 잘못 된 것인지... .9 분15초까지 따라왔는데!! 메세지가 나와야하는데 안나옵니다.. 혹시나 해서 콘솔로 다찍어 봤는데. 디비에 있는 메세지 잘불러오고 깃허브 한번 확인 부탁드려도 될까요? https://github.com/SHT-3756/practice/blob/master/react/react-firebase-chat-app/src/components/ChatPage/MainPanel/MainPanelF.js const renderMessage = (messages) => { messages.length > 0 && messages.map((message) => ( console.log("message" , message) // map() 함수도 잘되고 console.log("message.timestamp", message.timestamp) // console.log("message", message ) // 잘나오고 console.log("user", user) // 잘나오고 <Message key={message.timestamp} message={message} user={user} /> )); }; // <Message /> 여기로 잘안넘어가는 거 같아요.. Message.js 가서 콘손찍어보니 아예 안넘어오는데.. 뭔문제죠? import 도 두번세번 확인했어요.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
리액트에서 img 태그 사용 시 src 속성에 대하여
안녕하세요, 그랩님! 그랩님 강의를 보고 그랩마켓 적용을 학습했습니다. 그 후에 자체적으로 복습을 위해 psg 축구팀 소개 페이지를 클론코딩 중인데요, 이미지 태그 삽입 중 src 속성에 경로 표시에 있어서 의문점이 있어 질의드립니다. (삽입하려는 이미지 모두 public 폴더에 정상적으로 있습니다.) 1. public/logo/logo-psg.png : 엑스박스 처리. 2. logo/logo-psg.png : 정상 삽입. 3. 절대경로 : 엑스박스 처리. 1, 3의 경우에는 왜 이미지가 정상적으로 삽입되지 못하는지 궁금합니다.
-
미해결
리액트 service workers
예전 리액트에서는 앱 인스톨만해도 서비스 워커스라는 파일이 있던데 요즘은 업데이트 되면서 사라진건가요??
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
"MyDocument.getInitialProps()" should resolve to an object. But found "undefined" instead.
안녕 하십니까 제로초님 학습 중에 이런 에러가 발생해서 혼자 해결해보려 했지만 무슨 말인지 잘 모르겠습니다 검색을 하니 저랑 비슷한 에러가 나오신 분이 계셨는데 그분은 임포트 때문에 그러셨다고 했습니다 확인을 하고 제로초님 코드를 비교 해보았지만 자세히 모르겠습니다,,ㅠㅠㅠ 이런 에러 입니다 https://github.com/ansuhwan/nodeBird 깃 주소 입니다!! 이런
-
미해결웹 게임을 만들며 배우는 React에 TypeScript 적용하기
안녕하세요 제로초님 리액트를 어느정도 다룰줄 알고 보는게 좋은지 여쭈어 보고 싶습니다.
안녕하세요 제로초님 이 강의의 선수강좌가 제로초님 리액트 무료강의와, 타입스크립트 강의라고 말씀 해주셨는데 리액트강의 같은 경우는 수강을 하고 있지만 강의 양이 워낙 많아서 다 수강하기에는 어려울것 같고(시간이 촉박해서) 타입스크립트 강의는 이전에 다른 질문을 드렸을때 공식문서만 보고 공부하면서 해도 충분하다고 말씀해주셔서요.. 개인적으로 빠르게 공부하고 클론코딩 강좌로 넘어가고 싶습니다. 그래서 제가 여쭈어 보고 싶은것은 이전에 개인적으로 책을 가지고 독학하면서 타이핑 공부를 해서 hooks까지 개념정도는 이해하고 있으면 이 강의를 진행하는데 무리가 없을까요? ("리액트를 다루는 기술" << 이책으로 블로그에 타이핑 하면서 기본적인 개념정도는 기록해놓고 보고 있습니다.) 그리고 Redux, Mobx, 강의도 결제는 해놨는데 이 강의를 먼저 보고 오는게 좋은가요? 아니면 이해 안가면 따로 보면서 같이 진행해도 되는건가요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
리액트 렌더링 최적화 관련 질문드립니다.
안녕하세요. 렌더링 최적화 관련해서 질문드립니다. const [ modal, setModal ] = useState(false); const modalOpen = useCallback( () => { setModal(true); }, [modal] ); const modalClose = useCallback( () => { setModal(false); }, [modal] ) return ( <div> <Container> <Row> <Col sm={12} md={6}> <WorkList /> </Col> <Col sm={12} md={6}> <BoardList opens={modalOpen} /> </Col> </Row> <Row> <Col sm={12} md={6}> <OrderChart /> </Col> </Row> <Modal show={modal} onHide={modalClose} size="lg" centered > <Modal.Header> <Modal.Title>test</Modal.Title> </Modal.Header> <Modal.Body>test</Modal.Body> <Modal.Footer> <Button variant="secondary" onClick={modalClose}> Close </Button> </Modal.Footer> </Modal> </Container> </div> ); 위 컴포넌트에서 모달을 띄우는것인데 BoardList 컴포넌트에서 모달을 여는 useState함수를 내려줘서 끌어올리는 방식으로 하려하는데 저 BoardList 컴포넌트가 재렌더링되고있습니다. BoardList 컴포넌트는 React.memo를 사용했으나 아무래도 모달을 열때 끌어올려져서 useState가 새로 생성되면서 props가 새로 전달되여 props가 업데이트되어서 BoardList를 재 렌더링하는 현상이 문제인거같은데 이부분을 어떻게 잡으면 좋을까요?
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]
안녕하세요 강사님 헤로쿠 배포에 관해서 질문드려요ㅠㅠ
안녕하세요 강사님 취업준비를 하며 boiler-plate -> 유튜브 -> 쇼핑몰 까지 모두 완강하고 개인프로젝트를 한개 만들어 유튜브의 강사님 헤로쿠배포강의를 듣고 따라 배포했는데 배포도 완료되었고 로그를 보면 오류로그도 없이 잘 배포된거같은데 앱 도메인을 열어보면 hello world만 뜨네요 제가 초보라 아무리 뒤져보고 오류를 잡아내려해도 답이안나와서 지금 답없이 시간만 가고있는데 ㅠㅠㅠ 질문 드려도될까요... 혹시나 싶어 깃헙주소도 올려놓을게요.. https://github.com/bis92/LifeScheduler 읽어주셔서 감사합니다
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
섹션1(노드), 섹션2(리액트) 연결된 내용의 강의인가요?
강의와 관련있는 질문을 남겨주세요.• 강의와 관련이 없는 질문은 지식공유자가 답변하지 않을 수 있습니다. (사적 상담, 컨설팅, 과제 풀이 등)• 질문을 남기기 전, 비슷한 내용을 질문한 수강생이 있는지 먼저 검색을 해주세요. (중복 질문을 자제해주세요.)• 서비스 운영 관련 질문은 인프런 우측 하단 ‘문의하기’를 이용해주세요. (영상 재생 문제, 사이트 버그, 강의 환불 등) 질문 전달에도 요령이 필요합니다.• 지식공유자가 질문을 좀 더 쉽게 확인할 수 있게 도와주세요.• 강의실 페이지(/lecture) 에서 '질문하기'를 이용해주시면 질문과 연관된 수업 영상 제목이 함께 등록됩니다.• 강의 대시보드에서 질문을 남길 경우, 관련 섹션 및 수업 제목을 기재해주세요. • 수업 특정 구간에 대한 질문은 꼭 영상 타임코드를 남겨주세요! 구체적인 질문일수록 명확한 답을 받을 수 있어요.• 질문 제목은 핵심 키워드를 포함해 간결하게 적어주세요.• 질문 내용은 자세하게 적어주시되, 지식공유자가 답변할 수 있도록 구체적으로 남겨주세요.• 정확한 질문 내용과 함께 코드를 적어주시거나, 캡쳐 이미지를 첨부하면 더욱 좋습니다. 기본적인 예의를 지켜주세요.• 정중한 의견 및 문의 제시, 감사 인사 등의 커뮤니케이션은 더 나은 강의를 위한 기틀이 됩니다. • 질문이 있을 때에는 강의를 만든 지식공유자에 대한 기본적인 예의를 꼭 지켜주세요. • 반말, 욕설, 과격한 표현 등 지식공유자를 불쾌하게 할 수 있는 내용은 스팸 처리 등 제재를 가할 수 있습니다. 제가 리액트만 공부하고 싶어서 섹션 2부터 보려고 하는데 섹션1, 2 나눠진 내용인가요 아니면 연달아 봐야하나요?