AI Chat Translator - Real-time Multilingual Messaging App

🛠️ What I Learned

During this project, I gained hands-on experience with:

• Supabase Authentication: Implemented secure sign-up and login flows using Supabase Auth.
• Real-time Chat with WebSockets: Enabled instant messaging using Supabase's real-time channel subscriptions.
• Row-Level Security (RLS): Created fine-grained access control with policies to ensure users can only access their own messages and profile data.
• Environment Setup & Deployment: Learned how to deploy the app on Netlify, manage VITE_ environment variables, and debug Content Security Policy (CSP) issues.
• AI-Powered Translation: Integrated AI to auto-translate messages in real-time between English and Japanese, enabling cross-language conversations.
• Debugging Live Issues: Troubleshot WebSocket connection errors, inspected network behavior, and fine-tuned security headers for live deployments.

This project helped me build a solid understanding of building and scaling a real-time, AI-enhanced full-stack application from scratch.

Built With

• bolt
• gemini
• netlify
• nextjs
• supabase
• typescript