Aplicación web con angular ► php con angular
HTML-код
- Опубликовано: 3 авг 2024
- Continua estudiando en: cursos.develoteca.com/
¿Quieres saber cómo hacer una aplicación angular?
== Aquí tienes más videos para aprender y a hacer aplicaciones en el lenguaje que gustes ==
✅ Sitio web con php y Mysql • Sitio WEB con php y mysql
✅ Crud Laravel 8 • Cómo HACER un CRUD en ...
✅ Crud React • Crea una aplicación we...
✅ Crud CodeIgniter4 • CÓMO hacer un CRUD en ...
✅ Crud php crudo • crud php mysql bootstr...
✅ Crud Node&express • CRUD JavaScript con ex...
✅ Crud Python&flask • Aplicación WEB con PYT...
✅ Crud Java • CRUD java netbeans ►🎁 ...
✅ Crud .NET+MVC&C# • CRUD c# sql server MVC...
✅ Crud Golang • CÓMO hacer un CRUD ► 🎁...
Temario del video: CRUD angular 12 con php y mysql ► Cómo crear aplicacin angular
00:00 A).- INTRODUCCIÓN
01:55 B).- PAUTAS
== MÖDULO A) Instalación y configuración
03:02 1).- Herramientas necesarias para instalar angular
04:37 2).- Crea tu primera apliciación con angular
09:23 3).- Estructura del proyecto
12:13 4).- Integrando bootstrap
== MÖDULO B) Interfaz gráfica
15:22 5).- Creación de componentes
19:59 6).- Accediendo a los componentes
26:57 7).- Revisión de la API del CRUD
29:08 8).- Interfaz de captura y rutas
36:57 9).- Importar utilerías
== MÖDULO C) Empezar con el formulario y el servicio
40:37 10).- Ejecutar método en el form
45:28 12).- Recepción de datos
52:05 13).- Servicio y creación de modelo
55:45 15).- Preparando API en servicio
01:03:14 16).- Insertando Datos del form
== MÖDULO D) Trabajando con el intercambio de datos en el CRUD
01:07:37 17).- Usando la redirección
01:09:56 18).- Consulta de registros en API
01:15:24 19).- Mostrar datos en la tabla
01:19:18 20).- Recepcionando datos para borrar
01:23:30 21).- Borrando registros
01:29:12 22).- Recepción de datos por GET
01:33:48 23).- Recuperando datos para editar
01:38:09 24).- Consulta de datos para editar
01:42:54 25).- Recuperando datos modificados
01:46:24 26).- Actualización de datos
== MÖDULO E) Ajustes finales
01:51:39 27).- Ajustes del HTML
01:55:54 28).- Ajustes, validación y cierre
== RECURSOS ==
- HTML: www.w3schools.com/html/defaul...
- BOOTSTRAP: getbootstrap.com/docs/5.0/get...
- PHP : www.w3schools.com/php/default...
- Script php que sirve como API: github.com/oscaruhp/empleados
- Canal de DominiCode donde hay más Angular: / @dominicode
= AGRADECIMIENTOS:
** Sin los miembros del canal la motivación estaría muy baja ¡muchas gracias!.
Este video fue apoyado por los miembros del canal del mes de Julio 2021:
Nivel Master Jedi --
🏅 Marlon Soto
🏅 Francisco Javier
🏅 isaac cruz herrera
🏅 edgar snyck
🏅 Mikel Cuellar
🏅 Rodolfo Nieto Samperio
🏅 MarCode
🏅 Jose Brito
🏅 Xaxke
🏅 Orange Fox
🏅 aldo hernandez
🏅 Jonathan Aguilar
🏅 Angel Ruiz
🏅 Roberto Canela
También muchas gracias los miembros del nivel Padawan que sin duda motivan mucho:🏅
Únete a este canal para acceder a sus beneficios:
/ @develoteca
== Aquí tienes más videos para aprender y a hacer aplicaciones en el lenguaje que gustes ==
✅ Sitio web con php y Mysql • Sitio WEB con php y mysql
✅ Crud Laravel 8 • Cómo HACER un CRUD en ...
✅ Crud React • Crea una aplicación we...
✅ Crud CodeIgniter4 • CÓMO hacer un CRUD en ...
✅ Crud php crudo • crud php mysql bootstr...
✅ Crud Node&express • CRUD JavaScript con ex...
✅ Crud Python&flask • Aplicación WEB con PYT...
✅ Crud Java • CRUD java netbeans ►🎁 ...
✅ Crud .NET+MVC&C# • CRUD c# sql server MVC...
✅ Crud Golang • CÓMO hacer un CRUD ► 🎁...
== Aquí tienes más videos para aprender y a hacer aplicaciones en el lenguaje que gustes ==
✅ Sitio web con php y Mysql ruclips.net/video/IZHBMwGIAoI/видео.html
✅ Crud Laravel 8 ruclips.net/video/9DU7WLZeam8/видео.html
✅ Crud React ruclips.net/video/_DJBFUIT2Kg/видео.html
✅ Crud CodeIgniter4 ruclips.net/video/yr699_OD3-g/видео.html
✅ Crud php crudo ruclips.net/video/xK_1IRknYw0/видео.html
✅ Crud Node&express ruclips.net/video/ZdalwuQ__Xk/видео.html
✅ Crud Python&flask ruclips.net/video/gUED5uFmyQI/видео.html
✅ Crud Java ruclips.net/video/kPCbb80_6GI/видео.html
✅ Crud .NET+MVC&C# ruclips.net/video/0Gu56u71G18/видео.html
✅ Crud Golang ruclips.net/video/G58gN0lIbyI/видео.html
¡Hola! Verifique el correo electrónico con una oferta (ConveyThis)
como podria conectar angular y postgres
De los frameworks front más preciosos que hay, fácil de aprender, rápido y prácticamente ya da muchas cosas por defecto
Muy buen tutorial, justo lo que buscaba, enfocarme en Angular sin invertir mucho tiempo en la api. Muchas gracias profe Oscar!!
Oscar, en verdad, yo te felicito, por la forma en que explicas todo esto, me ha servido de mucho este tutorial, y me ha salido de maravilla el ejercicio. Gracias Maestro.
como siempre las buenas gracias a este señor q educa de una forma tan entendible saludos desde colombia
Debo agradecerte por este tutorial, gracias por la explicación, pase de laravel a Angular y cada uno ofrece recursos diferentes 👍
Muy buen tutorial para un CRUD, muchas gracias por compartirlo.
gran curso, muy didáctico; solo queda decirte gracias
gracias que buen video, enseña muy bien profesor segui y logre completar todo el video sin problemas, es muy simple de explicar lo que hace entender muy bien el contenido de forma incluso entretenida. gracias profesor siga asi mucho exito.
Seguimos dandole fuerte a los videos pana Oscar. Bendiciones
sería genial agregarle una barra de búsqueda para buscar cualquier usuario, perfecto tutorial, me ha servido muchísimo
Habia pensado en profundizar php, mysql y laravel pero incluir angular puede llevar a ser muy interesante. Gracias por el dato...
Muy chido el tutorial, muchas gracias por compartir, recomendado ampliamente!
Excelente, mi primera aplicación en angular! gracias
Excelente curso!
Muy buen curso! ✈
Excelente Tutorial! Te Felicito!
Justo lo que Necesitaba!! Sencillamente épico profe, mil gracias💪
Uff excelente Angel, un gusto leer tu comentario, saludos y éxito... aquí ando para apoyar a la familia de los CRUD´s.
Excelente curso, excelente manera de explicar, muy organizado. Realizar la descripción y la tabla de contenido facilita muchísimo el seguimiento y la consulta posterior del curso. Muchísimas gracias desde Medellín- Colombia. Un suscriptor más.
Muchas gracias Teracon, saludos.
No sabes cuántos espere esto profe, muchas gracias como siempre :)
Excelente YiÓ Wong,
Profesor, con usted aprendo más que en la universidad, muchas gracias
Excelente Ángel, no se te olvide compartir para que el canal no desaparezca ( por eso de que youtube está enterrando a los canales educativos), saludos y mucho éxito.
Otro excelente aporte querido Oscar, gracias por material de tanta calidad.! Un abrazo enorme !
Muchas gracias Alejandro, aquí ando aportando mi granito de conocimiento 🤟 saludos y un fuerte abrazo.
Excelente video 👌
Una vez más muy agradecido con tus conocimientos, ya había tratado de aprender Angular pero había tirado la toalla, esta vez si lo pude entender gracias a tus habilidades para enseñar, super satisfecho y espero que sigas realizando mas contenido. Cuídate, un fuerte abrazo de un venezolano en Buenos Aires.
Gracias Gustavo, no olvides compartir el video para apoyar al canal, saludos.
usted siempre llevandonos por el camino ninja y buenas practicas para ser buenos desarroladores WEB, mis respetos maestrazo! saludos!
Muchas gracias fernando, muy agradecido por el comentario espero me ayudes a compartir el video eso ayuda al canal, saludos.
* Recuerda que los CRUD´s son inevitables.
esta muy bien pero habria qie decir que se necesita conocimiento previo de angular ya que se vieron muchos metodos q solo estan en angular
como siempre profe, nunca deja de sorprendernos, mucho exito
Muchas gracias hernja ... sigamos conociendo más tecnologías y haciendo los inevitables CRUD’s para ayudar a comprender un poco más este mundo.
TERMINADO!!! Gracias profesor, las rutas son las mismitas que las de Vue!
Hola GROOVE, si te inscribes al curso puedo ayudarte de forma más puntual: cursos.develoteca.com/courses/curso-de-jquery-desde-cero
Genial, gracias por compartir. Me sirvió mucho para empezar a manejar Angular. Tendrá algún video explicando como hacer un autenticación de usuarios en Angular. Gracias.
El curso estuvo genial!!! Muchas gracias por explicar todo tan sencillo. Tal vez sería bueno ahondar un poco más en las buenas prácticas de programación como los verbos utilizados en la API y asignarle un tipado a las variables para no usar Any, pero entiendo que esto es más enfocado a entender cómo funciona. Entonces te vuelvo agradecer! Me has ayudado a entender un poco más.
Muchas gracias David, espero que me ayudes a compartir si te a servido ya que RUclips está dejando en el olvido al canal, saludos y éxito.
Muchas gracias todo muy puntual 100% recomendado
Gracias programador_ch, no olvides en compartir el video para apoyar al canal, éxito.
Muchas gracias!
Video super recomendado para quien quiera iniciar con Angular!
Me sirvió bastante 😜
Gracias Javier, no olvides en compartir el video para apoyar al canal,
muchas gracias, estoy trabajando con angular en la versión 16 y aun así me funciono el curso
No olvides compartir el video para ayudar al canal, Saludos Rodriguez.
Genial video siempre los mejores ejemplos y clases en Develoteca
Gracias PSP; no olvides en compartir el video para apoyar al canal, éxito.
El profe Oscar usando Angular 🤯🤯🤯... Buenísimo el aporte profe Oscar, la comunidad de PHP a veces ve imposible o no viable algunas integraciones que sean diferentes a usar PHP y Laravel con jQuery o Vue
siii inge, pero pues es natural, sin embargo siempre hay que conocer ventajas y desventajas y pues darle la oportunidad, saludos inge.
* Recuerda que los CRUD´s son inevitables
Excelente maestro, me gusto mucho el crud, hubiera sido genial que enseñes esa creación de APIS en PHP, pero bueno el objetivo se cumplió , entender las bases de Angular y la creación del CRUD!!!
el problema que tuve fue con la api, cuando intento abrir con xampp me da error no se porque.
Muchas gracias profe! Excelente ubicación explicación soy cero Front y esto me ha ayudado mucho
Excelente, recuerda compartir el video para apoyar al canal, saludos.
Hay mucha gente que no sabía que era una SPA pero es algo que vengo haciendo desde JQuery por ahí del 2013 fue mi primer intento de SPA, hasta que creé un sistema administrativo de alumnos SPA en 2016 por ahí
Esta de lujo profe mil gracias!
Muchas gracias Aurelio, saludos y espero que te sea de utilidad, saludos y mucho éxito.
* Recuerda que los CRUD´s son inevitables
¡Excelente, gran manera de enseñar, gracias!
Gracias Gustavo, no te olvides en compartir el video para apoyar al canal, éxito.
Muchas gracias profe, es el mejor. Me gusto que la menera en como explica es muy facíl para entender
😆😄😄
Gracias Juan, no olvides en compartir el video para apoyar al canal, éxito.
El rey 👑 de los crud YT 🙌 sería tan amable de compartir el repositorio del Crud saludos desde República Dominicana🇩🇴
Que interesante metodo para guardar informacion cuando estas acostumbrado a usar phpmyadmin
Muy buen video, a muchos nos gustaría que se le agregara un login, podrías enseñarnos?
Thank u so much
Es una locura Angular ... gracias por el gran curso.
Excelente Alejandro, no olvides en compartir el video para apoyar al canal, éxito.
Gracias por tanto maestro
Un gusto guerrero, no olvides en compartir el vídeo para apoyar al canal.
Muy buen video, mejor explicado no pudo haber sido,
Gracias Adriana, no olvides en compartir el video para apoyar al canal, éxito.
Excelente curso!!!! 🔝🔝🔝
Gracias Edwin, éxito en tus proyectos, no olvides en compartir el video para apoyar al canal, saludos.
Esto es ORO PURO!
No olvides en compartir el video para ayudar al canal, éxito.
Gracias por este video!
Gracias a ti roger, no olvides en compartir el video para apoyar al canal, éxito.
Excelente profe oscar reciba un cordial saludo buenisimo contenido
Muchas gracias Miguel, espero que me puedan ayudar a compartir para apoyar al canal, saludos y mucho éxito.
* Recuerda que los CRUD´s son inevitables.
Buenas Noches Mentor Uh primero felicitarlo y agradecerle por este excelente curso y lo segundo de donde puedo descargar los recursos que se va a utilizar para este Proyecto
Muchas gracias, excelente introduccion
Gracias a ti Jeison, recuerda compartir el video para ayudar al canal, éxito.
Hola muy buen video solo quería decir que en Empleado.ts no es una clase dado que allí solo se definen los tipos de datos por lo tanto se debería cambiar class por interface. saludos
Obrigado !!!
Excelente clase magistral, bravo. La primera vez que ví angular me pareció una patada en las pelotas, claro luego hice el curso de Reactjs con Hooks y ahora esto lo entiendo más, claro no te resto crédito por tu excelente explicación que lo haces ver sencillo y muy claro sobre todo cuando manejas los datos de los formularios para que sean procesados, luego de ver Redux Tool kit esto se vé como un paseo por el parque. Saludos desde Venezuela.
Gracias Robyir, no olvides en compartir el contenido para apoyar al canal, éxito.
@@Develoteca seguro brother
excelente tutorial, gracias :)
Gracias Duarte, no te olvides en compartir el video para apoyar al canal, éxito.
Muchas gracias por este curso, me sirvió mucho, muy bien explicado y es una muy buena practica para iniciar con este framework.
Es posible crear un form a partir un objeto json que viene del servidor? solo para evitar tener que crear tantos componentes y quizas crear solo 1 y que cree el formulario automaticamente.
Gracias nuevamente.
parabens pelo conteudo
Excelente contenido!!!
Gracias Javier, no olvides en compartir el video para ayudar al canal, 👍
Hola, excelente este demo de trabajar con Angular 12, o 13 tambien funciona, pero hay un detalle importante que es el deploy y he visto en alguno programadores que pasan el codigo asi tal cual y no es el deber ser, solo se tiene que pasar el compilado (build) al servidor (o prod) , entonces faltaria ese complemento llamado Pase a Produccion !!!!
Amigo, acabo de leer tu mensaje ,hice una aplicacion en angular con php y segui este tutorial.Dos preguntas Si subo mi aplicacion a un servidor me saladría un error? y si es así, que tengo q hacer para poder subirlo a un hosting, planeo usar Hostinger.
Es como volver a clases en la UTM! jajaja, excelente video profe, muchas gracias! :D
✌saludos ingeniero, un gusto leerle, ¡sii! hace faltan esos de convivencia y más ahora que estamos todos encerrados, saludos y le mando un fuerte abrazo ingeniero.
Gracias Porfesor!
Un gusto Daiser, saludos.
Increíble la forma de explicar de Oscar, 10 de 10
Gracias Jesus, recuerda compartir el video para apoyar al canal, saludos y éxito.
Muchas gracias, excelente explicación. En el caso de ser n registros cómo se logra una paginación de los mismos. Muchas gracias...
Amigo de Develoteca una consulta o pregunta, seguí todo video al pie de la letra y me queda preguntarte si esto que nos enseñaste se puede subir a un hosting directamente o hay algo que previamente se tiene que realizar? para ponerlo en modo de producción. Básicamente que cambios se realizarán en php y angular.
Ulala chulada 😍😍😍
gracias !!!!!
Solo falta integrarlo a .net pero es muy similar, digo podemos empezar por algo para conocer a angular, saludos inge.
Que gran video colega, gracias por tanto : )
Muchas gracias Josse, espero me puedan ayudar a compartir, te deseo mucho éxito Josse, saludos.
* Recuerda que los CRUD´s son inevitables.
🏆 ¡Completado satisfactoriamente! (Abril 10 de 2021)
💡 Sólo un pequeño inconveniente que tuve en el curso:
Al principio seguí los pasos tal cual para crear un proyecto Angular, y noté que la consola no me preguntó sobre el manejo de Rutas y decidí continuar así.
Evidentemente no tenia el archivo "app-routing.module.ts" y me frustré un poco porque no sabía como continuar, estuve apunto de dejar pero investigando encontré la forma de crear un proyecto pero con el manejo de rutas
*Solución:*
Me tocó volver a crear un nuevo proyecto de la siguiente forma
ng new name-proyect --routing --defaults
PDD: No sé que es --defaults
Voy Minuto 1:15 y me tiraba un error... Agrege en crud.servise ":Observable" Despues de "ObtenerEmpleados()" quedo "ObtenerEmpleados():Observable" , y funciona.. //Muchas Gracias Oscar.. la verdad que este tipo de ApiRest... con PHP es buena... en muchos casos de usar servidores normales de Apache... Voy a ver si consigo hacerlo andar con la Api de Node que tengo jeje... ya tengo buenos codigos para copiar xD
Muchas gracias ya me estaba volviendo loco
me sirvio wey
Buenas noches me gusto mucho tu video y eplicacion . Mi pregunta es : Si el formulario se mete a un Modal seguira funcionando?
buenos días. Por favor realice un video comparando las tecnologias que ha aplicado para los diferentes crud. Cuál es más rapido de cargar, cual utiliza menos recursos, cual es más limpio en código, etc., si es mejor con API, con framework o código puro. Gracias por compartir conocimiento. Saludos
Me gustó mucho tu comentario, aún ando probando hacer más crud´s pero si tengo en mente hacer esa review, saludos Carlos.
Hola profe, muy buenos tus cursos :D... tengo una duda, para extraer datos de otra tabla, necesito crear otro servicio y otro archivo php?
Hola amigo , siempre sigo tus videos me han ayudado mucho. disculpa tendras algo relacionado a desarrollo para android?
Hola Juan Pablo no tengo manejo en su mayoría todo web.
un genio! me salvaste las papas!
No olvides en compartir el video Lou para ayudar al canal, éxito.
hola, ing. si esta creado por google, igualmente las paginas web que uno construye se pueden ver en Mozilla, Edge, Safari, Opera.. o queda limitado en algo?
Excelente y muy bien explicado!!! lo que no entendi es que mi index.php lo tengo que dejar en la carpeta de xampp/httdoc/miCrud/index.php o hay otra forma de decirle a xampp que el archivo esta en otro lado ? mil gracias.!!!
alguna recomendación de video para hacer busqueda utilizando todo lo q aprendí aquí?
ya, y en que parte del video se muestra como configurar la API en wampserver?
Toca con intuición ☠️
Hola Oscar tengo una consulta, porque mis peticiones al backend tardan en llegar a veces mas de 4 segundos, que factores podrían intervenir en estas demoras?, excelente contenido.
Oscar... un gusto saludarte nuevamente, q hosting almacenan angular + php + mysql? abrazos
tengo una pregunta, y es que al intentar insertar los datos en la base de datos me da un fallo , puede ser debido a donde tenga ubicado mi proyecto angular, deberia estar ubicado en el htdocs de xampp¿?
Exelente cuando harias esto mismo pero como react
Hola Disculoa en caso de que me marque un error de las politicas de cors en este caso que se deberia hacer ?
Profesor seria genial que nos enseñe como hacer un login y poder loguearnos usando la API...
10/10
gracias alias, no olvides en compartir el video para apoyar al canal, éxito.
Buen día, no tienes un tutorial donde utilices la versión mas reciente?
hola. te hago una consulta. quiero manipular un datatable en tiempo real (sin cargarla con datos de una base). le quiero pasar datos desde un formulario en tiempo real y despues de cargarla deberia grabar todo eso en la base de datos. no se bien como encararlo. gracias
Tienes algun video o curso utilizando full calendar utilizando angular php y mysql?
Hola!! una pregunta!! utiliza alguna arquitectura de desarrollo??
Muy buen video amigo, pero tengo una duda si tengo mas de 1 tabla ejemplo Persona y TipoPersona como hago que al momento de listar persona si en la tabla persona tengo el id de TipoPersona no me liste el numero del id si no el nombre que representa ese id
Grosooooo eres man
Gracias Sebastian, no olvides en compartir el video para apoyar al canal.
una pregunta de donde sacas la carpeta empleados que contiene el index.php si alguien sabe me podria responder me quede trabado en esa parte y en el xamp me sale que apache no puede arrancar alguien sabe como solucionar eso
Lo estoy haciendo angular + spring boot + postgresql
como sigo el video si estoy usando Angular v 14. en esa versión no trae app-routing.modules.ts. como hago para crear las rutas?
Excelente me sirvió de verdad para entender muchas cosas, Solo tengo un problema (Estaré investigando) en el minuto 01:23:30 Borrar registro devo refrescar manualmente la pagina porque no lo hace automaticamente, para "Solucionarlo" estoy llamando la funcion ngOnInit() despues que elimina pero creo que no es lo correcto cierto?
Hola profe hice este cometario ya en 3 ocasiones pero no se porque se elimina o no se qué pasa que no aparece después de salirme del video, solo tenía una duda yo accidentalmente donde se define la ruta de la API le coloqué http y esto me generó que se concatenara la url del angular + la que se define en la API! A qué se debe esto? No entendí porque sucede eso