자기소개

• 안녕하세요. 노마드 코더로 react 공부중인 웹퍼블리셔입니다! 이번에 노마드 코더에서 react 프로젝트 챌린지를 해서 react를 공부할 수 있는 좋은 기회라 생각되어 참여하게 됐습니다 ^^

  
  열심히 강의 보고 따라하는데 쉽지 않네요~~ 다들 화이팅 하시길 바랍니다!

구현한 기능 소개

• 트위터 클론 코딩 강의에 나온 내용은 복습하는 차원에서 구현을 완료했으며 사진 업로드의 경우 사진을 업로드했을 때 post 하기 전에 미리 보여줬으면 좋겠어서 사진 업로드 시 미리 보여주고 맘에 들지 않으면 삭제할 수 있게 해줬습니다! 그리고 추가적으로 좋아요 기능을 만들어보고 싶어서 현재 좋아요 기능 제작 중에 있습니다~

구현 모습 스크린샷 & 깃허브 링크

• 메인 화면

  

• 게시글 수정

  

• 게시글 작성 - 사진 업로드 시 모습(수정 시에도 동일하게 사진 업로드 시 업로드한 이미지를 미리볼 수 있도록 했습니다)

  

• 좋아요(제작 중)

  

• 깃허브 링크: https://github.com/furiouskermit/TwitterClone

고민. 공유하고 싶은 팁

• 고민: 게시글 수정 눌렀을 때 보여주는 수정 화면 코드가 게시글 작성 화면 코드랑 비슷해서 이를 컴포넌트처럼 쓰고 싶은데 문제는 게시글 수정에서 edit 버튼을 눌렀을 때 다시 게시글 목록 모양으로 바뀌어야 하는데 이를 어떻게 처리해줘야 할 지 감이 안 잡히네요...

• 공유하고 싶은 팁: document의 field에서 field 값이 배열인 경우 파이어스토어의 arrayUnion과 arrayRemove 메소드를 사용하면 쉽게 배열 값을 추가하고 뺄 수 있어서 해당 기능 알면 좋을 것 같아 공유합니다~~ ^^
  https://firebase.google.com/docs/reference/js/v8/firebase.firestore.FieldValue