• Saltar a la navegación principal
  • Saltar al contenido principal
  • Saltar al pie de página
Freelandev

Freelandev

Vivir del desarrollo en WordPress

  • Apple
  • Ivoox
  • Spotify
  • Google Podcast
  • ¿Por qué Freelandev?
  • Podcast
    • Perspectiva WordPress
    • Entrevistas a profesionales WordPress
  • Quiénes somos
  • Contacto

#69 – Hablamos de CSS

29/06/2020 por Nahuai y Esther 11 comentarios

Freelandev - Vivir del desarrollo en WordPress
Freelandev - Vivir del desarrollo en WordPress
#69 - Hablamos de CSS
00:00 / 42:30
RSS Feed
Share
Link
Embed

Síguenos en:

itunesspotifyivooxgoogle podcasts

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

Cómo integrar Restrict Content Pro con Factura Directa – Enfoque 1

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

Mostrar la coletilla legal de la RGPD en formato acordeón en formularios de Gravity Forms

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

Lanzamiento de Mai Reach

Añadido a la lista de temas optimizados para Gutenberg y añadidos ciertos matices (Winning Agent Pro):

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
  • 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…) y Genesis Custom Blocks Pro.

Etiquetado como: CSS

Interacciones con los lectores

Comentarios

  1. César dice

    29/06/2020 a las 16:04

    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 🙂

    Responder
    • esther dice

      29/06/2020 a las 16:53

      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!

      Responder
    • Nahuai Badiola dice

      01/07/2020 a las 15:10

      ¡Aupa, César!

      Se te permite y se te agradece el aporte, lo añadimos a la lista de recursos. 😉

      Un abrazo.

      Responder
  2. David Pérez dice

    30/06/2020 a las 17:21

    Gracias chicos por la mención! Me alegro que os gustara y espero que os migréis pronto a Visual Code!

    Responder
    • esther dice

      01/07/2020 a las 09:31

      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!

      Responder
    • Nahuai Badiola dice

      01/07/2020 a las 15:12

      Buenas, David.

      Gracias ti por la aportación.
      Iremos contando nuestra evolución por aquí. 😉

      Un abrazo.

      Responder
  3. Jesús Yesares dice

    01/07/2020 a las 13:47

    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

    Responder
    • Nahuai Badiola dice

      01/07/2020 a las 15:13

      ¡Aupa, Jesús!

      Muchas gracias por la recomendación.
      Ya comentaré que tal me va con ella. 😉

      Un abrazo.

      Responder
    • esther dice

      01/07/2020 a las 15:21

      Muchas gracias Jesús! Yo también la probaré a ver que tal.

      Un abrazo!

      Responder
  4. Aleix dice

    21/07/2020 a las 18:01

    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

    Responder
    • Nahuai Badiola dice

      21/07/2020 a las 20:01

      ¡Aupa, Aleix!

      Un placer. 😉

      Y muchas gracias por compartir los recursos, los añado a nuestra lista en el post.

      ¡Un abrazo!

      Responder

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Footer

Nuestros proyectos

  • Nahuai Badiola
  • esther solà
  • Tranquilidad WP
  • Código Genesis
  • OsomPress

Escúchanos

  • iTunes
  • iVoox
  • Spotify

Sobre Freelandev

¿Emprender online como desarrollador WordPress? Aprende a gestionar tu negocio digital con esther solà y Nahuai Badiola, freelancers y desarrolladores WordPress especializados en Genesis Framework y WooCommerce. Descubre cada lunes sus estrategias de marketing digital, cómo se organizan y qué herramientas usan en el día a día.

© 2023 · Dakota theme by OsomPress · Aviso legal