Continuaremos con la parte anterior llamada Como Integrar Firebase en Django 3.0.7 – Parte 1 en donde dejamos configurado Django para poder realizar la integración con Firebase, en esta Parte 2, vamos a instalar Bootstrap 4 y prepararemos los datos en Firebase Realtime Database, entre otros detalles, vamos con este Post.
Partes
Antes de continuar te invito a escuchar el Podcast: “Herramientas Online Para El Trabajo En Equipo”:
| Spotify: | Sound Cloud: |
 |
 |
Bien ahora continuemos con el Post: Como Integrar Firebase en Django 3.0.7 – Parte 2.
Bootstrap 4
Para no enfocarnos en la parte visual y si enfocarnos en la parte Backend, voy a usar el Framework Bootstrap 4 para el Frontend, lo que haré es usar tablas HTML para listar los datos desde Firebase Realtime Database, voy a instalar este paquete de Bootstrap 4 en Django, para esto ejecuto el siguiente comando.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
pip install django-bootstrap4 Requirement already satisfied: django-bootstrap4 in c:\users\a\appdata\local\pro grams\python\python38-32\lib\site-packages (2.1.1) Requirement already satisfied: django<4.0,>=2.2 in c:\users\a\appdata\local\prog rams\python\python38-32\lib\site-packages (from django-bootstrap4) (3.0.7) Requirement already satisfied: beautifulsoup4<5.0.0,>=4.8.0 in c:\users\a\appdat a\local\programs\python\python38-32\lib\site-packages (from django-bootstrap4) ( 4.9.1) Requirement already satisfied: pytz in c:\users\a\appdata\local\programs\python\ python38-32\lib\site-packages (from django<4.0,>=2.2->django-bootstrap4) (2020.1 ) Requirement already satisfied: sqlparse>=0.2.2 in c:\users\a\appdata\local\progr ams\python\python38-32\lib\site-packages (from django<4.0,>=2.2->django-bootstra p4) (0.3.1) Requirement already satisfied: asgiref~=3.2 in c:\users\a\appdata\local\programs \python\python38-32\lib\site-packages (from django<4.0,>=2.2->django-bootstrap4) (3.2.10) Requirement already satisfied: soupsieve>1.2 in c:\users\a\appdata\local\program s\python\python38-32\lib\site-packages (from beautifulsoup4<5.0.0,>=4.8.0->djang o-bootstrap4) (2.0.1) |
Adicionalmente para borrar completamente la cache de mi proyecto durante las pruebas y desarrollo, he instalado el paquete django-clear-cache.
Para instalar este paquete ejecuto el siguiente comando en mi consola de comandos.
|
1 2 3 4 5 6 |
pip install django-widget-tweaks Requirement already satisfied: django-widget-tweaks in c:\users\a\appdata\local\ programs\python\python38-32\lib\site-packages (1.4.8) |
Ambos paquetes, Bootstrap 4 y django-clear-cache, los cuales acabo de instalar debo de registrarlos en mi archivo settings.py, este archivo se encuentra en firebasedjango > firebasedjango > settings.py
|
1 2 3 4 5 6 7 8 9 10 11 12 |
/firebasedjango ├── /firebasedjango ├── __init__.py ├── asgi.py ├── settings.py // Abro este archivo ├── urls.py ├── wsgi.py ├── /postres ├── db.sqlite3 ├── manage.py |
Abro el archivo settings.py y agrego los paquetes Bootstrap 4 y django-clear-cache en la sección INSTALLED_APPS
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
# Application definition INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'postres', # Aplicación o módulo 'postres' 'clear_cache', # Paquete django-clear-cache 'bootstrap4', # Paquete Bootstrap 4 ] |
Asimismo agregué el módulo o aplicación postres que había creado en la Parte 1 de este tutorial.
Preparando los Datos de Firebase Realtime Database
Lo primero que debemos hacer es definir que servicio vamos a usar de Firebase, yo voy a usar Firebase Realtime Database para este tutorial, entonces voy a la consola de Firebase y creo un nuevo proyecto, luego selecciono el proyecto que he creado y me dirijo a Firebase Realtime Database y creo los siguientes datos manualmente.
En la imagen anterior he creado exactamente 5 items, específicamente 5 postres, estos items tu los puedes insertar mediante programación, pero no me enfocaré en ello, lo que quiero es mostrarte como integrar Firebase en Django y para esto listaré esos 5 items que tengo en mi base de datos de Firebase Realtime Database.
Si tienes problemas para crear una base de datos manualmente en Firebase Realtime Database, te recomiendo mirar el siguiente video de nuestro Canal de YouTube.
Bien con esto ya tenemos los datos listos para mostrarlos en una tabla HTML de Bootstrap 4.
Ten Paciencia, lo que quiero es que entiendas todo el proceso para realizar esta integración y no llenarte el capitulo de mucho contenido y por ende no tendrás un optimo aprendizaje.
Nota (s)
- En la siguiente parte, realizaremos algunas configuraciones en Firebase que nos permitirán integrarlo en Django y crearemos la vista o template en donde usaremos una tabla HTML de Bootstrap 4 que servirá para listar los datos desde Firebase Realtime Database.
- No olvides que debemos usar la Tecnología para hacer cosas Buenas por el Mundo.
Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenidos.