프론트엔드 ・ Novice
클론코딩의 정석 react-native로 네이버웹툰 만들기
react-native로 네이버웹툰 만들어보기
react-native 관련모듈 contributor
3:1 피드백
넘블 인증서
23.02.27 ~ 23.03.122주
26.02.26 까지
당신의 시간은 넘블이 아껴드립니다! 30초 요약해볼게요!
하나. ios & android 한번에 개발 가능한 react-native를 활용하여 네이버웹툰을 클론코딩해보는 챌린지입니다.
둘. 가이드라인을 통해 챌린지 진행에 필요한 구현범위 및 기능을 제공합니다.
셋. 동일한 프로젝트를 진행하고 있는 다른 참가자들과 소통과 공유를 통해 더 많은 성장을 이뤄낼 수 있습니다.
넷. 중견 스타트업 4년차 Frontend lead인 현직자가 TOP3에게 세부 피드백을 제공하고 상위권 결과물 및 피드백은 참가자 모두에게 공유됩니다.
챌린지 호스트
이번 챌린지 호스트는 Brayan입니다.
- 400억 이상 투자받은 중견 스타트업 4년차 프론트엔드 lead.
- react-native 관련모듈 contributor(react-native-foreground-service, react-native-sensor-step)
- stackoverflow 12,000 점 이상
구체적인 챌린지 내용
네이버 웹툰의 목록 화면을 표현해보는 챌린지입니다.
자세한 내용이 궁금하면 토글 버튼을 눌러주세요!
개발할 주요 화면(예시 화면)
- 가이드라인에는 실제 네이버웹툰을 기반으로 작성되어 있습니다.
구현범위
- 네이버 웹툰의 목록 화면을 표현하는게 목표입니다.
- 목록화면 구성시 필요한 기능들을 구현하게 됩니다.
- 제시된 기능외에 웹툰에서 제공하는 기능은 작업하지 않으셔도 됩니다.
구현 기능
- 구현 기능 설명화면
- 빨간색 숫자가 아래 구현 기능과 관련된 화면입니다.
- 상단 헤더 (쿠키 , 돋보기 고정)
- 스크롤시 Header , Footer 노출 , 최상단 스크롤시 미노출
- 가로 swipe 화면 구현
- 요일별 목록 화면 (좌 우 swipe가능)
- 숫자가 이미지 위로 노출되도록 가로 슬라이드 구현
- 3가지 묶음 가로 슬라이드구현
- 하단 탭 구성 (Main , My )
- 하단 탭 마이 부분 좋아요 목록 구현 (상단탭 x) - 실제 관심 목록과 연관 x, 랜덤데이터 노출
- 상세 페이지 (관심 버튼클릭시 등록하겠냐 묻는 alert 노출)
- 상세 설명 처음 가려짐, arrow 버튼 클릭시 보여지게 노출
권장
- 오픈소스 라이브러리를 사용해 구현 권장
가산점
- 앱 시작시 노출되는 (warn,error) 로그가 적을시 가산점
- typescript 사용시 가산점
- 요일이 가려질때 요일이 같이 보여지면 가산점
- 상단 하단 노출이 animation을 이용하여 노출시 가산점
데이터 및 이미지 사용 URL
- 데이터
- 이미지
챌린지 대상
🖐️챌린지에 관해서 질문이 있어요
- 이번 챌린지를 통해 성장할 수 있는 역량은 무엇인가요? → 이번 챌린지를 통해 아래의 것들은 분명 얻어가실 수 있습니다!
- react-native의 기본적인 작동에 대해 이해 능력
- android , ios 개발 역량
- 회사에서 요구하는 기본 화면 및 기능에 대해 구현이 가능
- Javascript로 할 수 있는 범위 증대
특히, 이 과정을 완료하신다면 RN에서 가장 많이 사용되는 화면을 만드시게 되며, 회사에서 바라는 디자인에 맞추어진 화면에 대한 이해도가 높아지고 그 화면을 만드는데에 있어 두려움이 적어질 것입니다.
- 이번 챌린지에서 고민해봐야할 포인트는 무엇인가요?
→ 이번 챌린지를 딱 봤을 때,기능으로만 보면 간단하다고 느껴질 수 있습니다. 그러나 상단에 고정하는 기능이나 스크롤시 노출되는 상하단 컴포넌트, 세로 스크롤 화면에서 가로 swipe가 되는 컴포넌트의 구성등 고민해야할 요소가 많습니다.
위와 같은 기능들을 구현하면서 고민할 요소들을 짚어낸다면 더욱 성장할 수 있을 것입니다.
위 질문들 외에도 궁금하신 점이 있으시다면 챌린지에 참여하셔서 호스트님과 소통하시면 됩니다.
넘블과 함께 챌린지에 도전하여 더 성장해보세요!
평가방식
- 심사기준은 다음과 같아요.
넘블 X 네이버 클라우드 파격 혜택
넘블 챌린지에 참여하는 넘블러님들께는 최대 100만원의 네이버 크레딧을 지급해요!
자세한 내용은 다음과 같아요
네이버 클라우드 신규 가입(10만원)+넘블 챌린지에 참여하는 모든 넘블러(20만원)+챌린지 회고록을 작성하는 넘블러(70만원)
챌린지에 참여하시는 넘블러님이실 경우 바로 20만원 크레딧을 드리며, 회고록을 작성할 넘블러님들께는 70만원의 크레딧을 추가로 드려요.
단, 20만원 크레딧을 받으실 경우 챌린지 종료 후 약 2~3분 정도 소요되는 설문조사를 작성해주셔야해요!
회고록은 많이 작성해야되나요? 부담스러운거 아닌가요?
아니요! 자신의 프로젝트를 돌아보며 회고하며 성장하는 것을 목표로 간단히 작성해주시면 됩니다! 정해진 양식은 없지만 프로젝트 미션, 어려웠던 부분, 해결방법, 아쉬웠던 부분, 사용한 기술스택, 사용해보며 느낀 기술스택의 장단점 등을 간단하게 velog나 블로그, 혹은 노션 등에 작성해주시길 권장드려요!
이 때 네이버 클라우드에 대해 피드백(ex. 장단점)을 간단하게만 추가해주시면 돼요😊
회고록을 대충 작성했다고 크레딧을 회수하지 않으니 걱정하지 마세요😊
보상
상위 3명에게 호스트의 피드백
서면 피드백+온라인 3:1 피드백 제공
자세한 내용은 다음과 같아요
일시: 3월 25일 오전 10시-오전11시
(넘블측에서 조율 가능, 사정에 따라 변동 가능)
방법: 호스트와 상위 3명이 온라인상에서 각자의 결과물을 보며 피드백 미팅 진행
운영방법
참여자들끼리 함께 하기에 특별한 넘블 챌린지
자세한 내용이 궁금하면 토글 버튼을 눌러주세요!
참여자분들은 모두 디스코드에 초대돼요.
1) 같은 미션을 선택하신 넘블러들끼리 서로 소통하시고 프로젝트에 필요한 인사이트를 공유하시라고 디스코드 채널을 개설해드립니다. 프로젝트 중간중간에 성실하게 소통해주신 분들 중 3분을 선정해 경품이 나갈 예정입니다.
2) 참가자들의 결과물은 디스코드 결과물 공유 채널에서 공유됩니다.
💰 환불 기준
챌린지 오픈 전날까지는 결제하신 금액 100% 환불 가능합니다. 하지만 챌린지 오픈당일부터는 환불 불가합니다.
- ~ 챌린지 시작 전날 자정(23:59) 전까지
- 환불 100% 가능
- 챌린지 시작날 이후
- 환불 불가