[React - Supabase]생일 축하 카드 서비스

🎂 지인의 생일 전에 웹사이트로 이미지와 내용 등을 포함한 생일 카드를 미리 만들어 놓고 지인들에게 “카카오톡 공유”로 보내서 서로 축하한다는 댓글등을 작성해서 지인의 생일에 생일 카드를 보내면 감동을 받겠다는 취지에서 시작한 프로젝트

Github Repo

link_preview

사용 기술

• Backend : Supabase(Serverless Service) + PostgreSQL + Imgur API + Cloudflare Workers(Serverless Imgur API Proxy Server)
• Frontend : React + axios + Kakao API
• Web deploy : Github pages

프로젝트 설명

Supabase를 이용하여 Server 없이 DB에 클라이언트에서 글을 작성, 조회 할 수 있도록 구성

사용자가 글을 작성할 때 이미지를 첨부하면 Cloudflare Workers의 프록시 서버에 요청을 보내 이미지를 Imgur API를 이용해서 업로드 하고 업로드 된 이미지 URL를 Return 하고 Supabase로 게시글 데이터를 전송할 때 같이 보내고 조회할 때 해당 URL를 반환

URL의 쿼리스트링을 이용하여 Supabase의 게시글 UUID를 검색 후 존재 하면 해당 게시글에 대한 데이터를 보내준다.

화면 구성 자세히 보기

https://github.com/ejeonghun/birthday_card/wiki/화면-구성

---

생일 카드 작성

생일 카드

화면 구성

[”이름”의 생일카드]

[이미지]

[제목]

[내용]

[생일날짜]

[카카오톡 공유]

[댓글]

[댓글 작성]

댓글 작성 및 댓글 목록