A menudo dejado de lado como lenguaje de programación frente a sus «hermanos mayores», a nuestro parecer el CSS no tiene la fama que debería tener, teniendo en cuenta todo lo que podemos llegar a hacer con él.
A nosotros nos encanta y es algo que seguramenet se notará en este episodio. 😉
¿Qué tal la semana?
Semana esther
Corta y bastante tranquila, con poco tiempo productivo (San Juan, entrevistas con tutores, graduación..)
Problemas rendimiento web (theme premium con Visual Composer + Revolution Slider + WPML)
WPMalaga David Perez: Snippets para Visual Studio Code
Contenido esther
Tutorial para SiliCodeValley sobre conectar Restrict Content Pro y Stripe con Factura Directa
Semana Nahuai
Bastante tranquila con una migración que le dio un poco de emoción…
Directo de la Alianza NED en la que hablamos de cómo colaborar y delegar en proyectos web.
Charla de Jodi Sala sobre copias de seguridad en la Meetup de WordPress Barcelona.
Charla sobre Block-based themes y Full Site Editing organizada por Gutenberg Times. Muy interesante que ya hay un bloque para sacar el loop (Query).
Contenido Nahuai
Tema de la semana:
CSS es básico junto con HTML y algo de JS para desarrollo web, aunque seas implementado WordPress
Algunos temas de los que hemos comentado:
- Especificidad y prioridades
- Conocer bien el tipo de selectores y pseudo-selectores
- Dominar Flex y Grid para maquetar
- Pseudoelementos (::before y ::after) para añadir iconos/sombras
- Propiedades :not() y :lang()
- Variables / propiedades personalizadas -> ideal para combinar con JS
Charlas Aleix Martí sobre variables CSS:
Recursos interesantes:
- CSS Tricks -> tutoriales desde básicos a más avanzados
- https://www.freecodecamp.org/ -> retos para practicar CSS muy practico (Grid, Flexbox…)
- https://codepen.io/ -> para encontrar ejemplos y practicar
- https://caniuse.com -> para conocer al nivel de soporte para cada navegador
- CSS Reference: https://www.w3schools.com/cssref/
- CSS Handbook: https://www.freecodecamp.org/news/the-css-handbook-a-handy-guide-to-css-for-developers-b56695917d11/
- Documentación de Mozilla (¡gracias, César!)
- https://flexboxfroggy.com (¡gracias, Aleix!)
- https://cssgridgarden.com (¡gracias, Aleix!)
Novedades
Tip de la semana
Ejemplos de maquetación preparados con CSS Flexbox: https://philipwalton.github.io/solved-by-flexbox/
Caniuse: https://caniuse.com/
Últimos días para aprovechar la oferta trimestral de Código Genesis.
Gracias a:
Este episodio está patrocinado por StudioPress, los creadores de Genesis Framework, el entorno de trabajo de temas más popular de WordPress.
Ya está disponible Genesis Pro para todo el mundo, 360$ anuales que dan acceso a:
- Genesis Framework
- + 35 child themes de Genesis de StudioPress
- 1 año de hosting en WP Engine
- Plugin Genesis Pro (Diseños y secciones, restricción de bloques por usuarios…)
Si se me permite, aunque W3Schools en general está bien, tiene sus problemas. Una alternativa interesante es la Mozilla Developer Network, que tiene referencias y tutoriales bastante arreglados. La parte de CSS la tenéis en https://developer.mozilla.org/en-US/docs/Web/CSS. Y me parece que últimamente alguien le ha dado un repaso importante a buena parte de las traducciones de tanto CSS como HTML a español y catalán 🙂
Hola César!
Muchas gracias por la recomendación!
Yo para JavaScript si que suelo consultar la documentación de MDN, pero para CSS por costumbre iba a W3School.
Me lo apunto!
¡Aupa, César!
Se te permite y se te agradece el aporte, lo añadimos a la lista de recursos. 😉
Un abrazo.
Gracias chicos por la mención! Me alegro que os gustara y espero que os migréis pronto a Visual Code!
Gracias a ti David!
Yo ya estoy en ello… sólo me falta acordarme de los comandos de tu extensión, que no son pocos… jejeje
Un abrazo!
Buenas, David.
Gracias ti por la aportación.
Iremos contando nuestra evolución por aquí. 😉
Un abrazo.
Buenas chicos, preguntaba Nahuai si había algún plugin para Visual Studio Code para FTP. Os recomiendo SFTP, funciona de maravilla, todo integrado. De verdad, ahora mismo VSC es lo mejor que hay.
https://marketplace.visualstudio.com/items?itemName=liximomo.sftp
¡Aupa, Jesús!
Muchas gracias por la recomendación.
Ya comentaré que tal me va con ella. 😉
Un abrazo.
Muchas gracias Jesús! Yo también la probaré a ver que tal.
Un abrazo!
Voy tarde, pero me estaba poniendo al día de podcasts ¡Muchas gracias por la mención, qué ilusión!
Aprovecho para dejar un par de recursos divertidos para aprender Flexbox y Grid:
https://flexboxfroggy.com
https://cssgridgarden.com
¡Aupa, Aleix!
Un placer. 😉
Y muchas gracias por compartir los recursos, los añado a nuestra lista en el post.
¡Un abrazo!