React Native, Node & MySQL - Aplicacion de Tareas (usando Tabnine)
Вставка
- Опубліковано 8 вер 2024
- En este ejemplo practico de React Native, aprenderemos a desarrollar una aplicación movil con React y un backend que usa Javascript junto a frameworks de Node como Express y a MySQL como base de datos SQL. desarrollaremos un CRUD el cual nos permitira tener más practica y poder entender como funciona el desarrollo de un proyecto movi.
Conoce más de Tabnine, usando este enlace:
bit.ly/3iB9YHZ
50% de Descuento de Tabnine PRO, usando el codigo:
FAZTPRO: bit.ly/3wrmtKi
Código del Ejemplo Práctico:
github.com/Faz...
Videos Recomendados:
Lowdb ➞ • lowDB | Base de datos ...
VSCode REST Client ➞ • Rest Client | Extensio...
digitalocean spaces ➞ • DigitalOcean Spaces & ...
curso de nextjs ➞ • Ionic | Generar Apk de...
React useContext ➞ • React useContext Ejemp...
👨💻 ¿Qué servicios utilizo?
Expo ➞ bit.ly/2WpYKtx
NordVPN ➞ bit.ly/2Te7p0J
Hostinger ➞ www.hostg.xyz/...
Cloudinary ➞ bit.ly/3ohNlJ7
Namecheap ➞ namecheap.pxf.io/ErDe9
🌐 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
#reactnative #mysql #nodejs
Lo que mas me gusto fue el "eso es todo por el video de hoy", suena como si hubiera sido poquito y uff si que costo terminar el video pero todo era muy interesante, un saludo.
Un gusto que lo hayas terminado Daro
Esto hay q verlo y hacerlo por partes, tremendo nivel Fazt
Coders, recuerden que para los interesados en obtener tabnine Pro les dejo un enlace en el que para lass primeras 100 personas en comprarlo, obtendran un 50% de descuento por un año. Un Saludo a todos y mucha suerte codeando este proyecto. Happy Coding!
FAZTPRO: bit.ly/3wrmtKi
Bro, no te gusta usar VIM? osea tratar de hacer atajos de teclado para no usar el mause. No has probado?
Gracias a Dios tengo eldía libre, Hoy no me duermo sin terminar este video completo. UN MILLON DE GRACIAS MAN
Exclente FAZT, esperando ansiosamente el curso de SQL. En algún futuro podrías armar algo de base de dato con express y socket io para tener en tiempo real las actualiazciones de la misma. Agradezco enormemente todo lo que haces fazt. Me ha ayudado mucho en mi camino de aprendizaje en el mundo de la programacion.
Excelente tutorial, completo, bien explicado, nada que envidiar a un curso de Udemy u otra plataforma de cursos pagos. Gracias por compartirlo.
Guao, aprendiendo un montón contigo, eres muy bueno te felicito, he aprendido Node, Agnular, React, Vue, Ionic y ahora React Native, que dedicación a la enseñanza.
Fazt me encantan tus video, podrías hacer uno explicando tu rutina de estudio al momento de aprender un nuevo lenguaje, cuanto tiempo te dedicas como es que empiezas, usas la documentación oficial o que camino sigues
Podria elaborar uno, si me pongo a estudar un nuevo lenguaje, y voy anotando el proceso. Buena idea :)
En el mundo informatico es sin duda un heroe sin capa :) , no como ese chantali de Hola Mundo .. Gracias Fazt por ser como eres en la comunidad programadora 🤣🤣
Estoy iniciando en este lenguaje y la verdad me ayudó bastante tu video para poder orientarme en mi código... Muchas gracias :)
Grande Fazt, primer tutorial tuyo que veo y me ayudo mucho, me comprometi para un trabajo semestral de desarrollo en REACT y no sabia nada, creo que esto que aprendi se puede extender para muchas cosas y aparte deja una base buenisima para seguir aprendiendo por mi cuenta! Gracias!
Vamos a darle
I don't understand your language and the youtube translation is really poor, but I would like to thank you and give you a big thumb up for this great tutorial and clear processes on building the app. THANK YOU SO MUCH Fazt!!!
Muchas gracias por este curso, en serio de todo corazón. Te deseo mucho éxito y lo mejor.
Gracias Fazt, excelente tus tutos, siempre se aprende, react native con expo 1:25:10 👍
Tabnine es de los mejores servicios que he comprado. Gracias por el enorme descuento.
Hola fazt, estaria genial ver un tuto tuyo haciendo un inicio de sesion con wallet digitales (como metamask) en react-native, te dejo la idea por si te gusta :). saludos.
Hey Fazt gracias por compartir el conocimiento, Excelente video!
Muy buen tutorial! En especial las explicaciones sobre hooks aclara varios conceptos, muchas gracias!
Proyecto terminado, muchas gracias Fazt por todo el conocimiento que nos transmites!
hola yo lo termine tambien pero despues de instalar el apk y correrlo solo muestra la primera pantalla y se cierra solo
te ha pasado?
Hola fazt. Vas a hacer un día de estos una tienda ecommerse? Con strapi y react , q opinas de hacerla?
Buenísima idea
@@FaztCode estaría genial
Me encanto este video Fazt muchas gracias por el buen tutorial! Suerte con el verano en cuarentena!
Excelente curso Fazt, muy completo, gracias
Uff este man se la rifo con esto si me puedes contestar muchas gracias¡¡
Hola FAZT, gracias por compartir tu conocimiento👏👏👏👏
Te mamaste bro ta cn madre tu tutorial.
Muchas gracias Fazt
Justo estaba buscando un pequeño curso o ejercicio de este tipo :)
Hi Devs! #fazt is great video 👍
Saludos Crack !!! Muchas gracias por el aporte. Saludos desde Chile
༼ つ ◕_◕ ༽つ Uffffr necesito tiempo para hacer esto... Gracias !!!
Hola FAZT excelente tutorial! he aprendido un montón. Sólo tengo una inquietud, la aplicación funciona correctamente mientras la ejecuto con nodemon, pero al momento de exportarla a un teléfono, no se posible ejecutar las consultas, no sé si habrá que generar una instancia que lo reemplace.
BRUTAL!!!
Bendiciones, Fazt
Excelente video muchas gracias FAZT
tremendo videazo bro, sigue así con tutoriales de react native
tremendo contenido Bro!
Excelente Fazt me gusto mucho tu video, se te agradece !!!!!
Hola fazt que buen tutorial. abemos personas con visibilidad reducida, que bueno seria si pudieras hacer el contenido con las letras un poco mas grande. Gracias por tu atención y por tus enseñanzas.
Si claro, voy a renovar pronto este tutorial y alli lo hare con un texto mas grande
Excelente video! La verdad es que me ha servido mucho
Tengo una pregunta, si ejecuto la app desde mi celular en lugar del emulador, qué url debería colocar?
Es decir, para el emulador es con la 10.0.2.2, pero para el dispositivo físico?
Gracias de antemano.
También tengo ese inconveniente, me parece que se pone el IP del pc como dice fazt
broder cmd y pon ipconfig y listo la ip al costado de ipv4 protocolo de red
ya lo vere gracias !!!
Fazt como siempre rompiendolaaaaa gracias por compartir crack
Fantástica explicación !
Terminado!! Excelente video Fazt
Hola Fazt, disculpa al poner en el archivo package.json la instruccion: "scripts": {
"dev": "nodemon src/index.js --exec babel-node", al ejecutar npm run dev, porque me aparece este error: "babel-node" no se reconoce como un comando interno o externo,
programa o archivo por lotes ejecutable.
Me pasaba lo mismo, solo borra el "babel-node", luego dale ctr+c en la terminal, luego npm run build y luego npm run dev
@@estebangarcia1692 Gracias Esteban
@@estebangarcia1692 Muchas gracias, si me sirvió.
Excelente video, amigo, puedes hacerlo sin expo, porque en el entorno profesional, expo tiene muchas limitaciones del uso de librerias nativas
Fazt podrías hacer un curso para realizar un ecomerce con react y node y que procese los pagos con stripe, creo que mucha gente te ha pedido un video así y de verdad te estaríamos muy agradecidos
Voy a hacerlo. Siempre me olvido, de hecho haré dos un ecommerce mobile y otro web.
@@FaztCode sería estupendo, gracias!!!
@@FaztCode Por favor, hacelo! Gracias
Excelente
Muy bueno prof.. gracias
Excelente video!!!!
seria genial actualizar este curso
Hola Fazt, Excelente video, espero luego no traigas un ejemplo de react native usando typescript
Larga. Vida a Fazt
Gracias por compartir tu conocimiento... tus videos son geniales, solo tengo un problema, cuando hago click en una tarea para editarla, me carga el form pero no me muestra los fields con el texto de la tarea. Ya he revisado de arriba abajo y es lo unico que me falla. He puesto el value pero igual no funciona. Gracias.
Excelente video bro !! siempre miro tus videos se aprende y mucho contigo, consulta.... el tema de enviar imagenes por api de node como sería, estoy pensando en algo como guardar primero de manera local el registro y luego con un click enviar la info completa a la api junto con la imagen, que se vaya cargan de manera asincrona conforme detecte conexion a la red
Podrías hacer un ejemplo sencillo como emplear esta logica? Saludosss!!!
Increible, pude completar el video, incluso pude integrar JWT. me quedo solo una sola duda, por que se queda pegado el TaskFormScreen al usar el Drawer en vez del Stack navigator?
buenas fazt haznos un vidéo nuevo usando react native me encanta mucho haz algo completo usándolo con mongo full stack
Gracias Crack, eres grande!
Excelente aporte!!
"babel-node" no se reconoce como un comando interno o externo,
programa o archivo por lotes ejecutable.
[nodemon] app crashed - waiting for file changes before starting... ayuda
"babel-node": "babel-node --presets=@babel/preset-env",
"dev": "nodemon --exec npm run babel-node src/index.js"
Con estas dos líneas debería funcionarte, la otra es que borres node_modules, los package y vuelvas a instalar las dependencias
Excelente video, se podria poner un indice dividiendo los temas por tiempo del video?
Gran video!!! Gracias
Una duda, veo que en casi todos tus videos de API’s en Js usas arrow functions, por que no usas la declaración:
function name(param0) {
statements
}
Alguna razón en especial? No tengo mucha experiencia con Js y siempre he tenido esta duda
BUEN VIDEO PRIMO
Al final luego de compilar la APK ¿ el backend como se implementa en un servidor en producción? que necesita tener instalado en el server node.js y todo el resto de cosas que se hicieron al principio?
Buenas tardes fazt, hermano me gustan mucho sus videos, tengo una pregunta, este procedimiento serviria para una base de datos interna en el celular?, me explico, quisiera que la app que estoy desarrollando no guarde los datos en una bd externa al celular sino en el mismo dispositivo, muchas gracias
ty
Excelente
Hola profesor Fazt, podria crear una aplicación con React Native y Firebase con la autenticación, para tener un login por ejemplo, con expo me da errores por conflicto de librerias.
Tremendo video crack
EXCELENTE VIDEO. Y que pasa si falla algo en el medio? No se puede usar transacciones ? No hay ningun control de errores en los sqls, como podrias detectar error de coneccion o servidor caido o sql incorrecto?
muy buen video, me quedo la duda de como desplegar el backend y donde hacerlo
Actualmente los que uso en mi caso para backends de Nodejs es AWS EC2, y para bases de datos digitalocean manage databases
Fazt, te amo!
Muchachos para quienes no solo quieren dejar en desarrollo y lo quieren desplegar a produccion importante cerrar sus conexiones a la db, yo subi la api a heroku incluyendole archivos estaticos y la db en cloud server asi ya pueden generear apk y instalarlo de un forma mas profesional
Muy buen video, me podrias decir como quitar el fondo blanco que hay cuando navegas de una ventana a otra?
Gracias master!
Excelente tutorial el mejor que he visto, Fazt disculpa y hay alguna manera de crear con React Native Aplicaciones Offline o como lo haría.
Si claro, podrías usar sqlite3 que es una base de datos local que se usa en aplicaciones móviles, así no necesitarías de enviar datos al backend
tengo varios sistemas web hechos con react js, hay una forma de pasarlo o generar una app movil para no tener q entrar al navegador en el celular?
como hago para actualizar el sdk de la aplicacion para poderla usar con la app de expo descargada desde mi celular? . me da un error de que la version del proyecto es vieja y por eso no la toma.
Tengo un error respecto al Put osea no me deja actualizar, ya revise en el back end y carga normal, pero en el front end se salta el siguiente error: at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
code: 'ER_PARSE_ERROR',
errno: 1064,
sql: "UPDATE tasks SET WHERE id = '[object Object]' ",
sqlState: '42000',
sqlMessage: "You have an error in your SQL syntax; check the manual that corresponds to your M
ntax to use near 'WHERE id = '[object Object]'' at line 1"
}
alguien sabe la solución
me puedes ayudar no se que pasa aqui
[nodemon] 2.0.12
[nodemon] to restart at any time, enter `rs`
[nodemon] watching path(s): *.*
[nodemon] watching extensions: js,mjs,json
[nodemon] starting `babel-node src`
"babel-node" no se reconoce como un comando interno o externo,
programa o archivo por lotes ejecutable.
[nodemon] app crashed - waiting for file changes before starting...
a mi tambien me pasa, nose que hacer
A mi me funciono con "dev": "nodemon node --exec babel-node src/index.js"
Me sale esto cuando intento correr nodemon la primera vez lo corregí haciendo todo de nuevo pero después madamas cerré mi código y al día siguiente lo abrí y me marco lo mismo que puede ser ?
SyntaxError: Cannot use import statement outside a module
at Object.compileFunction (node:vm:355:18)
at wrapSafe (node:internal/modules/cjs/loader:1039:15)
at Module._compile (node:internal/modules/cjs/loader:1073:27)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1138:10)
at Module.load (node:internal/modules/cjs/loader:989:32)
at Function.Module._load (node:internal/modules/cjs/loader:829:14)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:76:12)
at node:internal/main/run_main_module:17:47
[nodemon] app crashed - waiting for file changes before starting...
Hola Fazt, vale la pena ver este tuto para aprender react native ? o ya quedó viejo ? gracias, saludos
Hola Fazt, una duda, si node no es bloqueante y tienes muchas consultas que deben lanzarse de modo sincrono (una detrás de otra, en orden estricto) con async await no se estaría bloqueando el hilo principal?
!Curso Terminado!
PD: GRACIAS POR EL CORAZON (Aunque ya se quito por el editar), pero un abrazo desde Venezuela!
Saludos Melvin. Continua estudiando, Éxitos.
Gracias, una consulta, esta aplicación se puede subir a heroku o aws hay que instalar expo en los servidores o algo asi?
Buenas noches, alguien tiene un problema de too many request en la parte del fetch?? gracias
At video 3:11:16, I cannot get the value ={task.title} and value={task.description}, it returns nothing, but from the console.log(task), I can get the Object when I pressed. Fazt Code, can you please help...? I followed everything on your video and just couldn't get passed on this part.
Awesome tutorial, but i cant create an app using "expo", ... i did try to run 'expo init appName', but it gives me an error -> "Uncaught Error Error: operation not permitted"
En el minuto 1:50:20 , tengo un problema cambio el localhost por 10.0.2.2 y el puerto que yo utilizo, con postman me funciona bien y tal, pero al usar el emulador con varios celulares la respuesta me devuelve el response.data un undefined y el status code viene 400, alguna idea?
hermano lo pudiste solucionar??? me pasa lo mismo que a vos, si ejecuto la app desde el browbser funciona perfectamente la API ligada a mySQL pero desde cualquier celular me tira un error, un undefined igual que a vos supongo. Como lo solucionas?
tengo una duda, en necesario instalar android studio para que mi aplicacion funcione (me imagino que es solo por si quiero emularlo )? siempre me servirá expo build:android aunque no tenga android studio instalado? de antemano muchas gracias brother, estoy viendo todos tus cursos de react
No se que hice mal pero npm run dev funciona, pero ya que lo transformo a producción falla SyntaxError: Unexpected token 'export'
Solucion al parecer los archivos en "dist" buscaban los archivos en la carpeta "src" solo cambie eso y listo
tienes algun tutorial sobre como desplegar esta API en algun servicio como Heroku?
Hello, im having an error when running the script "npm start", and its not the one you mentioned, i think, it says "SyntaxError: Cannot use import statement outside a module", do you know what can be the cause? if you want, you can answer in spanish, i understand a little bit! Great video!
E: Looked for an hour for it, wrote the comment, and 3 mins later found the problem...
Either way, fantastic video!
Fazt por que almomento de querer actualizar pongo los valores del objeto task.title en el valor del input al igual que task .description y me arroja como idefinido ya lo guarde muchas veces y no me deja te paso lo mismo ? como lo solucionaste por que ya lo he revisado y todo esta bien pero me sigue dando indefinido es como si no me dejara acceder al objeto o como si aun no cargara todo el objeto.
Ayuda no he podido utilizarlo, lo tengo todo igual :/, el servidor corre pero no me da respuesta http
hola como estas, al intentar unar cors de esta manera (app.use(cors)), no me permite realizar conusltas desde el archivo tasks.http. alguna idea de por que?, muchas gracias
Buenas, tengo un problema en el minuto 21:34 en el doc de app.js no encuentra la ruta de destino de un archivo, ya lo puse de varias formas pero no me agarra
Excelente vídeo, una consulta, en donde suben el backen para que se conecte la aplicación movil?
El backend para este ejemplo puedes subirlo en AWS, Google cloud platform, azure o digital ocean. Sí estas empezando te recomendaría digital ocean, pero en cualquier de estos el deploy es casi lo mismo
Me terminé todo el video, solo me falta subir la app y terminar, pero tengo una pequeña duda. ¿Qué pasa con el backend? ¿Debo subir el backend en otro lugar o algo así?
Así es el backend lo tienes que subir en un servidor, te recomendaria DigitalOcean, o AWS
@@FaztCode Muchas gracias, amigo, me has enseñado demasiado.
@@FaztCode Al final lo subí a Heroku y me está funcionando perfectamente aunque tuve que hacer la modificación al puerto de escucha: listen((process.env.PORT || 3000)), de otra forma me sacaba error, casi que no encuentro como jaja
Genio que distribución utilizas actualmente para programar?
Man, excelente tu video, lo unico que no entiendo es que haces con el codigo backend cuando ya tienes un servidor afuera (no en tu computador), lo compilas? lo subes al servidor como javascript, no entiendo. Please tu ayuda.
Básicamente lo tienes que subir a alguna plataforma de la nube y luego darle la dirección ip o dominio a tu aplicación móvil para que se pueda conectar. Voy a hace otro ejemplo de React native y MySQL en donde voy a mostrar eso más subida de imágenes. Lo llamaré React native MySQL galería de imágenes