React Native & Firebase Firestore CRUD (usando Expo)
HTML-код
- Опубликовано: 2 ноя 2020
- ¡Conoce más de Expo!
➞ bit.ly/3elqrMu
En este video vamos a crear una aplicación móvil usando React Native y la base de datos Firebase Firestore que realice las operaciones CRUD (Create, READ, UPDATE, DELETE). Para esto usaremos expo, el cual es una herramienta que nos creará un entorno fácil de desarrollar:
bit.ly/3elqrMu
💻 Código de este proyecto:
github.com/FaztWeb/expo-fireb...
🛍 Descuentos:
NordVPN ➞ 68% de descuento en plan de 2 años ➞ Código: fazt
Hostinger ➞ 7% de descuento en cualquier compra ➞Código: FAZT
👨💻 ¿Qué servicios utilizo?
Kite ➞ bit.ly/3dPzXHe
NordVPN ➞ bit.ly/2Te7p0J
Hostinger ➞ www.hostg.xyz/SH4YB
Cloudinary ➞ bit.ly/3ohNlJ7
SiteGround ➞ bit.ly/31u9ZEk
Namecheap ➞ bit.ly/3kne9W8
🖥️ Cursos:
Curso de Git ➞ • Git y Github | Curso P...
Node & Digital Ocean ➞ • Digital Ocean, Subida ...
Setup Visual Studio Code ➞ • Visual Studio Code, Ed...
🌐 Redes:
Fazt Web ➞ www.faztweb.com/
Facebook ➞ / fazttech
Instagram ➞ / fazttech
Twitter ➞ / fazttech
Telegram ➞ t.me/fazttech
Twitch ➞ / fazttech
Slack ➞ bit.ly/3dPqCPT
Discord ➞ / discord
Blog ➞ blog.faztweb.com
📩 Contacto:
➞ fazt@faztweb.com
¡Gracias a Kite por patrocinar esta sección del vídeo! Kite es un asistente de autocompletado gratuito con tecnología de IA que te ayudará a codificar de forma más rápida e inteligente:
Haz clic aquí ➞ bit.ly/3dPzXHe ➞ para saber más.
#react #native #firebase
![Taller de BASH: El poder de la terminal y el scripting [Gratuito]](/img/1.gif)
Genial fazt desde hace tiempo esperaba que subieras un video con react native se agradece mucho
Fazt, ojalá hicieras un video actualizado puesto que la gran parte de cosas en este video ya están desactualizadas, especialmente las peticiones http a la base de datos de firebase, de todas formas muchas gracias por tu contenido bro eres gigante!
Estaba esperando este video, infinitamente agradecido fazt. he visto todos tus videos.
Fazt, eres increíble, tu contenido es de la mejor calidad y compartes cada conocimiento nuevo para todos los coders que hay en tu canal. Eres una gran persona, saludos desde méxico. Algo más que tengo que decir.. es que en ocasiones no se que nueva tecnología estudiar o cuando no se alguna tecnología y la necesito aprender, RUclips me notifica que has subido un nuevo video y es justo lo que necesitaba. Eres una hermosa casualidad, gracias por todo Fazt 🤓♥️.
Buenísimo! Llevaba tiempo tiempo esperando este vídeo :D
Excelente!! Ahora tengo algo para aprender este finde 👊🏼 admiro tu trabajo y la forma en que haces la programación entendible, he visto varios de estos ejercicios completos y me han ayudado mucho en mi vida laboral, muchas gracias!!
Gracias Fazt por compartir tus conocimientos. Eres un ejemplo a seguir💻
Excelente como siempre Fazt, muchas gracias!
Explicas todo de manera genial... sos un crack! Aprendo muchisimo con tus videos! Te felicito!
Excelente Fazt! Heroe sin capa!
Nunca nos faltes jaja
Un saludo desde Buenos Aires, Argentina!!
Genial Fazt! Muchas gracias. Ojalá sigas haciendo videos de React Native
Te quiero, tio! Muchas gracias! Muy bien explicado
Tus videos me han ayudado tanto para darme nociones sobre que tecnologia aprender, gracias por tanto conocimiento que das.
I don't even understand spanish yet I was able to understand the concept. That's a really good teacher. Respect man, keep up the good work! :)
Muchas gracias por todo Jesús, realmente estas ayudando a muchas familias a salir de la pobreza, gracias a tu contenido en español, y muchas gracias por tener tanta paciencia en grabar algo que aveces es tan tedioso.
Dios Te bendiga.
El mejor!, 👏 👏 te saludo desde RD y te agradezco por este contenido
Yo también saludo a fazt desde RD, la verdad es que fazt es un genio de la programación y he aprendido bastante con su contenido de alta calidad saludos. 😊
Muchas gracias por este espectacular tutorial, 10/10
Felicidades 😊👌🏼
DIOOOOOS ERES UN DIOOOOS, MI DIOOOOOOOS, Tienes justo lo que necesito cuando lo necesito TE AMOOOOOOOOO
graciasss brooo ya hacía falta tutoriales de react NATIVE
Ya esperaba un video de React Native tuyo bro, te has convertido en mi principal canal para aprender nuevas techs, ademas aca en Mexico React Native se esta empzando a pedir bastantito, asi que es una buena posibilidad para los desarrolladores latinos
para los nuevos en la configuracion de la base de datos:
Before: version 8 (Old)
import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';
After: version 9 compat (New)
// v9 compat packages are API compatible with v8 code
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';
Gracias!
como se que version tengo ?
@@lucasoechsle376 ya ni me acuerdo xD
Habría que probar con todas xD
@@lucasoechsle376 Te fijas en el archivo de package.json en "dependencias". En ese lugar buscas firebase y al lado te figura la version
Excelente explicação! Obrigada por compartilhar sua experiência, muito grata! :)
Fazt Eres un crack Me inspiraste a seguir este camino con 14 años!
Muy buena amigo, aprovecha tu tiempo. Yo estoy aprendiendo con 16 años, te deseo muchos éxitos.
Genio, muchas gracias Fazt!!
Very elegant and simple! Thank you !
*P O E T I C O*
Excelente video tutorial muy bueno gracias por compatir tus conocimiento espero que pueda seguir con otros video de react native con expo 👍
JUSTO lo que necesitaba...
nice video, fast, simple and correct explication!
Excelente, ame este video. Me gustaria mucho uno donde usaras firestore en produccion definiendo las reglas de seguridad y no solo en modo prueba
Muchas Gracias 🙂 eres muy amable fazt 😎
estoy en tu video de python y justo me llego esta notificación :D
Muchas gracias, eres un crack!
mucho gracias a tu contenido e aprendendo demas dios te bedinga.
Muy bueno. Gracias.
Justo lo q esperaba
Esta muy bueno el video contigo e aprendido mucho sobre codigo aprendí discord.js y otros más
muchas gracias :3
estoy siguiendo el tutorial y aún está instalando el expo-cli, voy por el minuto 12 de vídeo :D, gg my PC hahah
Super buen video!!!
Excelente video :)
Grande maestro...
Fazt me ayudo mucho el video!! Si subieras uno relacioando a la implementacion de un chat en react-native me ayudarias mucho!
Buen tema Fazt, felicidades. Ahora estoy viendo la manera de combinar react con wordpress; por ahi investigue sobre frontity. Seria genial si haces un tutorial sobre ese tema. bendiciones fazt!!!
Excelente!!
Tío fazt un Dios del código
Muchas Gracias
hola fazt, muchas gracias por compartir con nosotros tus conocimientos, explicas muy bien; podrias hacer un video de login con react native o con react??
Muy bueno como guía. Yo hubiera agregado ademas:
+ La validación de los campos del formulario (como que sea un email, y que los errores aparezcan debajo de cada campo y el boton guardar deshabilitado).
+ Poder ordenar la lista según un criterio
+ Y tal vez algo de testeo de unidad
Ah y en mi caso la lista no se actualiza al volver de una actualizacion o creacion de un usuario, tuve que poner [props.route.params] como segundo parametro de useEffect (ni idea si estara bien pero con eso me actualiza , siempre q navegue con algun parametro hacia la lista)
Genial me sirvió muchísimo aunque presente muchos errores al instalar el entorno y los npm que casi me vuelvo loco... Y pues con la nueva versión Lite de firebase me perdía un poco pero con tu ejemplo y la idea me ayudaron mucho
Genial video, me gustaría que hagas más sobre python con flask, exitos crack
A la sí 💪
Gracias!!
Primer comentario, buen video crack!
Vengo del curso de node js . Me ha interesado el video 😃💚 cuando haces un streaming Fazt
Buenísimo, yo en los ratos libres aprendo RN, Podrías hacer uno offline, no hay buen contenido en español
siiii por fin
you are the best!!!
Hola buen video
Excelente, y para hacer una consulta a Realtime Database.
Buen video Fazt 👍👍👍. Podrías hacer uno usando el authentication de Firebase para acceder con Google y Facebook.
Fazt, Muchas Gracias por tu video. Por favor habla y manejate mas despacio, tengo que poner los videos al 70% de velocidad para entenderte .Por otro lado el video muy útil aunque tuve también que actualizar las peticiones firebase al nuevo formato.
Excelente. Sería interesante un tutorial sobre cómo publicarla o instalarla en el móvil.
Tip para la terminal integrada(en windows):
pueden usar ctrl+shift+ñ para abrir una nueva terminal,
y con ctrl+j la pueden esconder y viceversa
grande mi rey
en las dependencias solo salen dos ahora
screens y safe area context no se si haiga problema con eso
Consulta: Cuáles serían los pasos para utilizar React Native a partir de una aplicación creada con React?
Thanks bro
Genial tutorial fazt! Podría ser uno de react native + supabase? Desde que encontré supabase gracias a tus tutoriales, no uso otra bd!
buenas tardes al dia de hoy septiembre de 2023 la parte de la creacion de la base de datos y la insecion de datos a la misma no funcion , alguien podria hacerme el favor de decir como hacer que funcione, no he econtrado la forma soy nuevo usando firebase. muchisimas gracias
como se combinaria react native con tensorflow para hacer una app de inteligencia artificial?
Funciona usar la configuracion web de firebase en una aplicacion movil?
Great tutorial thanks!. Is it possible to convert the list to a swipe list and add the delete function as an option after moving the item?
amigo tengo una duda al usar expo estas programando para solo web? o android? o ios?
o multiplataforma?? tengo esa duda dado a que cuando creas el proyecto salen varias opciones , me podrias ayudar en eso saludos!!
Alguien sabe porque el minuto 27.35 pone la propiedad name entre [ ] ???? graciassss
Muy buen video, sabes como guardar los datos de diferentes pantallas es decir: pantalla 1 tiene 3 text input pantalla 2 2 textinput y por ultimo juntar todos para guardarlos?
Te amo
Cual emulador usas ?? para ver los cambios ahi en tu pc sin tener que estar con el movil. Alguien lo sabe??
hola! buen día espero y alguien me pueda ayudar... tengo un error al utilizar la propiedad ''component'', aparentemente no reconoce el nombre del archivo UserList como componente valido en react native, este es el error: Error: Got an invalid value for 'component' prop for the screen 'UsersList'. It must be a valid React Component.
Para que sirve la opción tabs con Typescript?
sos todo lo que esta bien! Groso fazt! que vuelvan los streaming gaming coding!!! Con el falso falcon!
Ya pronto volverán :P
@@FaztTech de.ante.mano gracias por todo el.apoyo, una pregunta he seguido.tus tutoriales de nodejs y express y los crud funcionan, no.obstante no.se despliegan en.Heroku, he visto tutoriales donde en.linux pasa algo.parecido. pero.realizan.un.paso.extra creando un.archivo.Heroku, con.el.comando touch, yo creo.el.archivo.pero.aun casi se genera el.mismo.resultado espero me.puedas contestar de.antemano gracias. Saludos desde mexico.
con Falcon Masters?
el falso falcon de los directos 🤣
Tengo una pregunta ¿no es peligroso dejar la llave app firebase en el código o es así como se guarda la llave?
me fue muy útil. nota el bug de instalación de firebase no aparece si detienes el expo.
Jala super, gracias!, solo que en expo go, no carga la lista, asi que practicamente no funciona :(
Me sale esto: firebase.firestore is not a function y estoy importando todo alguien me ayuda? Estoy desde expo cloud
Ayuda, alguien sabe a que se debe este error
Cannot read property 'reduce' of undefined
me aparece cuando renderizo en el celular y en el emulador
Se puede usar para hacer una simple landing page con formulario para una base de datos firebase?
Como el recarga el componente principal cada vez que guarda una tarea?
What vs code theme are you using
Fazt tambien funciona en pantallas de laptop
Hola!!
Primero muchas gracias, he aprendido React gracias a ti.
Te queria pedir si es posible hacer una actualizacion de este video, lamentablemente quede estancado en la parte para conectar con firebase ya que no puedo lograr importar y conectar con la base, entiendo que es por que expo se actualizo, gracias!
Unable to locate package wget. Algún consejo?
Fazt he visto otros videos donde hacen esto:
import firebase from 'firebase/app', cuál es la diferencia entre esto y import firebasse from 'firebase', afecta en algo?
Cuando dices from 'firebase/app' le estás diciendo que importe desde firebase solo el modulo app, eso es lo que significa amigo.
Como haces para que dispositivo móvil salga en tu pc
Que pasaria si esa aplicacion se le hicieran mas de 1000 registros, habria manera de solo visualizar los ultimos 5? de menera que no cargue tantos datos?
podrias hacer un tutorial usando react-native cli? o una guia de instalacion para usar react-native cli
me tira un error al querer enviar los datos a la db, la consola me dice que no es una funcion. Alguien pudo solucionarlo?
Hola! Sabes que me da error al tratar de levantar el proyecto:
Failed to compile.
Invalid file signature.
This error occurred during the build time and cannot be dismissed.
Busco en foros y todos recomiendan eliminar el directorio .expo/ pero cuando reintento, se abre la app y a los 2 segundos reaparece el mismo mensaje de error, te ha pasado algo parecido?
Gracias!
enseñanos cómo funciona el react navigation
me sale esta alerta en amarillo , Setting a timer for a long period of time, i.e. multiple minutes, alguien sabe por que?
Mu y buen video, tengo un problema al momento de listar los usuarios me sale 1 solo en pantalla pero en el console.log dentro de map me salen todos, alguien mas le paso?
Se puede crear Persistencia de Datos con React Native, y me refiero a que si se puede descargar un Gigabyte desde un servidor (información sobre medicamentos por ejemplo para qué sirve, interacciones, etc), y que se guarde la información de manera interna en el teléfono para su uso Offline.