본문 바로가기

SNS서비스 만들기

(4)
[SNS서비스 만들기] 게시물 작성, 타임라인 기능 만든 서비스의 목표에 좀 더 다가간 모습이다. 구현기능- 로그인기능- 소셜로그인 기능- 로그아웃 기능- 게시물 생성- 게시물에 이미지 넣기- 수정시 텍스트, 이미지 한번에 수정하기- 유저 정보 확인하여 프로필 나타내기- 유저가 생성한 게시물만 모아서 보기 구현중인 기능- 이미지 수정 후 바로 반영되게 하기: 현재는 새로고침을 해야 반영이 된다.- 무한스크롤- 상단으로 이동 기능- 검색기능- 북마크 기능- 좋아요 기능
[SNS서비스 만들기] 초록색의 생기있는 블로그 만들기 성능 향상을 고민하는 개발자 지망생입니다.구현을 넘어서 대용량 데이터를 웹 성능을 향상시키는 과정을 즐겨합니다.또한 Next.js, TypeScript, Styled-Components와 같이 정적언어와 반복 사용이 가능한 컴포넌트로 개발하는 것을 좋아합니다. 이번 SNS서비스는 React, Typescript, Styled-Components로 개발할 예정입니다. 초록색이나 파란색을 메인 색으로 진행할 예정이며, 초록색으로 우선 구현해 봤습니다.PC로 웹 환경으로 구현 후 아이패드와 모바일 환경에 맞게 적용할 예정입니다.무한스크롤, Lazy-Loading, 페이지네이션, 검색기능 등을 구현할 예정입니다.optimistic update를 사용한 좋아요 기능을 추가할 예정입니다. 필수 기능은 빠르게 구현하..
[SNS서비스 만들기] Firebase Database 설정 Firebase 기능 중 Database를 사용하려 할 때 다음과 같은 문구가 나타났다.  Firestore에는 Datastore 모드와 기본 모드 두가지가 있는데, Datastore 모드로 업그레이드 중이다.새로 작성되는 Datastore로 업그레이드 된다.그러나 Datastore는 웹은 지원하지 않는다. 기본 모드로 전환google cloud console로 들어가서 오른쪽 위의 쉘 아이콘을 누른다. 화면 아래쪽에 터미널이 연결되면 다음과 같이 적으면 된다. Firebase의 Database 창을 확인하면 화면이 바뀌어 있을 것이다.아래쪽이 기본 모드의 Database 창이다.    기본 모드와 Datastore 모드 중 선택  |  Firestore  |  Google Cloud의견 보내기 컬렉션을..
[SNS서비스 만들기] 환경설정 npm create vite@latestnpm i react-router-dom@6.14.2 styled-components@6.0.7 styled-resetnpm i @types/styled-components -D styled-reset: reset.css와 동일한 기능을 한다.types/styled-components: Typescript로 styled-components를 생성할 수 있게 하기 위해 사용한다.