Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/bryandejesusrt/facebook_clone_ui
🚀 Facebook Clone UI con Flutter. Réplica exacta de la interfaz de usuario de Facebook. ¡Explora la experiencia auténtica en Flutter! 📱✨
https://github.com/bryandejesusrt/facebook_clone_ui
clone-app dart facebook flutter flutter-apps flutter-ui mobile mobile-app mobile-development mobile-first
Last synced: 28 days ago
JSON representation
🚀 Facebook Clone UI con Flutter. Réplica exacta de la interfaz de usuario de Facebook. ¡Explora la experiencia auténtica en Flutter! 📱✨
- Host: GitHub
- URL: https://github.com/bryandejesusrt/facebook_clone_ui
- Owner: bryandejesusrt
- Created: 2023-10-23T22:04:17.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2023-12-18T15:19:07.000Z (about 1 year ago)
- Last Synced: 2024-11-17T08:54:21.551Z (3 months ago)
- Topics: clone-app, dart, facebook, flutter, flutter-apps, flutter-ui, mobile, mobile-app, mobile-development, mobile-first
- Language: Dart
- Homepage:
- Size: 21.4 MB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🚀 Facebook Clone UI con Flutter
Este proyecto presenta una réplica exacta de la interfaz de usuario de Facebook, desarrollada utilizando Flutter. Cada elemento, desde la barra de navegación hasta las secciones de noticias y notificaciones, ha sido meticulosamente recreado para ofrecer una experiencia visual auténtica. Explora la versatilidad de Flutter mientras navegas por esta copia detallada de la popular plataforma de redes sociales. ¡Sumérgete en la experiencia de Facebook con este emocionante clon UI! 📱✨
![clone de facebook](https://github.com/bryandejesusrt/facebook_clone_ui/assets/71520172/0c894ed9-abcf-4f0e-9d4a-611ff4547576)
## Capturas de Pantalla
>[!NOTE]
>Aquà se muestra un listado de de todas las pantallas desarrollados.| Pantalla Home
|-----------|
| ![image](https://github.com/Bryan-r15/facebook_clone_ui/assets/71520172/b026a798-f032-4a6a-a111-37f013caee71)## Componentes Diseñados:
**Barra de Navegación:**
Navega fácilmente entre las diversas secciones de la aplicación, emulando la familiar barra de navegación de Facebook.- **Feed de Noticias:**
El componente central que muestra publicaciones, imágenes y actualizaciones de amigos, replicando la experiencia del feed de noticias de Facebook.- **Perfil de Usuario:**
Un diseño detallado que imita la disposición del perfil de usuario en Facebook, con secciones para información personal, fotos y publicaciones.- **Notificaciones:**
Componente que refleja el diseño de la sección de notificaciones de Facebook, mostrando alertas y actividades recientes.- **Barra de Estado:**
Reproducción de la barra de estado superior que proporciona información rápida sobre la conectividad y la baterÃa del dispositivo.- **Barra de Acciones:**
Una barra inferior que imita las acciones comunes de Facebook, como publicar actualizaciones, cargar fotos y más.Cada componente ha sido cuidadosamente diseñado para capturar la esencia visual y la experiencia de usuario auténtica de Facebook, proporcionando una réplica detallada de la popular red social utilizando Flutter. ¡Explora y disfruta de la familiaridad de Facebook en esta emocionante implementación! 🚀📲✨
## Inicialización del Proyecto Flutter
Este archivo describe los pasos necesarios para inicializar el proyecto Flutter después de clonarlo o descargarlo.
### Requisitos Previos
- [Flutter](https://flutter.dev/docs/get-started/install) debe estar instalado en tu máquina.
- Asegúrate de tener todas las dependencias necesarias instaladas. Puedes ejecutar el siguiente comando:```bash
flutter doctor
```
Asegúrate de solucionar cualquier problema identificado por flutter doctor antes de continuar.### Pasos de Inicialización
**Descargar el Proyecto:**
Clona el repositorio o descarga el proyecto desde GitHub.```bash
git clone https://github.com/tu-usuario/tu-proyecto-flutter.git
```### Limpiar el Proyecto:
Ejecuta el siguiente comando para limpiar el proyecto.
```bash
lutter clean
```### Obtener Dependencias:
Ejecuta el siguiente comando para obtener todas las dependencias del proyecto.
```
flutter pub get
```
Esto descargará todas las dependencias definidas en el archivo **pubspec.yaml.**### Configuración Adicional (si es necesario):
Realiza cualquier configuración adicional necesaria según las instrucciones del proyecto.## Ejecutar la Aplicación
Una vez completados los pasos anteriores, puedes ejecutar la aplicación Flutter con el siguiente comando:
``
bashflutter run
``
Esto iniciará la aplicación en el emulador o dispositivo conectado.A new Flutter project.
## Getting Started
This project is a starting point for a Flutter application.
A few resources to get you started if this is your first Flutter project:
- [Lab: Write your first Flutter app](https://docs.flutter.dev/get-started/codelab)
- [Cookbook: Useful Flutter samples](https://docs.flutter.dev/cookbook)For help getting started with Flutter development, view the
[online documentation](https://docs.flutter.dev/), which offers tutorials,
samples, guidance on mobile development, and a full API reference.