SlideShare una empresa de Scribd logo
1 de 41
#hellorealworld
Hello Real World
#hellorealworld
Angel Roldán
Senior fullstack craft devops developer
Ing Técnico Informática UPM
Máster desarrollo web UPM
Desarrollador
https://twitter.com/senechaux
https://github.com/senechaux
#hellorealworld
Acto 1: la idea
Algo simple y sencillo
Web
Base de datos
CRUD
Listo para mostrar esta semana
#hellorealworld
Acto 2: base del proyecto
• Web PHP
• Symfony
• Composer
• Bundles a tope
#hellorealworld
Acto 2: base del proyecto
1. Creas el proyecto Symfony
composer create-project symfony/skeleton hellorealworld
composer require symfony/maker-bundle --dev
bin/console make:entity
2. Añades base de datos
bin/console doctrine:database:create
bin/console make:migration
bin/console doctrine:migrations:migrate
#hellorealworld
Acto 2: base del proyecto
3. Creas un CRUD
composer require form validator twig-bundle security-csrf
annotations
bin/console make:crud
4. Metes datos de prueba
composer require --dev doctrine/doctrine-fixtures-bundle
fzaninotto/faker
bin/console doctrine:fixtures:load
#hellorealworld
Acto 2: base del proyecto
5. A correr
composer require server --dev
bin/console server:run
#hellorealworld
Acto 2: base del proyecto
Resultado
#hellorealworld
Listo!
Algo simple y sencillo
Web
Base de datos
CRUD
Listo para mostrar esta semana
Que sea bonico
#hellorealworld
Acto 3: que sea bonico
Webpack Encore
composer require encore
yarn install
yarn add bootstrap popper.js --dev
yarn sass-loader node-sass
yarn run encore dev —watch
#hellorealworld
Acto 3: que sea bonico
Añadir css y javascript
#hellorealworld
Acto 3: que sea bonico
Añadir SASS a Webpack
#hellorealworld
Acto 3: que sea bonico
Modificar template
#hellorealworld
Acto 3: que sea bonico
Resultado
#hellorealworld
Listo!
Algo simple y sencillo
Web
Base de datos
CRUD
Listo para mostrar esta semana
Que sea bonico
Adjuntar imágenes
#hellorealworld
Acto 4: adjuntar imágenes
Modificar la entidad
bin/console make:entity
bin/console make:migration
bin/console doc:migrations:migrate
#hellorealworld
Acto 4: adjuntar imágenes
VichUploaderBundle
composer require vich/uploader-bundle
bin/console make:entity # para añadir el campo updatedAt
bin/console make:migration
bin/console doc:migrations:migrate
#hellorealworld
Acto 4: adjuntar imágenes
Configuración
#hellorealworld
Acto 4: adjuntar imágenes
Configuración
#hellorealworld
Acto 4: adjuntar imágenes
Configuración
#hellorealworld
Acto 4: adjuntar imágenes
Configuración
#hellorealworld
Acto 4: adjuntar imágenes
Resultado
#hellorealworld
Listo!
Algo simple y sencillo
Web
Base de datos
CRUD
Listo para mostrar
Que sea bonico
Adjuntar imágenes
Thumbnails
#hellorealworld
Acto 5: thumbnails
LiipImagineBundle
composer require liip/imagine-bundle
#hellorealworld
Acto 5: thumbnails
LiipImagineBundle
#hellorealworld
Acto 5: thumbnails
Resultado
Antes Después
#hellorealworld
Listo!
Algo simple y sencillo
Web
Base de datos
CRUD
Listo para mostrar
Que sea bonico
Adjuntar imágenes
Thumbnails
API
#hellorealworld
Acto 6: API
API Platform
composer req api
http://localhost:8000/api
#hellorealworld
Acto 6: API
Editor
#hellorealworld
Acto 6: API
GET, POST, PUT, DELETE
#hellorealworld
Acto 6: API
GraphQL
composer require webonyx/graphql-php
http://localhost:8000/api/graphql
#hellorealworld
Acto 6: API
GraphQL autocompletado y paginación
#hellorealworld
Acto 6: API
GraphQL operaciones
#hellorealworld
Listo!
Algo simple y sencillo
Web
Base de datos
CRUD
Listo para mostrar
Que sea bonico
Adjuntar imágenes
Thumbnails
API
Composer producción
#hellorealworld
Acto 7: composer
Composer
install | dump-autoload
--no-dev
--prefer-dist (opción por defecto)
-o (--optimize-autoloader)
--apcu-autoloader | --classmap-authoritative
--no-scripts
#hellorealworld
Listo!
Algo simple y sencillo
Web
Base de datos
CRUD
Listo para mostrar
Que sea bonico
Adjuntar imágenes
Thumbnails
API
Composer producción
Almacenamiento distribuido
#hellorealworld
Acto 8: almacenamiento
FlySystemBundle
composer require oneup/flysystem-bundle
#hellorealworld
Listo!
Algo simple y sencillo
Web
Base de datos
CRUD
Listo para mostrar
Que sea bonico
Adjuntar imágenes
Thumbnails
API
Composer producción
Almacenamiento distribuido
HTTPS y balanceador de
carga
#hellorealworld
Acto 9: balanceador
HTTPS + Load balancer
#hellorealworld
Listo!
Algo simple y sencillo
Web
Base de datos
CRUD
Listo para mostrar
Que sea bonico
Adjuntar imágenes
Thumbnails
API
Composer producción
Almacenamiento distribuido
HTTPS y balanceador de
carga
LISTO!
#hellorealworld
Angel Roldán
https://twitter.com/senechaux
https://github.com/senechaux
Ing Técnico Informática UPM
Máster desarrollo web UPM
Desarrollador

Más contenido relacionado

Similar a Symfony CRUD app with images, API and deployment

Spain AI 2022 - ¡Oh, un modelo de ML, vamos a desplegarlo! - Machine Learning...
Spain AI 2022 - ¡Oh, un modelo de ML, vamos a desplegarlo! - Machine Learning...Spain AI 2022 - ¡Oh, un modelo de ML, vamos a desplegarlo! - Machine Learning...
Spain AI 2022 - ¡Oh, un modelo de ML, vamos a desplegarlo! - Machine Learning...Ricardo Guerrero Gómez-Olmedo
 
WordPress, Nginx, Ghost y Telegram con Docker - I Meetup Docker Córdoba - Quaip
WordPress, Nginx, Ghost y Telegram con Docker - I Meetup Docker Córdoba - QuaipWordPress, Nginx, Ghost y Telegram con Docker - I Meetup Docker Córdoba - Quaip
WordPress, Nginx, Ghost y Telegram con Docker - I Meetup Docker Córdoba - Quaipquaip
 
La Caja de Herramientas del Desarrollador Moderno PHPConferenceAR
La Caja de Herramientas del Desarrollador Moderno PHPConferenceARLa Caja de Herramientas del Desarrollador Moderno PHPConferenceAR
La Caja de Herramientas del Desarrollador Moderno PHPConferenceARPablo Godel
 
Desymfony 2011 - Tutorial #1: Instalacion y primeros pasos
Desymfony 2011 - Tutorial #1: Instalacion y primeros pasosDesymfony 2011 - Tutorial #1: Instalacion y primeros pasos
Desymfony 2011 - Tutorial #1: Instalacion y primeros pasosJavier Eguiluz
 
.NET Core 1.0 y ASP.NET Core 1.0
.NET Core 1.0 y ASP.NET Core 1.0.NET Core 1.0 y ASP.NET Core 1.0
.NET Core 1.0 y ASP.NET Core 1.0Luis Ruiz Pavón
 
Asp.net 5 en linux , herramientas e integración
Asp.net 5 en linux , herramientas e integraciónAsp.net 5 en linux , herramientas e integración
Asp.net 5 en linux , herramientas e integraciónrobertogg
 
Docker - Entorno de trabajo configurado en 1 minuto [WCBilbao]
Docker - Entorno de trabajo configurado en 1 minuto [WCBilbao]Docker - Entorno de trabajo configurado en 1 minuto [WCBilbao]
Docker - Entorno de trabajo configurado en 1 minuto [WCBilbao]Keopx
 
Tech Meetup: Jenkins, the moody buttler
Tech Meetup: Jenkins, the moody buttlerTech Meetup: Jenkins, the moody buttler
Tech Meetup: Jenkins, the moody buttlerSantex Group
 
Evolution INTech - Acceso a bases de datos con Minimal APIs de .NET 6.pptx
Evolution INTech - Acceso a bases de datos con Minimal APIs de .NET 6.pptxEvolution INTech - Acceso a bases de datos con Minimal APIs de .NET 6.pptx
Evolution INTech - Acceso a bases de datos con Minimal APIs de .NET 6.pptxLuis775803
 
Greach 2011 : Creando Plugins Con Griffon
Greach 2011 : Creando Plugins Con GriffonGreach 2011 : Creando Plugins Con Griffon
Greach 2011 : Creando Plugins Con GriffonMario García
 
GUIA DE LABORATORIO PHONE GAP JQUERY MOBILE CARGADO DE_DATOS_DE_REGISTROS...
GUIA DE  LABORATORIO  PHONE GAP JQUERY  MOBILE  CARGADO DE_DATOS_DE_REGISTROS...GUIA DE  LABORATORIO  PHONE GAP JQUERY  MOBILE  CARGADO DE_DATOS_DE_REGISTROS...
GUIA DE LABORATORIO PHONE GAP JQUERY MOBILE CARGADO DE_DATOS_DE_REGISTROS...Ivan Petrlik
 
internet of things day 2014 (presentación)
internet of things day 2014 (presentación)internet of things day 2014 (presentación)
internet of things day 2014 (presentación)David Sánchez Falero
 
Guía de trabajo doctorado tics freddychavezc
Guía de trabajo doctorado tics freddychavezcGuía de trabajo doctorado tics freddychavezc
Guía de trabajo doctorado tics freddychavezctomasherrera
 
Guía de trabajo doctorado tics freddychavezc
Guía de trabajo doctorado tics freddychavezcGuía de trabajo doctorado tics freddychavezc
Guía de trabajo doctorado tics freddychavezcmonwall2009
 

Similar a Symfony CRUD app with images, API and deployment (20)

Spain AI 2022 - ¡Oh, un modelo de ML, vamos a desplegarlo! - Machine Learning...
Spain AI 2022 - ¡Oh, un modelo de ML, vamos a desplegarlo! - Machine Learning...Spain AI 2022 - ¡Oh, un modelo de ML, vamos a desplegarlo! - Machine Learning...
Spain AI 2022 - ¡Oh, un modelo de ML, vamos a desplegarlo! - Machine Learning...
 
WordPress, Nginx, Ghost y Telegram con Docker - I Meetup Docker Córdoba - Quaip
WordPress, Nginx, Ghost y Telegram con Docker - I Meetup Docker Córdoba - QuaipWordPress, Nginx, Ghost y Telegram con Docker - I Meetup Docker Córdoba - Quaip
WordPress, Nginx, Ghost y Telegram con Docker - I Meetup Docker Córdoba - Quaip
 
La Caja de Herramientas del Desarrollador Moderno PHPConferenceAR
La Caja de Herramientas del Desarrollador Moderno PHPConferenceARLa Caja de Herramientas del Desarrollador Moderno PHPConferenceAR
La Caja de Herramientas del Desarrollador Moderno PHPConferenceAR
 
Desymfony 2011 - Tutorial #1: Instalacion y primeros pasos
Desymfony 2011 - Tutorial #1: Instalacion y primeros pasosDesymfony 2011 - Tutorial #1: Instalacion y primeros pasos
Desymfony 2011 - Tutorial #1: Instalacion y primeros pasos
 
Primeros pasos con Docker
Primeros pasos con DockerPrimeros pasos con Docker
Primeros pasos con Docker
 
.NET Core 1.0 y ASP.NET Core 1.0
.NET Core 1.0 y ASP.NET Core 1.0.NET Core 1.0 y ASP.NET Core 1.0
.NET Core 1.0 y ASP.NET Core 1.0
 
Asp.net 5 en linux , herramientas e integración
Asp.net 5 en linux , herramientas e integraciónAsp.net 5 en linux , herramientas e integración
Asp.net 5 en linux , herramientas e integración
 
BDD con Mink y Behat
BDD con Mink y BehatBDD con Mink y Behat
BDD con Mink y Behat
 
Symfony
SymfonySymfony
Symfony
 
Docker - Entorno de trabajo configurado en 1 minuto [WCBilbao]
Docker - Entorno de trabajo configurado en 1 minuto [WCBilbao]Docker - Entorno de trabajo configurado en 1 minuto [WCBilbao]
Docker - Entorno de trabajo configurado en 1 minuto [WCBilbao]
 
Tech Meetup: Jenkins, the moody buttler
Tech Meetup: Jenkins, the moody buttlerTech Meetup: Jenkins, the moody buttler
Tech Meetup: Jenkins, the moody buttler
 
Meetup V.E.No.M. y docker
Meetup V.E.No.M. y dockerMeetup V.E.No.M. y docker
Meetup V.E.No.M. y docker
 
Evolution INTech - Acceso a bases de datos con Minimal APIs de .NET 6.pptx
Evolution INTech - Acceso a bases de datos con Minimal APIs de .NET 6.pptxEvolution INTech - Acceso a bases de datos con Minimal APIs de .NET 6.pptx
Evolution INTech - Acceso a bases de datos con Minimal APIs de .NET 6.pptx
 
Scraping the web with python
Scraping the web with pythonScraping the web with python
Scraping the web with python
 
Greach 2011 : Creando Plugins Con Griffon
Greach 2011 : Creando Plugins Con GriffonGreach 2011 : Creando Plugins Con Griffon
Greach 2011 : Creando Plugins Con Griffon
 
GUIA DE LABORATORIO PHONE GAP JQUERY MOBILE CARGADO DE_DATOS_DE_REGISTROS...
GUIA DE  LABORATORIO  PHONE GAP JQUERY  MOBILE  CARGADO DE_DATOS_DE_REGISTROS...GUIA DE  LABORATORIO  PHONE GAP JQUERY  MOBILE  CARGADO DE_DATOS_DE_REGISTROS...
GUIA DE LABORATORIO PHONE GAP JQUERY MOBILE CARGADO DE_DATOS_DE_REGISTROS...
 
internet of things day 2014 (presentación)
internet of things day 2014 (presentación)internet of things day 2014 (presentación)
internet of things day 2014 (presentación)
 
Introducción a GitFlow
Introducción a GitFlowIntroducción a GitFlow
Introducción a GitFlow
 
Guía de trabajo doctorado tics freddychavezc
Guía de trabajo doctorado tics freddychavezcGuía de trabajo doctorado tics freddychavezc
Guía de trabajo doctorado tics freddychavezc
 
Guía de trabajo doctorado tics freddychavezc
Guía de trabajo doctorado tics freddychavezcGuía de trabajo doctorado tics freddychavezc
Guía de trabajo doctorado tics freddychavezc
 

Último

BREEAM ES Urbanismo como herramienta para un planeamiento sostenible - Miguel...
BREEAM ES Urbanismo como herramienta para un planeamiento sostenible - Miguel...BREEAM ES Urbanismo como herramienta para un planeamiento sostenible - Miguel...
BREEAM ES Urbanismo como herramienta para un planeamiento sostenible - Miguel...ITeC Instituto Tecnología Construcción
 
PARTES DEL TECLADO Y SUS FUNCIONES - EJEMPLO
PARTES DEL TECLADO Y SUS FUNCIONES - EJEMPLOPARTES DEL TECLADO Y SUS FUNCIONES - EJEMPLO
PARTES DEL TECLADO Y SUS FUNCIONES - EJEMPLOSelenaCoronadoHuaman
 
Introducción a Funciones LENGUAJE DART FLUTTER
Introducción a Funciones LENGUAJE DART FLUTTERIntroducción a Funciones LENGUAJE DART FLUTTER
Introducción a Funciones LENGUAJE DART FLUTTEREMMAFLORESCARMONA
 
Unidad_3_T1_AutomatasFinitos presentacion
Unidad_3_T1_AutomatasFinitos presentacionUnidad_3_T1_AutomatasFinitos presentacion
Unidad_3_T1_AutomatasFinitos presentacionarmando_cardenas
 
Manual de Usuario APPs_AppInventor-2023.pdf
Manual de Usuario APPs_AppInventor-2023.pdfManual de Usuario APPs_AppInventor-2023.pdf
Manual de Usuario APPs_AppInventor-2023.pdfmasogeis
 
Segmentacion Segmantica_Modelos UNET and DEEPLABV3
Segmentacion Segmantica_Modelos UNET and DEEPLABV3Segmentacion Segmantica_Modelos UNET and DEEPLABV3
Segmentacion Segmantica_Modelos UNET and DEEPLABV3AlexysCaytanoMelndez1
 
Caso de éxito de Hervian con el ERP Sage 200
Caso de éxito de Hervian con el ERP Sage 200Caso de éxito de Hervian con el ERP Sage 200
Caso de éxito de Hervian con el ERP Sage 200Opentix
 

Último (7)

BREEAM ES Urbanismo como herramienta para un planeamiento sostenible - Miguel...
BREEAM ES Urbanismo como herramienta para un planeamiento sostenible - Miguel...BREEAM ES Urbanismo como herramienta para un planeamiento sostenible - Miguel...
BREEAM ES Urbanismo como herramienta para un planeamiento sostenible - Miguel...
 
PARTES DEL TECLADO Y SUS FUNCIONES - EJEMPLO
PARTES DEL TECLADO Y SUS FUNCIONES - EJEMPLOPARTES DEL TECLADO Y SUS FUNCIONES - EJEMPLO
PARTES DEL TECLADO Y SUS FUNCIONES - EJEMPLO
 
Introducción a Funciones LENGUAJE DART FLUTTER
Introducción a Funciones LENGUAJE DART FLUTTERIntroducción a Funciones LENGUAJE DART FLUTTER
Introducción a Funciones LENGUAJE DART FLUTTER
 
Unidad_3_T1_AutomatasFinitos presentacion
Unidad_3_T1_AutomatasFinitos presentacionUnidad_3_T1_AutomatasFinitos presentacion
Unidad_3_T1_AutomatasFinitos presentacion
 
Manual de Usuario APPs_AppInventor-2023.pdf
Manual de Usuario APPs_AppInventor-2023.pdfManual de Usuario APPs_AppInventor-2023.pdf
Manual de Usuario APPs_AppInventor-2023.pdf
 
Segmentacion Segmantica_Modelos UNET and DEEPLABV3
Segmentacion Segmantica_Modelos UNET and DEEPLABV3Segmentacion Segmantica_Modelos UNET and DEEPLABV3
Segmentacion Segmantica_Modelos UNET and DEEPLABV3
 
Caso de éxito de Hervian con el ERP Sage 200
Caso de éxito de Hervian con el ERP Sage 200Caso de éxito de Hervian con el ERP Sage 200
Caso de éxito de Hervian con el ERP Sage 200
 

Symfony CRUD app with images, API and deployment

Notas del editor

  1. Hola, soy Angel Roldán, estudié en la UPM y soy senior developer o, como yo creo que me define mejor soy “desarrollador” Podéis seguirme en Twitter y echar un ojo a mi github. La foto es durante las vacaciones cuando estaba relajado y tal.
  2. Un día tranquilo vino muy entusiasmado y me habló durante un rato sobre una idea, os resumo en puntos lo que quería. Tenía una idea de proyecto, algo maravilloso, una idea genial, para ganar mucha pasta, buenísimo para el negocio, un pelotazo. Y yo en plan: cojonudo. Me dijo que era algo simple o sencillo o fácil o algo así. A mí me extrañó porque, bueno, todo lo sencillo está inventado, no? No se me ocurría qué podía ser aquello que nos iba a hacer ganar tanta pasta con tan poco esfuerzo. Luego empezó ya con el rollo MVP, tiene que hacer de todo, tiene que hacerlo razonablemente bien, … ¿pero no era algo simple? Siguió. Que fuera algo sólido porque seguramente habría que ponerlo en producción con usuarios reales. Que fuera escalable. Y que estuviera listo para hoy, ahí ya negocié arduamente y conseguí 3 días o algo así.
  3. Ya tenemos nuestra aplicación web funcional. Se la enseño a Marco tan contento y me felicita pero… y le paro, ya sé por dónde vas mangurrián! Ahora le doy un poco de chapa y pintura