velopert

velopert

개발은 언제나 즐겁고 재밌어야 한다는 생각을 갖고 있는 개발자이며, 가르치는것을 굉장히 좋아하는 교육자이기도 합니다.

Member Since 5 years ago

@laftel-team ,

Experience Points
2.6k
follower
Lessons Completed
22
follow
Lessons Completed
89
stars
Best Reply Awards
79
repos

548 contributions in the last year

Pinned
⚡ [길벗] 리액트를 다루는 기술 서적에서 사용되는 코드
⚡ velofolio is yet another U.S. Stock backtest simulator tool. You can easily share your backtest or explore other's backtest within service. This service is currently in beta stage.
⚡ Simulated cryptocurrency trading system
⚡ 벨로퍼트와 함께하는 모던 리액트 튜토리얼 문서
Activity
Jan
16
2 days ago
started
started time in 2 days ago
Jan
15
3 days ago
started
started time in 3 days ago
Jan
6
1 week ago
started
started time in 1 week ago
Dec
29
2 weeks ago
Activity icon
issue

velopert issue comment velopert/learning-react

velopert
velopert

9.4.5 반응형 디자인 251 p 미디어 쿼리 모듈화 하기

샘 안녕하세요 스타일 컴포넌트 251p 마지막 단락에 '다른 파일로 모듈화 한뒤 여기저기 불러와 사용하는 방식이 훨씬 편할 것입니다.' 라고 해주셨는데요.. 프로젝트에서 util 디렉토리에 만들어주어 사용하고싶은데 함수를 이리저리 만져봐도 방법을 잘 모르겠습니다. 어떻게 좀더 실용적으로사용 할 수있을까요. ㅠ

Activity icon
issue

velopert issue velopert/learning-react

velopert
velopert

4장 문맥, 어법 교정

  • p.132 상3행 문맥 교정 this를 컴포넌트 자신으로 제대로 가리키기 위해서는 → this가 컴포넌트 자신을 제대로 가리키도록 하기 위해서는

  • p.132 상12행 문장부호 교정 수정해야 하기 때문인데요. → 수정해야 하기 때문인데요,

  • p.140 하2행 문장부호 교정 배워 보았는데요. → 배워 보았는데요,

Activity icon
issue

velopert issue comment velopert/learning-react

velopert
velopert

4장 문맥, 어법 교정

  • p.132 상3행 문맥 교정 this를 컴포넌트 자신으로 제대로 가리키기 위해서는 → this가 컴포넌트 자신을 제대로 가리키도록 하기 위해서는

  • p.132 상12행 문장부호 교정 수정해야 하기 때문인데요. → 수정해야 하기 때문인데요,

  • p.140 하2행 문장부호 교정 배워 보았는데요. → 배워 보았는데요,

velopert
velopert

감사합니다 :)

~데요. 관련해서는 출판사에 문의해볼게요!

Activity icon
issue

velopert issue comment velopert/learning-react

velopert
velopert

1장 문맥, 어법 교정

  • p.037 하3행 문장 성분 수정 어떻게 작동하는지 객체를 → 어떻게 작동하는지에 대한 정보를 지닌 객체를 or 어떻게 작동하는지 알고 있는 객체를

  • p.040 하12행 문맥 수정 이런 문제를 해결하려면 DOM을 아예 조작하지 않을 수 없겠지요? → 이런 문제를 해결하려고 DOM을 아예 조작하지 않을 수는 없겠지요?

  • p.048 상2행 문장 성분 수정 코드를 수정할 때는 사용할 → 코드를 수정할 때 사용할

velopert
velopert

ㅎㅎ 이런 실수들이 있었군요..! 꼼꼼히 봐주셔서 감사합니다 :) 다음 인쇄때 반영됩니다.

Activity icon
issue

velopert issue velopert/learning-react

velopert
velopert

1장 문맥, 어법 교정

  • p.037 하3행 문장 성분 수정 어떻게 작동하는지 객체를 → 어떻게 작동하는지에 대한 정보를 지닌 객체를 or 어떻게 작동하는지 알고 있는 객체를

  • p.040 하12행 문맥 수정 이런 문제를 해결하려면 DOM을 아예 조작하지 않을 수 없겠지요? → 이런 문제를 해결하려고 DOM을 아예 조작하지 않을 수는 없겠지요?

  • p.048 상2행 문장 성분 수정 코드를 수정할 때는 사용할 → 코드를 수정할 때 사용할

Activity icon
issue

velopert issue velopert/learning-react

velopert
velopert

6장 문맥, 어법 교정

  • p.167 상8행, 상11행 문장부호 수정 사용했는데요. → 사용했는데요, 불변성 유지라고 하는데요. → 불변성 유지라고 하는데요,
Activity icon
issue

velopert issue comment velopert/learning-react

velopert
velopert

6장 문맥, 어법 교정

  • p.167 상8행, 상11행 문장부호 수정 사용했는데요. → 사용했는데요, 불변성 유지라고 하는데요. → 불변성 유지라고 하는데요,
velopert
velopert

저도 , 로 끝나는게 맞는 것 같은데 출판사에선 모두 . 으로 끝나게 수정했더군요!

이건 한번 문의를 드리겠습니다.

Activity icon
issue

velopert issue velopert/learning-react

velopert
velopert

5장 문맥, 어법 교정

  • p.154 상7행 문장 성분 수정 scrollHeight에서 clientHeight 높이를 빼면 되겠지요? → scrollHeight에서 clientHeight를 빼면 되겠지요?

  • p.155 하8행 오탈자 수정 this.scrollBox.scrollBottom → this.scrollBox.scrollToBottom

Activity icon
issue

velopert issue comment velopert/learning-react

velopert
velopert

5장 문맥, 어법 교정

  • p.154 상7행 문장 성분 수정 scrollHeight에서 clientHeight 높이를 빼면 되겠지요? → scrollHeight에서 clientHeight를 빼면 되겠지요?

  • p.155 하8행 오탈자 수정 this.scrollBox.scrollBottom → this.scrollBox.scrollToBottom

velopert
velopert

감사합니다. 반영됐습니다.

Dec
7
1 month ago
Activity icon
issue

velopert issue comment velopert/dealing-with-react-native

velopert
velopert

DayLog 예제 reduce 함수부분 오류

안녕하세요 벨로퍼트님!

실습 다이어리 만들기 - daylog 부분 실습 마지막 부분에 AsyncStorage 부분까지 끝내고 앱을 다시 리로딩 하니까 다음과 같은 에러가 뜹니다.

Reduce of empty array with no initial value

찾아보니 처음에 빈배열로 들어와서 생기는 오류 같은데, 어떤식으로 바꿔줘야 하나요? 아니면 제가 어떤 부분을 놓친걸까요...?

  const markedDates = useMemo(
    () => logs.reduce((acc, current) => {
      const formattedDate = format(new Date(current.date), 'yyyy-MM-dd')
      acc[formattedDate] = { marked: true }
      return acc
    })
    , [logs])
velopert
velopert

reduce에 두번째 파라미터가 없네요!

  const markedDates = useMemo(
    () =>
      logs.reduce((acc, current) => {
        const formattedDate = format(new Date(current.date), 'yyyy-MM-dd');
        acc[formattedDate] = {marked: true};
        return acc;
      }, {}),
    [logs],
  );
Activity icon
issue

velopert issue velopert/learning-react

velopert
velopert

p309 TodoListItem React.memo 두번째 파라미터에 관한 설명

p309에 그리고 .... 그대로 유지하도록 설정을 했습니다.

부분의 설명을 제거합니다.

옛날에 잘못 들어간 내용인데 이번 중쇄때 코드만 고치고 설명이 제거가 안됐었습니다.

Nov
10
2 months ago
Activity icon
issue

velopert issue velopert/learning-react

velopert
velopert

리액트 라우터 v5 -> v6 업데이트 공지

리액트 라우터가 v5 -> v6으로 업데이트되었습니다.

우선, 어떤것들이 바뀌었는지 확인하기 위해선 이 영상을 참고해주세요: https://www.youtube.com/watch?v=CHHXeHVK-8U

이 책에 있는 예시들은 v5 를 사용해만 정상작동합니다.

책에 있는 수록된 내용에서 리액트 라우터를 설치하게 될 때 다음 명령어로 설치를 해주세요.

yarn add [email protected]

만약 이미 v6을 설치하셨고, 개발서버가 실행중인 상태에서 위 명령어를 실행하셨다면, 개발서버를 껐다가 다시 켜주셔야 합니다.

추후에는 v6에서 v5의 API가 하위호환되는 패키지가 만들어진다고 합니다. 해당 패키지가 나오면 여기에 댓글을 달겠습니다.

추가적으로, v6 튜토리얼은 새로 작성하여 블로그에도 작성하고, 책을 개정할때 반영할 예정입니다.

감사합니다!

Activity icon
issue

velopert issue comment velopert/learning-react

velopert
velopert

mongoose.connect 일부 옵션 deprecated 이슈

안녕하세요 벨로퍼트님

22.3.2 예제에 사용된 useNewUrlParser, useFindAndModify 옵션은 더 이상 지원되지 않아 에러가 발생합니다. mongoose 6버전 이후로는 해당 옵션이 각각 true와 false로 이미 설정된 것처럼 작동한다고 합니다. reference: No More Deprecation Warning Options

velopert
velopert

알려주셔서 감사합니다. 다음 인쇄때 반영하겠습니다.

Activity icon
issue

velopert issue comment velopert/learning-react

velopert
velopert

24.2.6 회원 인증 에러 처리하기 관련하여..

회원 인증 에러메시지를 띄우는 부분에서 로그인에러, 또는 회원가입 에러를 낸 상태에서 로그인페이지 링크를 누르거나 회원가입페이지 링크를 눌러서 이동하면, 에러메시지 박스가 없어지지않고, 남아있습니다.

즉, 로그인페이지에서 "로그인 실패" 라는 메시지를 띄고있는 상태에서 회원가입 페이지로 넘어가면 "회원가입 실패" 라는 에러메시지가 남아있는 현상입니다. 여기서 다시 로그인페이지로 가면 에러메시지는 사라집니다! 최초 1회만 이렇습니다.

useEffect에서 initializeForm함수를 디스패치해서 분명 authError를 null로 만들어줄텐데, 왜 이런 현상이 일어나는지 모르겠습니다.

그래서 혹시 제가 오타를 냈나 싶어서 여기있는 소스를 그대로 긁어서 비교해봤지만 딱히 제가 오타를 낸것도 아니었습니다. reudx 개발자 툴을 이용해 State를 확인해봐도.. authError가 남아있진 않은데 왜 이런 현상이 나타날까요?

velopert
velopert

늦게 답변드려 죄송합니다.

  // 컴포넌트가 처음 렌더링 될 때 form 을 초기화함
  useEffect(() => {
    dispatch(initializeForm('login'));
  }, [dispatch]);

  useEffect(() => {
    if (authError) {
      console.log('오류 발생');
      console.log(authError);
      setError('로그인 실패');
      return;
    }
    if (auth) {
      console.log('로그인 성공');
      dispatch(check());
    }
  }, [auth, authError, dispatch]);

다시 보니 코드상에 문제가 있었는데요, 위 코드에서 useEffect의 cleanup함수에서 initialize를 한다면 에러가 해결됩니다.

LoginForm

  useEffect(() => {
     return () => dispatch(initializeForm('login'));
  }, [dispatch]);

RegisterForm

  useEffect(() => {
    return dispatch(initializeForm('register'));
  }, [dispatch]);
Activity icon
issue

velopert issue comment velopert/learning-react

velopert
velopert

24.2.6 회원 인증 에러 처리하기 관련하여..

회원 인증 에러메시지를 띄우는 부분에서 로그인에러, 또는 회원가입 에러를 낸 상태에서 로그인페이지 링크를 누르거나 회원가입페이지 링크를 눌러서 이동하면, 에러메시지 박스가 없어지지않고, 남아있습니다.

즉, 로그인페이지에서 "로그인 실패" 라는 메시지를 띄고있는 상태에서 회원가입 페이지로 넘어가면 "회원가입 실패" 라는 에러메시지가 남아있는 현상입니다. 여기서 다시 로그인페이지로 가면 에러메시지는 사라집니다! 최초 1회만 이렇습니다.

useEffect에서 initializeForm함수를 디스패치해서 분명 authError를 null로 만들어줄텐데, 왜 이런 현상이 일어나는지 모르겠습니다.

그래서 혹시 제가 오타를 냈나 싶어서 여기있는 소스를 그대로 긁어서 비교해봤지만 딱히 제가 오타를 낸것도 아니었습니다. reudx 개발자 툴을 이용해 State를 확인해봐도.. authError가 남아있진 않은데 왜 이런 현상이 나타날까요?

velopert
velopert

늦게 답변드려 죄송합니다.

다시 보니, 코드상에 문제가 있습니다.


Activity icon
issue

velopert issue comment velopert/learning-react

velopert
velopert

리액트를 다루는 기술 - 13장 서브라우트 문의

안녕하세요.

리액트를 다루는 기술 2판을 보고 있으며 13장 서브라우트에서 문의가 있어 이슈를 발행합니다.

https://thebook.io/080203/ch13/05-02/

책의 내용대로 구현 후 테스트 도중에 velopert와 gildong을 번갈아서 클릭해보면 뒤에 주소가 자꾸 붙는걸 볼 수 있는데요. ex) velopert 클릭 - http://localhost:3000/profiles/velopert gildong클릭 - http://localhost:3000/profiles/profiles/gildong

이건 어떻게 해결이 가능할까요? (혹시 이 부분이 책 뒷 부분에 나오나요?

velopert
velopert

작성하신 Profiles 컴포넌트를 여기에 올려주실수있을까요?

"/profiles/velopert"

링크에 이런식으로 맨 앞에 / 가 잘 있는지 확인해주세요.

Previous