묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
리액트로 나만의 블로그 만들기(MERN Stack)
몽고DB에서 이미지를 불러오지 못 합니다.
삭제된 글입니다
-
미해결React로 NodeBird SNS 만들기
인피니트 스크롤링에 관한 질문입니다.
안녕하세요 :) 강의 7-11에서 LOAD_MAIN_POSTS_REQUEST가 중복 요청이 되어 useRef를 사용하여 해결을 하셨는데, 해시태그 페이지에서도 같은 문제가 발생해서 git에 올려놓으신 구버전(old branch) 소스코드나 강좌에서 참고하려했지만 useRef를 적용하는 것에 대한 설명이 없었습니다. 그래서 배운 내용을 스스로 적용해보던 와중에 문제가 생겨서 이렇게 질문을 남깁니다. 먼저 제가 수정한 코드는 아래와 같습니다. (제가 코드를 첨부하는데 제가 잘 다루지 못해서 그런지 javascript로 설정을 해도 계속 글씨가 제대로 보이지 않아서 굵은 글씨로 변경했습니다ㅜㅜ) 해시태그 페이지에서도 마찬가지로 LOAD_HASHTAG_POSTS_REQUEST 가 중복요청이 돼서 일단 saga에는watchLoadHashtagPosts의 takeLatest를 throttle로 수정하여 아래와 같은 코드로 바드로 바꿨습니다. function* watchLoadHashtagPosts() { yield throttle(2000, LOAD_HASHTAG_POSTS_REQUEST, loadHashtagPosts); } 그리고 Hashtag.js 는 useRef를 사용하여 아래와 같이 바꿨습니다. import React, { useEffect, useCallback, useRef } from 'react'; import PropTypes from 'prop-types'; import { useDispatch, useSelector } from 'react-redux'; import { LOAD_HASHTAG_POSTS_REQUEST } from '../reducers/post'; import PostCard from '../components/PostCard'; const Hashtag = ({ tag }) => { const dispatch = useDispatch(); const { mainPosts, hasMorePost } = useSelector(state => state.post); const countRef = useRef([]); const onScroll = useCallback(() => { if (window.scrollY + document.documentElement.clientHeight > document.documentElement.scrollHeight - 300) { const lastId = mainPosts[mainPosts.length - 1] && mainPosts[mainPosts.length -1].id; if (!countRef.current.includes(lastId)) { if (hasMorePost) { dispatch({ type: LOAD_HASHTAG_POSTS_REQUEST, lastId, data: tag, }) } countRef.current.push(lastId); } } }, [hasMorePost, mainPosts.length, tag]); useEffect(() => { window.addEventListener('scroll', onScroll); return () => { window.removeEventListener('scroll', onScroll); } }, [mainPosts.length, hasMorePost, tag]); return ( <div> {mainPosts.map(c => ( <PostCard key={+c.createdAt} post={c} /> ))} </div> ); }; Hashtag.propTypes = { tag: PropTypes.string.isRequired, }; Hashtag.getInitialProps = async (context) => { const tag = context.query.tag; context.store.dispatch({ type: LOAD_HASHTAG_POSTS_REQUEST, data: tag, }) return { tag }; }; export default Hashtag; 그리고 버그는 아래와 같은 순서로 실행시키면 발생합니다. 1. 예를 들어 게시물이 25개 가량 있다고 가정을 합니다. 2. http://localhost:3060/hashtag/인프런 페이지에서 10개씩 게시물을 보여주는 인피니티 스크롤링을 한 번 해서 21번째 게시글의 #인프런 해시태그를 클릭합니다. 3. http://localhost:3060/hashtag/인프런 페이지가 로드될 때, 리덕스 devtools를 통해 액션어 어떻게 실행이 되는지 확인해보면 LOAD_HASHTAG_POSTS_REQUEST LOAD_HASHTAG_POSTS_REQUEST LOAD_HASHTAG_POSTS_SUCCESS LOAD_HASHTAG_POSTS_SUCCESS 이런 식으로 동작을 해서 게시물을 2번 로드해서 중복된 게시물이 보이게 됩니다. 4. console.log를 작성해서 확인해보면, 위와 같은 과정으로 실행시켰을 때 Hashtag.getInitialProps에서 뿐만 아니라 onScroll이 한 번더 실행이 돼서 dispatch로 인해 LOAD_HASHTAG_POSTS_REQUEST를 요청하는 것을 확인할 수 있었습니다. 왜 onScroll이 페이지가 새로 로드가 될 때 같이 실행이 되는지 모르겠습니다. 인피니트 스크롤링을 하지 않은 상태의 최신 10개 글 내에서 해시태그를 클릭하거나, 해당 해시태그 페이지를 새로고침하면 위와 같은 버그가 발생하지 않았고, 인피니트 스크롤링을 실행한 후 생성되는 게시물의 해시태그를 클릭하면 버그가 발생합니다.
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
mongoDB cluster collection 조회시 오류가 뜹니다
이러한 오류는 어떻게 해결할 수 있을까요ㅠㅠ...
-
미해결제주코딩베이스캠프 Code Festival: JavaScript 100제
return merge(mergeSort(left), mergeSort(right));
return merge(mergeSort(left), mergeSort(right)); 위 부분이 이해가 안되서 질문 남깁니다. mergeSort(left)를 끝까지 다 돌고 나면 숫자가 하나밖에 안남는데, 어떻게 merge에서는 모든 값이 다 리턴되나요?
-
미해결눈떠보니 코딩테스트 전날
jupyter notebook 사용법
goormide의 url을 통해 들어간 jupyter notebook에서는 !ls, !touch등 명령어가 잘 작동하는데 알고리즘 폴더를 만들고 거기서 powerShell에 jupyter notebook을 입력하고 생성된 url로 들어가면 !ls나 !touch등의 명령어가 'ls'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. 라고 나오며 동작하지 않습니다ㅠㅠ
-
반응형 웹사이트 포트폴리오(Architecture Agency)
간단한 질문 드립니다!
삭제된 글입니다
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
MongooseDB 연결 시 에러가 발생합니다
안녕하세요! 몽고 DB를 접속하려고 하는데 콘솔 출력이 안됩니다ㅠㅠ 강의 보고 똑같이 따라했는데 왜 이런 에러가 뜰까요?ㅠㅠ 한번만 봐주세요! 감사합니다
-
미해결프로그래밍 시작하기 : 파이썬 입문 (Inflearn Original)
형변환 print(int(c)), print(int(d))에서 에러가 뜹니다.
왜 에러가 뜨는 걸까요?
-
미해결홍정모의 따라하며 배우는 C언어
강의 중 오버플로우(overflow)란 warning 이 보이질 않습니다.
결과 값은 수업 진행대로 잘 나오나 output에서 overflow 워닝이 나오질 않습니다. 답변 부탁드리겠습니다. #define _CRT_SECURE_NO_WARNINGS #include <stdio.h> #include <limits.h> //#include <stdlib.h> int main() { unsigned int u_max = UINT_MAX + 1; printf("%u", u_max); //// i to binary representation //char buffer[33]; //_itoa(u_max, buffer, 2); //// print decimal and binary //printf("dicimal:%u\n", u_max); //printf("binary:%s\n", buffer); return 0; } 1>------ Build started: Project: Lecture1, Configuration: Debug Win32 ------ 1>Lecture1.c 1>C:\C\Lecture\Lecture\Lecture1\Lecture1.c(1,1): warning C4005: '_CRT_SECURE_NO_WARNINGS': macro redefinition 1>C:\C\Lecture\Lecture\Lecture1\Lecture1.c : message : see previous definition of '_CRT_SECURE_NO_WARNINGS' 1>Lecture1.vcxproj -> C:\C\Lecture\Lecture\Debug\Lecture1.exe 1>Done building project "Lecture1.vcxproj". ========== Build: 1 succeeded, 0 failed, 0 up-to-date, 0 skipped ==========
-
미해결스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술
안녕하세요! 강의 잘듣고 있습니다!
안녕하세요 좋은 강의 정말 잘 듣고 있습니다. 열심히 공부하여 어떻게든 보답하도록 하겠습니다. 다름이 아니라 크롬에서 단어찾으실때 확장프로그램 사용하시는 것 같은데 혹시 어떤 확장프로그램 사용하시는지 여쭤봐도 괜찮을까요?
-
미해결애플 웹사이트 인터랙션 클론!
두번째 비디오에서 새로고침
안녕하세요 선생님:) 사이트 완성하고 이리저리 눌러보고 새로고침하고 해보는데, 스크롤 끝까지 내렸다가 올렸다가 하다가 두번째 비디오(desc-message) 나오는 부분에서 새로고침할 때 어떨때는 잘 나오다가 어떨때는 맨 마지막에 하단 콘텐츠 추가 부분이 나오는데 버그일까요? 코드를 보내드려야하나욥?ㅠㅠ 제껄로도 테스트해보고, 다운로드 받은 완성파일(7번째 알집)에서 하단 콘텐츠랑 css만 추가해서 테스트해봐도 새로고침에 잘 됐다 안됐다해가지구요 ㅠㅠ
-
미해결스프링 시큐리티
안녕하세요
안녕하세요. 강의 잘 듣고 있습니다. 다름이 아니라 출처 남기고 공부한 내용을 블로그에 정리해도 될까요?
-
미해결스프링 부트 개념과 활용
spring.profiles.active같은 설정 프로퍼티
spring.profiles.active같은 설정 프로퍼티를 사용하려면 어디를 찾아봐야 하나요 ? 어떤 원리가 있는건가요 아니면 기냥 외우면 되는걸까용.. ?
-
미해결프로그래밍 시작하기 : 파이썬 입문 (Inflearn Original)
연산 출력할 때 형식 질문
print("i1 + i2 : " , i1 + i2) print("f1+ f2 : " , f1 + f2) print("big_int1 + big_int2 : ", big_int1 + big_int2) 여기서 앞부분은 왜 "a+b : " 의 형식으로 적어주는지 궁금합니다. 그리고 파이썬에서는 = 대신 : 이 사용되는 건가요?
-
미해결몇 줄로 끝내는 인터랙티브 웹 개발 노하우 [초급편]
픽스낫띵 핵심기능구현 문의요
핵심기능구현인데 왜 여자만 움직이고 3d text 구현은 빠져있는건가요?? 이거 과장 광고 아닌가요?? 강의소개에는 텍스트함께 움직이는거로 봤어요;;; 마우스로 다 하는거다 이러면 끝인가요;;;
-
해결됨스프링 시큐리티
강사님~~ 강의 잘 듣고 있습니다~
너무 좋네요! 다음 강의를 만드실때 더 좋은 강의가 되도록 ㅠㅠㅠㅠ 마이크 볼륨을 일정하게 해주셨으면 좋겠습니다 ㅠㅠㅠ 이전 강의 끝나고 이 강의 틀자마자 소리가 엄청 크게 나서 깜짝놀랬습니다;ㅎㅎㅎㅎ 그럼 강의 잘듣겠습니다 감사합니다!
-
해결됨따라하며 배우는 도커와 CI환경 [2023.11 업데이트]
배포환경에서 MongoDB의 key값 보안 설정 질문
안녕하세요 강사님 강사님의 강의를 듣고 일주일간 고생한 끝에 MovieApp을 도커 기반으로 배포하는데 성공했습니다. 다만 배포환경에서 MongoDB와 연동하는 것을 계속 실패해서 gitignore로 숨긴 dev.js를 git에 push하여 배포하였습니다. MongDB와의 연동 URL을 은닉하는 부분에 어려움이 있어 질문드립니다. 기본강의에서 강사님께서 언급하시기를, 배포환경에서는 heroku를 사용해서 MongoDB의 연동 URL을 은닉하라고 하셨습니다. 그런데 Docker 강의를 통해 배포하는 것을 배웠기 때문에 Travis CI 활용해서 해당 URL을 은닉하고자 노력 중입니다. 강의에서 관련 내용으로, AWS나 Docker Hub 정보를 Travis CI의 more options/Environment Variables에서 관리하는 부분을 최대한 참고해서 시도 중입니다. 문제는 해당 URL을 Travis CI 웹사이트에 입력하고 .traivs.yml에서 해당 정보를 받을 수는 있으나, 이것을 자바스크립트 파일로 옮겨오는 것입니다. 구글링한 결과 yml to javascript 번역 npm 모듈이 있어서 이것을 활용할까 했습니다. 하지만 왠지 이것보다 더 좋은 방법을 강사님께서 아시지 않을까하여 질문드립니다. 많이 바쁘신 와중에도 항상 질문에 답변해셔서 감사합니다!
-
미해결스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술
안녕하세요 팀장님. 몇가지 질문이 있습니다.
안녕하세요 팀장님. 스프링을 공부하여 이쪽으로 취업을 하고싶은 대학생입니다. 다름이 아니라 스프링이라는 언어를 처음 접하는데, 이번에 이 강의를 듣고 정말 좋은 것 같다고 생각하여 팀장님 로드맵을 따라 학습을 하려고 합니다. 이번에 스프링 관련하여 강의를 몇개 더 준비 중 이라고 하셨는데 그걸 듣기 전에 스프링부트와 JPA실무 완전 정복 로드맵을 먼저 들어도 괜찮을까요? 아니면 스프링 핵심기술과 MVC패턴 이런것들을 먼저 학습하고 듣는게 좋을까요? 감사합니다!
-
미해결단 두 장의 문서로 데이터 분석과 시각화 뽀개기
도와주세요. 강사님
못보 신것 같아 다시 문의 드립니다. 답변 고맙습니다. DATA 불러오기 문제가 있어서 설명 부탁 할께요. 우선 회사에서 구글 사용해서 colab를 사용하고요. Spreadsheet를 불러와서 판다스 활용합니다. 그래서 gsspread(https://gspread.readthedocs.io/en/latest/api.html)설명서를 참고 하는데요. 그 부분에서 get_all_values와 가get_all_records 차이를 파악하다, 2번째 질문을 하였습니다. 현재 데이타 볼러올 때의 문제점은 Spreadsheet 아래 날짜를 읽어올 때, datatype이 int64로 바뀌고요 get_all_values(value_render_option='UNFORMATTED_VALUE') 일자 출금 2019. 10. 31 0 2019. 10. 31 1,000 2019. 10. 31 18,000 2019. 10. 31 57,450 그래서 다시 datetime으로 변경하면 df['일자'] = pd.to_datetime(df['일자']) 전혀 다른 날짜(시간포함해서)가 아래와 같이 나옵닙니다. 다른 숫자나 text는 int,object로 불러와서 이상 없이 보이는데, date는 sheet 자체에서 어떤 날짜 포맷으로 저장 문제인지 아님 api 자체내에서 불러올때 type를 지정 해야 되는 문제인지 몰라서요. 설명 해 주시면 감사하겠습니다
-
미해결웹 게임을 만들며 배우는 React
처음 실행할 때에 아무 설치없이도 실행되어야 하는 게 맞나요?
1-2강 들은 후 저도 처음 실행해보려는데 index.html 경로 찾아 들어가서 열면 되는 건가요? 그렇게 했는데 안되더라고요. 실행하는 모습은 안 보여주셔서 어떻게 해야 하는지 잘 모르겠습니다. 위쪽에 추가했던 <script crossorigin ~으로 시작하는 코드 두줄이 설치하는 대신 그 역할을 해주는 것인 줄 알았는데 그게 아니라 제가 따로 react랑 react dom 도 모두 설치해야 하는건가요?