Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/alvaromartincrespo/real-time-chat
Real-Time Chat. Simply introduce your name and start conversing with the chat—no passwords or emails required. You can also try the demo version.. (Currently the demo does not work since I do not have a database)
https://github.com/alvaromartincrespo/real-time-chat
chat react supabase tailwindcss whatsapp
Last synced: 18 days ago
JSON representation
Real-Time Chat. Simply introduce your name and start conversing with the chat—no passwords or emails required. You can also try the demo version.. (Currently the demo does not work since I do not have a database)
- Host: GitHub
- URL: https://github.com/alvaromartincrespo/real-time-chat
- Owner: AlvaroMartinCrespo
- Created: 2023-07-31T11:02:05.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-08-02T09:58:44.000Z (over 1 year ago)
- Last Synced: 2024-11-20T02:06:40.677Z (3 months ago)
- Topics: chat, react, supabase, tailwindcss, whatsapp
- Language: JavaScript
- Homepage: https://chat-realtime-navy.vercel.app/
- Size: 71.3 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Aplicación de Chat en Tiempo Real con React, Tailwind y Supabase
Esta es una aplicación de chat en tiempo real desarrollada con React, utilizando Tailwind CSS para estilizar la interfaz y Supabase como la base de datos en tiempo real.
## Características
- Chat en tiempo real: Los mensajes se muestran y actualizan en tiempo real sin necesidad de recargar la página.
- Autenticación con correo electrónico: Los usuarios pueden registrarse y acceder a la aplicación utilizando su dirección de correo electrónico.
- Interfaz moderna y responsive: La aplicación está diseñada para funcionar sin problemas en dispositivos de diferentes tamaños y resoluciones.## Tecnologías Utilizadas
- React
- Tailwind CSS
- Supabase## Requisitos Previos
Antes de ejecutar la aplicación, asegúrate de tener instalado Node.js y npm (Node Package Manager) en tu máquina.
## Instrucciones de Instalación
1. Clona este repositorio en tu máquina local:
```bash
git clone https://github.com/AlvaroMartinCrespo/real-time-chat.git
cd real-time-chat
```2. Instala las dependencias del proyecto:
```bash
npm install
```
3. Configura Supabase:
- Registra una cuenta gratuita en Supabase si aún no tienes una.
- Crea un nuevo proyecto en Supabase y obtén las credenciales de acceso (URL y clave del proyecto).
- Copia y renombra el archivo .env.example a .env en el directorio raíz del proyecto.
- Reemplaza SUPABASE_URL y SUPABASE_KEY en el archivo .env con las credenciales de tu proyecto de Supabase.4. Inicia la aplicación:
```bash
npm start
```## Como usar la aplicación
- Abre tu navegador web e ingresa al localhost que he haya asignado.
- Regístrate con tu nombre.
- Una vez registrado, serás redirigido automáticamente a la página de chat.
- En la página de chat, verás la lista de mensajes existentes y podrás enviar nuevos mensajes en tiempo real.## Contribuciones
Las contribuciones son bienvenidas y agradecidas. Si encuentras errores, problemas o deseas agregar nuevas características, no dudes en abrir un pull request.## Contacto
Si tienes alguna pregunta o comentario, puedes contactarme a través de mi correo electrónico: [email protected]