Desarrollo web eficiente

2,819 views

Published on

Desarrollo web eficiente con CodeIgniter y HTML5: técnicas de automatización para implementar un framework de trabajo y código, minimizar los pasos para iniciar un proyecto en PHP/HTML5 y usar las mejores prácticas disponibles.

Published in: Technology, Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,819
On SlideShare
0
From Embeds
0
Number of Embeds
576
Actions
Shares
0
Downloads
49
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • PaulIrish, Google Chrome y jQuery
  • Modular Extensions – HMVCHMVC stands for Hierarchical Model View Controller.
  • Desarrollo web eficiente

    1. 1. Desarrollo web eficiente<br />…con CodeIgniter y HTML5<br />Por David Lima Cohen<br />@limacohen<br />
    2. 2. El problema<br />Programar != Estimar<br />Tareas repetitivas:<br />Registrar dominio y configurar DNS<br />Crear servidor virtual (HTTP, DB, versionado, etc…)<br />Preparar entorno local<br />Implementar frameworks (PHP, HTML, CSS, JS)<br />Estructura común:<br />Estilo, fuente y colores<br />Meta tags<br />Robots/Humans.txt<br />Sitemap<br />Favicon/Apple Touchicon<br />Soporte cross-browser/os/device<br />
    3. 3. Estimar bien.<br />Medir el tiempo invertido:<br />Toggl: http://www.toggl.com/<br />FogBugz: http://www.fogbugz.com/<br />Paymo: http://www.paymo.biz/<br />FreshBooks: http://www.freshbooks.com/<br />Tick: http://www.tickspot.com/<br />
    4. 4. Analizar nuestros tiempos (y su ROI)<br />Entender nuestra capacidad de estimación<br />
    5. 5. Resultado: un frameworkde trabajo<br />FogBugz<br />Case Importer<br />FogBugz<br />Toggl<br />FogBugz Case Importer: http://bit.ly/FBCaseImporter<br />
    6. 6. Implementación del framework<br />CSS: 960.gs<br />PHP:<br />CodeIgniter<br />HTML5:<br />Boilerplate<br />JS: jQuery<br />
    7. 7. Undosinfinitos: SVN<br />http://subversion.tigris.org/<br />…o simplemente Dropbox<br />http://www.dropbox.com/<br />
    8. 8. Agregando robots.txt y sitemap.xml<br />A modo referencial, dependiendo del sitio se pueden/deben actualizar manualmente o mediante una lógica particular. <br />
    9. 9. Implementando CodeIgniter (1.7.3)<br />http://codeigniter.com/<br />/public/system contiene los archivos normales de CodeIgniter mientras que la lógica de nuestra aplicación se encuentra en /app, fuera del /public<br />
    10. 10. Creamos un .htaccess<br />Encargado de variables del servidor, ocultar el index.php y redireccionar URLs.<br />
    11. 11. Lo aburrido de CI…<br />Cambiar el dir. de aplicación, la URL base, generar una clave de encriptación, activar el filtro XSS, modificar el controlador predeterminado, etc…<br />
    12. 12. Agregamos 960.gs<br />http://960.gs/<br />Adicionalmente unificamos los 3 archivos .css y usamos el YUI Compressor para packearlo<br />
    13. 13. Agregamos jQuery (1.5.0)<br />http://jquery.com/<br />Como soporte local, ya que por performance lo llamamos directo desde Google APIs<br />
    14. 14. Preparamos nuestro CSS<br />
    15. 15. La cabeza de nuestra aplicación<br />http://html5boilerplate.com/<br />
    16. 16. Nuestra plantilla en HTML5<br />http://html5boilerplate.com/<br />
    17. 17. Implementando HTML5 Boilerplate<br />http://bit.ly/HTML5BPgh<br />
    18. 18. http://initializr.com/<br />
    19. 19. Módulos y Templates: re-usando la rueda<br />http://bit.ly/CIHMVC<br />http://bit.ly/CISTLib<br />
    20. 20. CRUD: GenericTable-Editor<br />http://www.bird.li/TableEditor/<br />
    21. 21. Adminbackend: Rapydframework<br />http://www.rapyd.com/<br />
    22. 22. CMS: Fuel CMS<br />http://www.getfuelcms.com/<br />
    23. 23. Integración rápida con Facebook, Twitter, etc.<br />http://www.haughin.com/code/<br />
    24. 24. El resultado<br />Aplicaciones/sitios web desarrollados en forma eficiente, con las mejores prácticas, en HTML5 y con un sólido framework base en PHP.<br />
    25. 25. ¡Muchas gracias!<br /><ul><li>limacohen.com
    26. 26. david@limacohen.com
    27. 27. @limacohen</li></ul>¿Querés aplicar esto?<br />.com.ar<br />“Do or do not. There is no try.”<br />

    ×