Esto me recuerda a templates de django
Bienvenida
Por qué aprender Sapper y qué vas a aprender
¿Qué es Sapper?
Configuración para Sapper
Clonar proyecto Pugstagram
Instalación y configuración de Sapper
Crear Template html
Webpack
Rutas con Sapper
Layout
Profile
Header
Error 404
Optimización
Uso de prefetch y goto
Primer llamado con prefetch
Service Worker
Crear Service Worker
Configurar Service Worker
Despliegue
Despliegue usando Sapper Export
Despliegue en Heroku
Cierre
Continúa con el Curso Práctico de Svelte y Sapper
Crea una cuenta o inicia sesión
¡Continúa aprendiendo sin ningún costo! Únete y comienza a potenciar tu carrera
Oscar Barajas Tavares
Aportes 3
Preguntas 0
Esto me recuerda a templates de django
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pugstagram</title>
%sapper.base%
%sapper.styles%
%sapper.head%
</head>
<body>
<app>
%sapper.html%
</app>
%sapper.scripts%
</body>
<script src="https://kit.fontawesome.com/TU_PROPIO_HASH.js" crossorigin="anonymous"></script>
</html>
F por el directorio public donde estaba nuestro archivo index.html.
Ya no lo necesitamos porque estamos generando nuestro propio servidor con polka. Polka utilizará el template.html que creamos en esta clase para añadir la app. Ya no usaremos la opción que nos daba svelte para trabajar con archivos públicos, por lo tanto, no es necesario.
.
Lo que hicimos en esta clase fue añadir variables nativas de sapper a nuestro template. Esto se hace para añadir elementos externos (scripts, estilos, metadatos) a nuestro archivo principal.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- añade la base del proyecto a este archivo -->
%sapper.base%
<!-- añade los estilos necesarios de nuestra app a este archivo -->
%sapper.styles%
<!-- añade los metadatos a este template -->
%sapper.head%
</head>
<body>
<!-- empuja (muestra) la app a este archivo template para que sea renderizada-->
<app>%sapper.html%</app>
%sapper.scripts%
<script src="https://kit.fontawesome.com/473d269aa9.js" crossorigin="anonymous"></script>
</body>
</html>
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?