인프런에서 8년째 지식을 공유하고 있습니다. 🏠 기술블로그, 📣 트위터, 💻 깃헙
📗 Do it! Vue.js 입문, 쉽게 시작하는 타입스크립트, 나는 네이버 프런트엔드 개발자입니다. 책 3권 집필
📖 Cracking Vue.js, 타입스크립트 핸드북, 웹팩 핸드북. 온라인 무료 가이드북 3권 집필
👨💻 캡틴판교의 프론트엔드 개발 유튜브 채널 운영 - 취준생, 주니어 개발자들의 고민을 들을 수 있는 곳
🥤 캡틴판교의 카카오톡 오픈 채팅방 운영 - 프런트엔드 개발 최신 정보와 업계 동료들의 생각과 고민을 들을 수 있는 곳
👨🏼🏫 인사말
안녕하세요 인프런 지식 공유자 캡틴판교입니다. 프런트엔드 개발과 관련해서 고민 있으신 분들 편하게 연락 주세요. 프런트엔드 개발자로 진로를 고민하시는 분들 모두 환영합니다. 저의 경험과 조언이 도움이 될 수 있는 분들과 얘기 나눌 수 있으면 좋겠습니다 :)
🔎 가능한 멘토링 분야
- 프런트엔드 개발자로 성장하는 방법
- 프런트엔드 개발자 취업준비
- 이직 준비(이력서, 포트폴리오 등)
- 퍼블리셔에서 프런트엔드 개발자로 직무 전환하기
- 프런트엔드 개발 분야 학습 방법
- 기타 개발자로서 진로에 대한 고민 모두
※ 참고 : 네이버 채용 전형을 진행 중이신 분들은 멘토링이 어렵습니다. 이 멘토링은 네이버와 직접적인 연관이 없으며 IT 업계 선배/동료 개발자로서 진행될 예정이니 참고해 주세요 :)
📚 멘토링을 신청하기 전에 꼭 해야할 일
멘토링을 신청하시기 전에 아래 설문 조사를 꼭 작성해 주시고 신청해 주세요. 아래 설문 조사는 멘티 분들의 사전 준비를 돕고 멘토링을 효과적으로 진행하기 위한 장치입니다.
멘토링 사전 질문지(멘토링 신청하실 때 사전 질문지 작성 여부 꼭 같이 얘기해 주세요 ^^)
🏃🏻♀️ 진행 방식
편하게 대화 형식으로 진행하려고 합니다. 제가 별도로 준비하는 건 없고, 멘토링을 신청해 주시는 분들께서 함께 얘기해봤으면 하는 질문들과 주제를 가져오시면 편하게 같이 대화 나눌 수 있을 것 같아요. 주로 진로, 구직, 업무, 프런트엔드 개발 학습 방법에 대한 고민이 많으실 텐데 그냥 편한 친구나 선배와 대화를 나눈다고 생각해 주시면 좋을 것 같아요 :)
📚 멘토링에 필요한 준비
영상 통화 플랫폼인 줌을 이용합니다. 신청해 주신 멘토링 시간 전에 미리 영상 통화(영상은 필수로 켜지 않으셔도 됩니다)를 진행할 수 있는 환경으로 테스트 및 준비해 주세요 :) 가급적 멘토링에 집중할 수 있는 조용한 공간에서 소음 없이 대화할 수 있는 환경으로 준비해 주시면 좋을 것 같습니다 :)
취직, 이직 준비 관련 상담을 원하신다면 랠릿(Rallit)에 간단한 이력서를 첨부한 후 공유해 주세요. 멘토링 시간을 더 효율적으로 활용하실 수 있습니다 :)
🏃🏻♀️ 멘토링 진행 안내
멘토링 신청이 되셨으면 멘토링 당일 날 시작하기 전에 메일과 카카오톡 메시지로 줌 링크를 안내드릴 예정입니다. 멘토링 시작 시간 전에 꼭 메일과 카카오톡을 확인해 주세요 :)
🔎 프런트엔드 개발 상담소 안내
오픈 멘토링도 괜찮으시다면 아래 글 보시고 유튜브 상담소 방송(무료)으로 오셔서 궁금하신거 편하게 질문하셔도 좋습니다 :)
🍔 카카오톡 오픈 채팅방
500명 이상의 FE 개발자들이 대화 나누는 방입니다. 와서 편하게 질문해 주세요 :)
https://open.kakao.com/o/ghib5Brf
강의
로드맵
전체 5수강평
- 만들면서 배우는 리액트: 컴포넌트 설계와 리팩토링
게시글
질문&답변
컴포넌트가 렌더링되어 HTML이 생성되는 곳 (getServerSideProps VS useEffect)
안녕하세요 제가 답변이 넘 늦어서 죄송합니다 🙂 네 말씀해 주신 대로 이해하셔도 될 것 같아요. 좀 더 정확히 정리해 보자면FE 서버 : 서버 사이드에서 화면을 그리는 곳이 넥스트 서버클라이언트 : 하이드레이션까지 완료한 최종 화면을 보는 곳이 브라우저요렇게 봐주시면 될 것 같네요 :)
- 0
- 1
- 115
질문&답변
<img /> 요소 대신 <Image /> 컴포넌트를 사용해야 하는 이유 (성능 최적화)
안녕하세요, 제가 답이 늦었네요 🙂 네 이미지 컴포넌트는 넥스트에서 추가적으로 캐싱이나 프리로딩 기능 등을 제공합니다. 요거는 대용량 트래픽을 받으시는게 아니라면 쓰시는게 좋아요 :)
- 0
- 2
- 124
질문&답변
ESLint + Prettier 설정 관련해서 질문있습니다
안녕하세요, 혹시 formatOnSave 기능을 끄셨나요? 저장했을 때 ESLint에 설정된 프리티어로 먼저 1차 수정하고, 2차로 프리티어 자체로 포매팅을 하는 경우 위와 같이 나올 수 있습니다 :)
- 1
- 2
- 159
질문&답변
live server 설치 오류
안녕하세요, VSCode 확장 플러그인에서 검색해 보시겠어요?(사진)
- 1
- 2
- 95
질문&답변
프로젝트 생성 관련 가이드 영상은 왜 없는건가요
안녕하세요 재혁님, 요것도 답변 드릴게요.먼저 React와 Vue 프로젝트 모두 별도의 생성 절차를 안내하지 않은 이유는 강의의 핵심에서 벗어난다고 생각했기 때문입니다. 각 프레임워크의 프로젝트 생성 절차는 제 다른 강의들에서 확인하실 수 있어요. 만약, 여기서 바로 확인하시고 싶으면 아래 2개 문서 참고해 주시면 됩니다 :) Vue 프로젝트 생성 절차React 프로젝트 생성 절차
- 1
- 3
- 93
질문&답변
JSX.Element 컴포넌트 타입 정의 관련 재 질의
안녕하세요, 재혁님. 제가 답이 좀 늦었네요. 질문 주신거 짧게 답변 드리면 일단 리액트 컴포넌트 반환 타입은 자동 추론되는 JSX.Element를 쓰시면 됩니다.말씀하신 React.FC는 예전 문법의 잔재로 남아 있었다고 봐주시면 될 것 같아요. 컴포넌트 반환 타입은 명시해서 얻는 이점이 거의 없기 때문에 자동 추론 되는 타입으로 쓰시면 됩니다 :)
- 1
- 2
- 77
질문&답변
JSX.Element 컴포넌트 타입 정의 관련 재 질의
안녕하세요 재혁님, 강의 들으시면서 궁금한게 많아 답답하신거 같은데요. 제가 지금 개인 일정으로 해외에 있어서 차주 월요일에 돌아가는대로 답변 드릴게요. 조금만 기다려주세요 :)
- 1
- 2
- 77
질문&답변
state 변경에 따른 리랜더링 범위가 어떻게 되는 건가요?
안녕하세요, 제가 답이 늦었네요 🙂 state의 변화를 모든 컴포넌트가 감지하지 못하고 있어서 그렇습니다. 리팩토링 한 이후에는 상위 컴포넌트에서 하위 컴포넌트로 변화된 state를 내려주기 때문에 감지가 가능하다고 보시면 되어요 :)
- 1
- 2
- 245
질문&답변
vue3로 따라오시다가 import axios 에러 뜨시는 분들
감사합니다 🙂
- 2
- 2
- 314
질문&답변
vuex 실행시 새로고침해야지만 리스트에 나타나는 현상
안녕하세요, 제가 확인이 늦었네요. 요건 코드 올려주시면 도와드릴 수 있을 것 같아요 :)
- 1
- 2
- 275