CMS Optimizado para SEO - Arquitectura SaaS

Desarrollo de CMS optimizado para SEO con arquitectura SaaS

Transcript

1. CMS Optimizado para SEO - Arquitectura SaaS Juan E. Huamani Mendoza @erajuan
2. …. YO SOY Juan E. Huamani Mendoza Desarrollador Backend: Python (Django y Flask), PHP, C# .net Desarrollador Frontend: JS, Angular, VueJS, Bootstrap, Bulma, Materializecss, etc DevOps: Debian, AWS, Apache2, NGINX, E-MAIL SERVER, etc y Publicidad... pymes.com.pe Páginas Web viajero.io / agencia.viajero.io Plataforma de reservas Tours / Paquetes
3. Crear una páginas web - Instalar un CMS una y otra vez - Configuración de plugin, módulos una otra vez - Dificultad de configuración - Una hosting sobrecargado de aplicaciones (DNS, EMAIL, BD, ETC) - Tiempo de latencia > - Costos de mantenimiento (Backup, Cambiar de Servidor, etc) - Vulnerabilidades Conocidas - Seguridad - Administrable por le usuario final (Muchas Opciones)
4. Crear un CMS Cómo y por donde empezar
5. CMS Mínimo - Contenido - Blog de Sitio Web - Formularios - Categoría de contenidos - Menús - Slider (Imágenes que rotan) - Galería de Fotos - Redes sociales - Editor WYSIWYG (CKeditor) - Optimizado para SEO - Google Analytics - Custom CSS y JS
6. Quiero crear muchas páginas Problemas... CMS DB CMS DB CMS DB Sol AMAZON
7. Hacer muchas páginas web…. Distribuir en varios server - Instalar varias veces Más Bases de datos (Replicar solo base de datos) - Crear bases para cada web - Varias configuraciones de producción (Django, Apache, etc) * tarea replicar los nuevos releases CMS DB 1 DB 2 DB 3
8. SIGUE SIENDO DIFÍCIL DE USAR...
9. Nueva Arquitectura CMS (Multisite) DB RENDER 1 RENDER 2 RENDER N . . . . . . . W i W 1 X j X 1 Y k Y 1
10. Características - Multi site - Sistema de Plantillas - Multi idioma - Tipos de Contenido (Tour, Room, Básico, Servicio, etc) - Blog de Sitio Web - Formularios - Categoría de contenidos - Menús y Menú Multinivel - Slider (Imágenes que rotan) - Galería de Fotos - Redes sociales - Editor WYSIWYG (CKeditor) - Optimizado para SEO - Google Analytics - Píxel de Facebook - Custom CSS y JS - Bloques Customizables - Integración con Widgets - AMP - CDN y Servidor de imagenes RÁPIDO, VELOZ
11. CMS (Multisite) DB RENDER 1 RENDER 2 RENDER N . . . . . . . W i W 1 X j X 1 Y k Y 1 CDN css, js FILE SERVER Imagenes, Files
12. Detalles de cada componente
13. CMS - Clases a Tablas (ORM) - CRUD - ADMIN - API - Configuración - Pase a producción web --------------------- id domain …... menu --------------------- id …… web_id node --------------------- id …… category_id (FK) node_type web_id slider --------------------- id …… web_id * No constrain en web_id
14. Multi site
15. Dashboard de un sitio
16. LA VERDAD SIGUE SIENDO DIFÍCIL DE USAR para algunos PROYECTO COMPLETO: https://gitlab.com/pymes.com.pe
17. RENDER TWIG PHP (Flexible, Rápido, Seguro, etc) 1. rewrite: dominio.com/es/about.html (string) 2. API.GET(web_id, token, estructura del sitio), guardar en json 3. Petición: Analizar URL 4. 1ra Petición:API.GET(web_id, token, url), guardar en JSON -> Renderizar contenido->reponder 5. 2da Petición: decodificar JSON -> Renderizar contenido -> responder 6. Limpiar cache (Enviando variables por GET)
18. PLANTILLAS Variables disponibles: SITE: Toda la información de la página web {{site.name}} PAGE: Toda la información de la estructura del idioma {{page.language}} NODE: Información del node {{node.title}} Maquetar páginas web usando cualquier framework (Bootstrap 3-4, Bulma, ETC) el DISEÑO decide donde renderizar un variable
19. CREAR PLANTILLAS - Estructurar archivos de acuerdo al tipo - Herencia de plantillas - Customizar SCSS - Registrar la plantilla en el CMS - compilar scss a .min.css - gzip -9 style.min.css - Subir css y js a S3
20. UPLOAD CSS Y JS ->AWS AMAZON ## Upload to S3-Amazon ## Configuration for upload to S3 Amazon storage class: Use Reduced Redundancy Storage: Set true Everyone: Open/Download - Read Expires: Thu, 31 Dec 2099 20:00:00 GMT Cache-Control: max-age=94608000 Content-Encoding: gzip
21. Fin Gracias https://web.facebook.com/erajuan https://twitter.com/erajuan https://stackoverflow.com/users/4143613/erajuan https://gitlab.com/erajuan