인스타그램 클론코딩(진스타그램)

사용 기술 스택

프론트

• 자바스크립트(바닐라)

백엔드

• node js(Express)

데이터 베이스

• MongoDB

• Naver Colud platform Object Store(S3)

• 로그인 화면

• 로그인 오류) 존재하지 않는 계정일 경우

• 로그인 오류) 존재하지만 비밀번호가 틀린 경우

• 이미 존재하는 계정ID 일 경우 가입 불가능

• 존재하지 않는 ID일 경우 가입버튼 활성화(Ajax fetch)

• 팔로우한 사용자의 게시글 불러오기

• 좋아요 및 댓글 기능

• 게시글 페이지 / 댓글 모두 보기(Dialog)

• 사용자 개인 프로필, 팔로우/언팔로우 , 자신의 프로필일 시 프로필 편집 버튼 활성화

• 개인 프로필 게시글 보기(Dialog)
  

-프로필 편집 페이지, 프로필 사진 변경기능

• 프로필 사진 변경
  

• 사용자 검색
  

• Direct Message ( 소켓 통신)

• 대화방의 참가자 선택

• 새로운 메시지
  
• 해당 대화방을 보고있지 않는 경우에 메시지가 왔을 경우

• 해당 대화방을 보고 있는 경우

---

2020년 5월자바스크립트 node.js 그리고 css를 포함해 웹에 대해서 완전 무지한상태에서 시작을한 개인 프로젝트.
아무것도 모르는상태에서 시작해서 유튜브나 블로그, 검색을 하면서 혼자 알아가야 했기 때문에 기능 한개를 구현하려면 꽤 많은 시간을 투자 해야했고 매번 모르는 것들 천지, 결과물만 보면 별것 아닌것 처럼 보이지만 7개월이라는 시간이 걸렸다.
최대한 실제 인스타그램하고 비슷하게 만들려고 노력은 했지만 역시 전문적인 교육을 받지 않았던 터라 힘들었다.
틈틈히 시간나는대로 더 세세한 기능들을 추가할 예정이다.