Creando un email de recibo de compra

Clase 20 de 21 • Curso de Foundation 2018

Resumen

Aprende a instalar Foundation for emails desde el principio, independientemente del sistema operativo que uses.

Identifica sus templates para ir adaptando tus proyectos de emails a este nuevo framework, en este caso con el ejemplo de Email de Recibo de Compra.

Belen Ceballos

student•

npm run build

el comando para transformar nuestras páginas en HTML

Rafael Jair Sanchez Alviso

student•

Creo que voy a utilizar foundation para crear emails es mucho mas sencillo a la hora de crearlos

Harold David Avila Sabogal

student•

buen apunte

Jhean Pacheco

student•

Aunque no soy muy fan del uso de Frameworks Frontend me parecen una excelente ayuda para ahorrar tiempo en la construcción de sitios web. Muy buen curso, aunque un poco desactualizado pero se comprendió muy bien.

Jorge Velasquez

student•

Después de muchos errores logre subir el proyecto. El primer Error se presento ya que al parecer , en algún momento, la gente de Gulp cambió su etiqueta o rama para 4.0, por lo que package.json debe actualizarse a v4.0.0; esto lo corregí manualmente en el archivo package.json, cambie la versión. Antes: " gulp " : " git + https: //github.com/gulpjs/gulp.git# 4 .0 " , Después: " gulp " : " git + https: //github.com/gulpjs/gulp.git# v4.0 .0 " , Luego corrí el comando npm install

El siguiente error fue este; Falló en la secuencia de comandos postinstall # 4430 de node-sass@3.13.1.

Solución: correr este comando npm install --save-dev gulp-sass@latest y por ultimo correr foundation watch, y listo solución a todos mis problemas, espero les sirva.

Roger Carlos Ariel Alba

student•

Hola a todos! de nuevo el sitio de foundation cambio. Ahora es:

Reynaldo Francisco Moreno Briceño

student•

Excelente!

Naldo Duran

student•

Teofilo Rosales Gama

student•

tengo problemas con el node-sass v3.13.1 parece que ya no existe, y sin eso no e puede compilar y el error me dice lo siguiente:

 foundation-emails-template@1.0.0 start C:\Users\TEOFILO\Documents\Correo-foundation
> gulp

[20:48:34] Failed to load external module @babel/register
[20:48:34] Requiring external module babel-register
[20:48:50] Using gulpfile ~\Documents\Correo-foundation\gulpfile.babel.js
[20:48:50] Starting 'default'...
[20:48:50] Starting 'build'...
[20:48:50] Starting 'clean'...
[20:48:50] Finished 'clean' after 28 ms
[20:48:50] Starting 'pages'...
[20:48:52] Finished 'pages' after 2.36 s
[20:48:52] Starting 'sass'...
[20:48:56] 'sass' errored after 3.93 s
[20:48:56] Error: Node Sass does not yet support your current environment: Windows 64-bit with Unsupported runtime (64)
For more information on which environments are supported please see:
https://github.com/sass/node-sass/releases/tag/v3.13.1
    at module.exports (C:\Users\TEOFILO\Documents\Correo-foundation\node_modules\gulp-sass\node_modules\node-sass\lib\binding.js:13:13)
    at Object.<anonymous> (C:\Users\TEOFILO\Documents\Correo-foundation\node_modules\gulp-sass\node_modules\node-sass\lib\index.js:14:35)
    at Module._compile (internal/modules/cjs/loader.js:689:30)
    at Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Object.require.extensions.(anonymous function) [as .js] (C:\Users\TEOFILO\Documents\Correo-foundation\node_modules\babel-register\lib\node.js:152:7)
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:20:18)
[20:48:56] 'build' errored after 6.34 s
[20:48:56] 'default' errored after 6.35 s
Error: foundation-emails-template@1.0.0 start: `gulp`
Exit status 1
    at EventEmitter.<anonymous> (C:\Users\TEOFILO\AppData\Roaming\npm\node_modules\foundation-cli\node_modules\npm\lib\utils\lifecycle.js:217:16)
    at EventEmitter.emit (events.js:182:13)
    at ChildProcess.<anonymous> (C:\Users\TEOFILO\AppData\Roaming\npm\node_modules\foundation-cli\node_modules\npm\lib\utils\spawn.js:24:14)
    at ChildProcess.emit (events.js:182:13)
    at maybeClose (internal/child_process.js:961:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:250:5)

Diego Forero

Team Platzi•

Instala una versión actualizada de node-sass ya que la versión 3.13.1 solo tiene soporte hasta node 7, para versiones nuevas de node debes instalar la versión más reciente en este momento es la 4.9.3

Teofilo Rosales Gama

student•

fue lo primero que hice pero sigue sin funcionar

Daniel Muñoz Martín

student•

Cómo podría utilizar Foundation para enviarlos por Gmail por ejemplo ?

Diego Forero

Team Platzi•

No va a funcionar todo por las restricciones que tienen los diferentes clientes de correo, te recomiendo que para esto ves el curso de diseño de emails https://platzi.com/clases/diseno-email-2016/ y en 1 mes sale la nueva versión del curso.

Daniel Muñoz Martín

student•

perfecto, entonces me esperaré no hay problema muchas gracias Diego 👍🏻

Norma Constanza Giraldo Reyes

student•

Alguien podría ayudarme con este error, no sé si es por la versión de node que estoy usando que es la v10.15.3

npm ERR! git rev-list -n1 4.0: fatal: ambiguous argument '4.0': unknown revision or path not in the working tree. npm ERR! git rev-list -n1 4.0: Use '--' to separate paths from revisions, like this: npm ERR! git rev-list -n1 4.0: 'git <command> [<revision>...] -- [<file>...]' npm ERR! git rev-list -n1 4.0:

Cuando instalo node manualmente luego me sale el siguiente error al intentar correr el foundation watch

sh: gulp: command not found Error: foundation-emails-template@1.0.0 start: gulp spawn ENOENT at ChildProcess.<anonymous> (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/lib/utils/spawn.js:17:16) at ChildProcess.emit (events.js:189:13) at maybeClose (internal/child_process.js:970:16) at Process.ChildProcess._handle.onexit (internal/child_process.js:259:5)

Manuel Durán

student•

Hola prueba instalar el gulp de manera global

npm install --global gulp-cli

Salu2

Manuel Durán

student•

Tambien estuve revisando tu problema a fondo y encontré con esto: posiblemente te ayude.

https://github.com/foundation/foundation-emails/issues/920

Juan Ramirez

student•

Super util crear emails de una manera tan simple

Diego Alfonso Najera Ortiz

student•

Muy buen curso!

 foundation-emails-template@1.0.0 start C:\Users\TEOFILO\Documents\Correo-foundation
> gulp

[20:48:34] Failed to load external module @babel/register
[20:48:34] Requiring external module babel-register
[20:48:50] Using gulpfile ~\Documents\Correo-foundation\gulpfile.babel.js
[20:48:50] Starting 'default'...
[20:48:50] Starting 'build'...
[20:48:50] Starting 'clean'...
[20:48:50] Finished 'clean' after 28 ms
[20:48:50] Starting 'pages'...
[20:48:52] Finished 'pages' after 2.36 s
[20:48:52] Starting 'sass'...
[20:48:56] 'sass' errored after 3.93 s
[20:48:56] Error: Node Sass does not yet support your current environment: Windows 64-bit with Unsupported runtime (64)
For more information on which environments are supported please see:
https://github.com/sass/node-sass/releases/tag/v3.13.1
    at module.exports (C:\Users\TEOFILO\Documents\Correo-foundation\node_modules\gulp-sass\node_modules\node-sass\lib\binding.js:13:13)
    at Object.<anonymous> (C:\Users\TEOFILO\Documents\Correo-foundation\node_modules\gulp-sass\node_modules\node-sass\lib\index.js:14:35)
    at Module._compile (internal/modules/cjs/loader.js:689:30)
    at Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Object.require.extensions.(anonymous function) [as .js] (C:\Users\TEOFILO\Documents\Correo-foundation\node_modules\babel-register\lib\node.js:152:7)
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:20:18)
[20:48:56] 'build' errored after 6.34 s
[20:48:56] 'default' errored after 6.35 s
Error: foundation-emails-template@1.0.0 start: `gulp`
Exit status 1
    at EventEmitter.<anonymous> (C:\Users\TEOFILO\AppData\Roaming\npm\node_modules\foundation-cli\node_modules\npm\lib\utils\lifecycle.js:217:16)
    at EventEmitter.emit (events.js:182:13)
    at ChildProcess.<anonymous> (C:\Users\TEOFILO\AppData\Roaming\npm\node_modules\foundation-cli\node_modules\npm\lib\utils\spawn.js:24:14)
    at ChildProcess.emit (events.js:182:13)
    at maybeClose (internal/child_process.js:961:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:250:5)

Creando un email de recibo de compra

Introducción

¿Dónde aprender frontend actualizado?

Introducción a Foundation y al proyecto del curso

Repositorio del curso

¿Que es un framework frontend?

Creando el sitio web

Instalación de Foundation

Configuración de Foundation

Incorporando los iconos de Foundation

La nueva grilla XY de Foundation

Espaciado dentro de las grillas

Creando nuestro header

Creando el menú de navegación

Adaptando el menú de navegación para dispositivos móviles

Agregando un carrusel de imágenes con Orbit

Agregando una barra lateral de navegación

Agregando el listado de productos

Agregando un menú lateral off-canvas

Agregar Smooth Navigation

Llevando nuestro sitio a producción

Complementos- Creando emails para nuestros usuarios

Introducción a Foundation para Emails

Creando un email de recibo de compra

Conclusiones del curso