¿Qué es CSS Grid Layout?

Emocionado con este curso. Vamos que si podemos. Crearemos los sitios web del futuro. 💪

Por fin disponible, odio cuando busco un curso en especifico y me sale “disponible tal fecha” jajaja pero lo bueno es que ya esta aquí y vamos a consolidad las bases de CSS grid 😃

La guía de referencia más pedagógica que he visto:
CSS Tricks: GSS Grid Layout

Apuntes:

CSS Grid layout contiene funciones de diseño dirigidas a los desarrolladores de aplicaciones web. El CSS grid se puede utilizar para lograr muchos diseños diferentes. También se destaca por permitir dividir una página en áreas o regiones principales, por definir la relación en términos de tamaño, posición y capas entre partes de un control construido a partir de primitivas HTML.

Al igual que las tablas, el grid layout permite a un autor alinear elementos en columnas y filas. Sin embargo, con CSS grid son posibles muchos más diseños y de forma más sencilla que con las tablas. Por ejemplo, los elementos secundarios de un contenedor de cuadrícula podrían posicionarse para que se solapen y se superpongan, de forma similar a los elementos posicionados en CSS.

Hola. Les comparto mis notas del curso.
https://plaid-silver-f03.notion.site/Curso-de-CSS-Grid-B-sico-9510f9f38dbc48709b504d74aec48ef3

El primer curso que tomo en el Platzi Day. Sin duda alguna CSS tiene tantas características. Es muy importante para nuestra ruta de formación.

Ya manejo del back Node.js, con Express y React en el front, sé consumir apis res y crear mis propias bases de datos con postgreSQL o MongoDb, pero sin CSS se siguen viendo como si estuvieran hechas en los 90as. Creo que por aquí van los tiros

Justo ayer hice una calculadora y utilicé flexbox, de verdad me costó demasiaaaaado colocar un par de botones debido a la posición que yo necesitaba y porque obviamente tenía que ser responsive, y cuando vi la rejilla en el video supe que en ese momento, grid era lo que necesitaba, me hubiera facilitado tanto la vida empezar este curso dos días antes jaja

Hola! Les dejo el link con lo que podrán logran al terminar este curso, incluyendo el proyecto final 😁

Todos los desafíos del curso
Repositorio del curso
Proyecto Final
Repositorio del proyecto final

y yo sufriendo con position 😣

aquí por el reto del portafolio vamos gente 😄

Apuntes / Resumen / Notas 😊

Hey! Este curso es muy cool así que te dejo un pequeño resumen hecho en canva. Además, te dejo los apuntes que fui tomando de mis compañeros y mis propias notas, todo en un solo lugar GitHub.

Importante: Estos apuntes te servirán para el Curso Profesional de CSS Grid Layout 😄
📌 Ayúdame a mejor estos apuntes, déjame tus comentarios y aportes aquí debajo. Bye!!

Por favor enseña mas cursos de desarrollo web!!! Este curso lo entendí al 100% gracias a usted!

Emocionado de aprender CSS Grid para luego por fin empezar a aprender a programar en JavaScript.

El Curso que necesitaba 😄

CSS Grid → Grillas con columnas y filas 😄

Tarde pero deseando aprender!

Ahora toca el turno a CSS Grid, ya se Flexbox, a seguir preparandonos y nunca pares de aprende !!!

Excelente introducción!! Emocionado de iniciar este curso.

cada curso de platzi es muy bueno y pertinente, espero este no sea la excepción!!

Grid CSS!!!

let’s go to the end of the course ╰(°▽°)╯.

Finalmente, llevo queriendo ver este curso ya días y por fin.
Vamos con todo 💚

Por fin disponible el curso , ahora a seguir dandole en el aprendizaje de CCS grid.

Vamos!!

Muchas expectativas con este curso …mas conocimienro mas sabiduria

Ya lo estaba esperando con mucha ansia…

Backend developer here!

A por todas para domar el front!

CSS Grid Layout es un módulo de diseño en Cascading Style Sheets (CSS) que permite crear diseños de página en dos dimensiones de manera más fácil y eficiente. Proporciona una cuadrícula bidimensional flexible que permite colocar y organizar elementos en filas y columnas.

🙌🏻Vamos, qué si podemos!!!💪🏻

Me gusta este tema, con toda.

CSS Layout es una especificacion de CSS para implementar grillas en un sistema de dos dimensiones rows and columns, permitiendo jugar con cada una de las celdas al dejar diseñar areas y jugar con cada uno de los items de estas. Muy interesante el curso. Gracias Plazi

Hoy los diseñadores cuentan con dos métodos para implementar un diseño dinámico: además de CSS grid, también se puede usar Flexbox. Sin embargo, las dos técnicas difieren en algunos aspectos.

Flexbox es unidimensional. Esto quiere decir que los elementos solo se pueden mover a lo largo de un eje. En cambio, un diseño CSS grid ofrece al diseñador web dos dimensiones para la colocación de los objetos porque, en lugar de solo un eje, permite crear una rejilla con filas y columnas.

Tomado de
https://www.ionos.es/digitalguide/paginas-web/creacion-de-paginas-web/css-grid-layout/

Vamos a seguir sumando cursos!! A por todas!

Hola a todos, acá les dejo todos los ejercicios realizados en la clase, los retos y el proyecto final para el que quiera verlos:

• Online:
  https://joffur.github.io/cursoCSSGridBasico/
• Repositorio:
  https://github.com/joffur/cursoCSSGridBasico

Nunca paren de aprender 💚

tengo espectativas de este curso!

Un layout es la estructura visual de cómo quedaría la página web, se hace en forma de bloques y el GRID de CSS permite tener una red o matriz de espacios donde colocar ese diseño de Layout

👋Será un gusto estudiar con ustedes banda, a darle!

que emocion empezar con este nuevo curso, se nota super interezante

Deseando poder sacar el mayor provecho a este curso y entender mejor como posicionar espacios en mis sitios web. Éxito a todos

Wow! crei que seria mas enfocado a los fundamentos de CSS pero me agrada el tema dle Layout

A punto de terminar la primera fase del reto, lastima que ya se termino pero emocionado por seguir aprendiendo 😄

Genial! comenzemos!

Y @teffcode …??

Uno de retos de CSS es poner posicionar de manera optima los elementos. Así que si, estoy muy emocionado con este curso.

Vamos con todo…

Siento que con este curso voy a solucionar muchas dudas que tengo en los layuots.

Ok comenzamos el reto…

e pueden crear distintos tipos de layouts dependiendo del Viewport. Esta es una de las mayores fortalezas de CSS Grid

Les dejo un artículo interesante de lo que es CSS Grid
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout

“y no discriminacion” enserio?

Es una especificación de CSS que nació por la necesidad de hacer layouts mucho más básicos.

Recomiendo velocidad 1.25x o 1.5px

A complementar con Css Grid!!

Vamos a empezar con la mejor actitud

Here we go ! I am used to use flexbox, but it’s time to learn how to use grid well. 👨🏻‍💻

Poster CSS Grid

👇 👇

Cheatsheet CSS Grid

CSS GRID, esta compuesto por filas y columnas, y es para posicionar elementos de manera mas fácil trabajando con esos dos ejes y ponerlos en cualquier posición que queramos

Listo para empezar

woowowowwowowowowowowowowowowow mis hormonas se disparan por este curso nuevo …XD

Let´s Go!!! Espere un monton este curso!! 🔥🔥🔥

Uff, cuánta expectativa y ganas de aprender CSS grid tengo! Nunca lo he usado y vengo de varios cursos donde he visto algunos conceptos. Vengo también de iniciar mi aprendizaje de flexbox, por lo que quiero seguir enriqueciendo mi camino de frontend developer 😃

Espero en este curso aprender Ese es uno de los temas mas complejos que vi de css

interesante…

Here we go, con estos nuevos aprendizajes

listo para comenzar

Vamos a aprender grid! siempre me ha dado duro grid poco a poco iremos aprendiendo

Extraño mucho el curso de CSS Grid con Leonidas, los ejercicios que hicimos estuvieron muy padres pero al dejar de practicar, he olvidado como se usaba. Tengo muchas ganas de volver a repasarlo y aprenderlo correctamente.
Muy feliz de por fin poder tomar este curso 😎

Super emocionada por llevar este curso!

Genial, Vamo a profundizar en el tema. Vamo a darlee

no hay slide, github o algo en que guiarnos de los recursos para este curso??

Emocionado por comenzar el curso. Se ve interesante.

Vamos a por todo con este magnifico curso.

Cuando uno aprende esto, siente que cambia la forma de ver las cosas. 😃

Excelente curso, muy interesante

Eh!! Emocionado de aprender CSS Grid 🥳