Introducción al proyecto

Clase 35 de 42 • Curso de Preprocesadores CSS

Resumen

Vamos a integrar todas nuestras páginas en un proyecto final llamado PlatziGames. Toma en cuenta que vas a requerir tener completado el módulo de Sass ya que lo vamos durante este último módulo.

Christian Velázquez

student•

En lo particular usaría "Sass". Considero que, para proyectos muy cortos de tiempo, usaría "Stylus".

Efraín Hernández García

student•

Si, muy buena observación

Ramon Duthil

student•

stylus tiene una sintaxis mas amigable .. pero el que come de todo no se muere de hambre jajajaja así que el conocimiento nunca ocupa espacio.muy contento con este curso

Jorge Cruz Perez

student•

Para que la estructura de la etiquetas html quede bien estructurada, como se ve el html:

hay que corregir los siguientes typos

Archivo head.pug agregar block body //use body porque es la seccion que sigue
2, El archivo pagina-principal.pug de esto:
a esto:

MATTHEUV OSORIO CARDONA

student•

Alguien tiene el crack de Prepros?

Wilson Orlando Capacho Carmona

student•

jajaja las cosas de la vida

Germán González

student•

x2 HAHAH

Carlos Dugarte

student•

¿Soy el único que al descargar la carpeta el proyecto ya está hecho? 😅

Jeremías San Martín

student•

x2 ¿Existe otro archivo? Creo que el profe se le fue ese detalle, nos hizo la tarea jajajaj

Carlos Dugarte

student•

Yo lo que hice fue borrar todo para quedar a la par del punto de inicio del curso. Pero ya vi el final 🤣🤣🤣

Gonzalo Pimentel

student•

Si Sass incluiría Stylus sería perfecto en mi opinión jaja

David Antonio Garcia Saaib

student•

Si van a usar SASS y PUG en el proyecto ya tengo aquí un entorno con webpack para trabajarlo.

Esta es la guía:

Entras a este repositorio que es donde se encuentran mis ejercicios del curso. Antes que nada podrás ver carpetas llamadas sass, less, pug y stylus, pero la importante es “supergames”.
Clona el repositorio en tu PC desde terminal con git clone https://github.com/adranuz/preprocesadores.
Identifica la carpeta “supergames” y sácala de la carpeta “preprosesadores”, ponla en algún lugar donde tengas tus proyectos. La idea es que tengas tu propio repositorio.
Abre terminal en tu proyecto e inicia tu repositorio con git init.
Instala las dependencias de npm necesarias para el proyecto para que webpack pueda funcionar con npm install.
Corre el npm run serve para ver tu proyecto vivo. Los demás comandos los encontrarás en el package.json.
Puedes visitar cada una de las URL por separado para verificar que funcionen…

Listo, ya tienes tu proyecto tal y como lo dejó el profesor en esta clase, pero funcionando con webpack.

Recuerda que en el entorno propuesto algunas rutas han cambiado.

PD: Suerte!

David Antonio Garcia Saaib

student•

Sass es el mas utilizado en la industria hasta lo que conozco, y como son practicamente lo mismo, es mejor ser bueno en uno y pasar luego a otro que saber poco de todos.

Dennis Bejar Challco

student•

sass no tiene tantos errores como stylus

David Antonio Garcia Saaib

student•

alguien ha podido hacer el proyecto con webpack?

Anfernee Valera

student•

Sass de mi corazón♥ esperemos que saquen un curso mas actualizado de sass.

Platzi Team

student•

Genial, vamo a darle

Jhonatan David Ibarra Lavado

student•

sigamos :D

Alejandro Ramos

student•

ya vino con los estiloasdj klsajdlkasdj

Carlos Mazzaroli

student•

Si después de clonar el repositorio se encontraron que el proyecto ya estaba hecho xD, en editor borren el archivo de la carpeta css, y hagan el sass --watch platzi-games.scss platzi-games.css para empezar de 0 todo xD

Franklin Peñafiel

student•

a mi me fucionó el siguiente código. Quise enviarle a la carpeta de css y no quedarme en la misma carpeta

sass --watch sass/platzi-games.scss:css/platzi-games.css

Andrés Camilo Ramos Romero

student•

No me decido entre Sass y Stylus

Stylus gana por su sintaxis sencilla, pero encontre mas herramientas y cosas para Sass

Brayan Ramirez Alzate

student•

a estas alturas del curso prepros me esta empezando a dar errores :(

Irving Juárez

student•

A mi ya me harto porque no tengo licensia de prepros y a cada rato me lo esta recordando :(

Anfernee Valera

student•

Cámbiense al lado de la terminal, tenemos npm, apuestas y mujerzuelas. xd

David Antonio Garcia Saaib

student•

He estado haciendo todo el curso con webpack, pero no se como hacer que las plantillas de pug funcionen como router tanto en desarrollo como en produccion. Si alguien tiene la respuesta estaria genial

Andrés David Loaiza Zamudio

student•

Vamos que vamos

Fernando Galdós

student•

Sigamos aprendiendo