1. 플로이드-워셜이란?
2. 핵심 개념 이해하기
3. k, i, j의 의미
4. 동작 과정 시각화
5. 코드 구현
6. 시간복잡도와 공간복잡도
7. 다익스트라와의 비교
8. 실전 문제 적용

• 들어가며
• 1. 처음 그린 그림
• 2. Redis 대기열, 생각보다 복잡했다
• 3. 매칭 알고리즘의 딜레마
• 4. “알림이 안 가요”
• 5. 동시성의 늪
• 6. DB와 Redis 사이에서
• 7. 배운 것들

• 들어가며
• 1. 전체 그림: 우리 서비스가 필요한 것
• 2. Backend: Spring Boot + WebFlux를 선택한 이유
• 3. Database: MySQL을 선택한 이유
• 4. Cache & Queue: Redis를 선택한 이유
• 5. WebRTC: Agora를 선택한 이유
• 6. File Storage: Firebase Storage를 선택한 이유
• 7. Frontend: React + Capacitor를 선택한 이유
• 8. 배포 환경: AWS + Vercel
• 9. 기술 선택의 원칙
• 10. 마치며

‘친구하자’를 개발하며 통화 녹음 기능을 구현해야 했다. AI 개발과 통화 분석 등 추후 기능들을 위해 통화를 녹음하는 것을 전제로 구현을 시작했다.

• 이번 포스팅에선 Capacitor로 빌드한 앱에서 여러 아이콘이 순차적으로 표시되는 커스텀 스플래시 스크린을 구현하는 방법을 정리했다.
• 왜 Custom splash screen이 필요했나?
  • Capacitor의 기본 splash screen은 단일 정적 이미지만 지원한다.🔗링크
  • 나는 여러 아이콘을 순차적으로 보여주는 애니메이션을 구현하고 싶어 React 컴포넌트로 직접 구현하였다!

• 이번 포스팅에서는 Capacitor로 빌드한 Android 앱에서 WebSocket 통신 중 발생한 JSONP 에러에 대해 다루었다.
• 해결하는 과정에서 공부한 내용에 대해 정리해보았다.

• 이번 포스팅에서는 Capacitor로 빌드한 Android 앱에서 WebSocket 통신 중 발생한 X-Frame-Options 에러에 대해 다루었다.
• 해결하는 과정에서 공부한 내용에 대해 정리해보았다.

• Capacitor로 빌드한 React 앱에서 카카오와 구글 네이티브 로그인을 구현하는 방법을 정리해 보았다.
• 관련되서 정리되어있는게 없는것 같아서.. 내가 나중에 찾아볼 수 있게 일단 문서를 만들어보았다.
• 웹에서는 일반 OAuth 리다이렉트를 사용하지만, 모바일 앱에서는 네이티브 SDK를 직접 사용하는 방식으로 구현했다. (kakao, google)
  • kakao developer에는 flutter문서에서 크로스 플랫폼에서는 커스텀 URL 스킴을 사용하라고 권장한다. 하지만 나는 플러그인을 사용하는 방식으로 구현해보았다.

• 지난 글에서는 Capacitor로 Android, iOS 앱 빌드하는 방법에 대해 다뤘다.
• 이번 글에서는 Capacitor로 빌드한 Android 앱에서 로그인 연동을 하는 방법에 대해 다뤄보겠다.
• 특히 CORS 에러 해결에 대해 다뤄보겠다..

  저번에 한번 여기까진 해결을 했었는데,, 다 밀고 다시하는 과정에서 까먹어서.. 이번에도 삽질을 했다..🥲 진짜 울뻔함

• “친구하자”를 웹으로 MVP 완성을 하니, 이걸 앱으로 빌드해서 사용자들이 더 쉽게 사용할 수 있으면 좋겠다고 생각했다.
• 원래는.. 개발자의 입장으로 링크로 이동하는 방식이 쉬울꺼라고 생각했는데, 막상 사용자에게 링크를 보내주니까 어려움을 토로하거나 방식에 의문을 가지는 사람들이 많았다..
  • 링크는 일단 어디 저장해놓고 찾아서 연결해야하고..
  • 핸드폰에서 링크를 통해 이동하는 방식이 익숙하지 않은 사람들이 더 많았다.. (일회용 링크정도만 다들 사용하는 것 같았다.)
• 네이티브 앱으로 개발하는건 일단 시간이 많이 드니까 최대한 빠른 방법을 찾아보다가 Capacitor 플러그인을 찾게 되었다.