1. React_instagram

서동찬·2020년 8월 20일
0

인스타그램 클론 프로젝트


기관 : Wecode

인원 : 2명 (개인 프로젝트)

  • 담당 업무 : 프론트 앤드

기간 : 2020. 06. 28 ~ 2020. 07 .03

프로젝트 목적 :

  • React 기술로 활용한 실제 인스타그램 구현 프로젝트
  • React의 기본인 LifeCycle과 state/props를 이해하기 위하여 Class형 컴포넌트 적용
  • scss를 활용하여 요소들의 스타일 적용.
  • 백앤드 (서버) 비동기 통신 이해를 위해 Javascript 내장객체 fetch 함수 활용

개발 환경 : 프론트 앤드 기준

  • React (Class Component)
  • javascript (fecth 함수)
  • HTML
  • CSS
  • Git

담당업무 :

1) 로그인

  • state를 활용하여 이메일, 비밀번호 입력 가능

  • 이벤트 함수와 state를 이용하여 입력 제한 기능

  • css와 이벤트함수를 이용한 로그인 버튼 동적으로 변형 기능

  • fetch 함수를 이용한 서버와 api 통신

2) 인스타그램 메인 화면

  • 상단 Nav컴포넌트(네비게이션)과 왼쪽 컴포넌트(스토리, 게시물), 오른쪽 컴포넌트 (추천) 부분을 컴포넌트 별로 구분

3) 댓글 추가/삭제 기능

  • 댓글 창에 댓글 입력 후 게시버튼 클릭 시, 댓글 리스트에 데이터 추가.

  • 댓글 리스트에 쓰레기통 버튼 클릭 시 댓글 삭제

profile
개발자 매뉴얼

0개의 댓글