SlideShare uma empresa Scribd logo
1 de 30
Baixar para ler offline
Instala o Jekyll e suas dependências
Instala o Jekyll e suas dependências
Cria um novo projeto com a estrutura padrão
Instala o Jekyll e suas dependências
Cria um novo projeto com a estrutura padrão
Acessa a pasta do projeto
Instala o Jekyll e suas dependências
Cria um novo projeto com a estrutura padrão
Acessa a pasta do projeto
Cria um server no link http://localhost:4000
Arquivos de estrutura (header, footer, ect.)
Layout das páginas (default, post, page)
Posts que irão gerar páginas
Includes do Sass
Site gerado (build)
Arquivo sass chamando os includes
Gitignore
Arquivo de configuração e variáveis do site (titulo, descrição)
Página usando markdown
Arquivo de feed
Página default, lista os posts
index.html
index.html
Variável padrão. Declara qual layout (da
pasta _layouts) que será usado na tela.
/index.html
Variável criadas que serão reaproveita
das no layout.
/layouts/default.html
index.html
/layouts/default.html
/_config.yml
/layouts/default.html
Resgata variáveis do _config.yml
Resgata variáveis da página
Usado nas telas de layout. Resgata o conteúdo da página
Usado para criar paginação de posts
Instale o Jekyll e crie um site estático
Instale o Jekyll e crie um site estático
Instale o Jekyll e crie um site estático
Instale o Jekyll e crie um site estático

Mais conteúdo relacionado

Semelhante a Instale o Jekyll e crie um site estático

Wordpress Introdução ao Desenvolvimento de Templates
Wordpress Introdução ao Desenvolvimento de TemplatesWordpress Introdução ao Desenvolvimento de Templates
Wordpress Introdução ao Desenvolvimento de TemplatesWesley R. Bezerra
 
Ambiente de Desenvolvimento Java usando Ant
Ambiente de Desenvolvimento Java usando AntAmbiente de Desenvolvimento Java usando Ant
Ambiente de Desenvolvimento Java usando AntDenis L Presciliano
 
Mini curso de django
Mini curso de djangoMini curso de django
Mini curso de djangorosenclever
 
Aula05 android persistencia
Aula05 android persistenciaAula05 android persistencia
Aula05 android persistenciaRoberson Alves
 
Revit architecture 2012_pt_iniciar_um_projeto
Revit architecture 2012_pt_iniciar_um_projetoRevit architecture 2012_pt_iniciar_um_projeto
Revit architecture 2012_pt_iniciar_um_projetoDouglas Morais
 
hibernate annotation
hibernate annotationhibernate annotation
hibernate annotationeduardo dias
 
Jekyll the powerful static site generator
Jekyll the powerful static site generatorJekyll the powerful static site generator
Jekyll the powerful static site generatorFEMUG-CWB
 
Sistemas Corporativos Web - WordPress Aula03
Sistemas Corporativos Web - WordPress Aula03Sistemas Corporativos Web - WordPress Aula03
Sistemas Corporativos Web - WordPress Aula03Tersis Zonato
 
Desenvolvimento web com vs2012: Uma visão geral
Desenvolvimento web com vs2012: Uma visão geralDesenvolvimento web com vs2012: Uma visão geral
Desenvolvimento web com vs2012: Uma visão geralHelder Lopes
 
Boas práticas de desenvolvimento de temas para WordPress
Boas práticas de  desenvolvimento  de temas para  WordPressBoas práticas de  desenvolvimento  de temas para  WordPress
Boas práticas de desenvolvimento de temas para WordPressMateus Neves
 
Construindo temas para Plone com Diazo
Construindo temas para Plone com DiazoConstruindo temas para Plone com Diazo
Construindo temas para Plone com DiazoSimples Consultoria
 
Hierarquia de templates WordPress
Hierarquia de templates WordPressHierarquia de templates WordPress
Hierarquia de templates WordPressGuga Alves
 
Devmedia - Conhecendo o framework front-end Foundation
Devmedia - Conhecendo o framework front-end FoundationDevmedia - Conhecendo o framework front-end Foundation
Devmedia - Conhecendo o framework front-end FoundationDevmedia
 
TechDay - Sistemas WEB em Java - Rogério N. Jr.
TechDay - Sistemas WEB em Java - Rogério N. Jr.TechDay - Sistemas WEB em Java - Rogério N. Jr.
TechDay - Sistemas WEB em Java - Rogério N. Jr.Rogério Napoleão Jr.
 
ZF Básico - 5. Modelo
ZF Básico - 5. ModeloZF Básico - 5. Modelo
ZF Básico - 5. ModeloMarcos Bezerra
 
Operações - Base de Conhecimento - Parte 02
Operações - Base de Conhecimento - Parte 02Operações - Base de Conhecimento - Parte 02
Operações - Base de Conhecimento - Parte 02Alan Carlos
 
PDC - Engenharia - Plataforma Microsoft .NET
PDC - Engenharia - Plataforma Microsoft .NETPDC - Engenharia - Plataforma Microsoft .NET
PDC - Engenharia - Plataforma Microsoft .NETslides_teltools
 
Desenvolver um tema para Moodle 2.7 - 9º Moodle Moot Brasil
Desenvolver um tema para Moodle 2.7 - 9º Moodle Moot BrasilDesenvolver um tema para Moodle 2.7 - 9º Moodle Moot Brasil
Desenvolver um tema para Moodle 2.7 - 9º Moodle Moot BrasilMichael Douglas Meneses de Souza
 

Semelhante a Instale o Jekyll e crie um site estático (20)

Wordpress Introdução ao Desenvolvimento de Templates
Wordpress Introdução ao Desenvolvimento de TemplatesWordpress Introdução ao Desenvolvimento de Templates
Wordpress Introdução ao Desenvolvimento de Templates
 
Ambiente de Desenvolvimento Java usando Ant
Ambiente de Desenvolvimento Java usando AntAmbiente de Desenvolvimento Java usando Ant
Ambiente de Desenvolvimento Java usando Ant
 
Mini curso de django
Mini curso de djangoMini curso de django
Mini curso de django
 
Aula05 android persistencia
Aula05 android persistenciaAula05 android persistencia
Aula05 android persistencia
 
Revit architecture 2012_pt_iniciar_um_projeto
Revit architecture 2012_pt_iniciar_um_projetoRevit architecture 2012_pt_iniciar_um_projeto
Revit architecture 2012_pt_iniciar_um_projeto
 
hibernate annotation
hibernate annotationhibernate annotation
hibernate annotation
 
Jekyll the powerful static site generator
Jekyll the powerful static site generatorJekyll the powerful static site generator
Jekyll the powerful static site generator
 
Sistemas Corporativos Web - WordPress Aula03
Sistemas Corporativos Web - WordPress Aula03Sistemas Corporativos Web - WordPress Aula03
Sistemas Corporativos Web - WordPress Aula03
 
Desenvolvimento web com vs2012: Uma visão geral
Desenvolvimento web com vs2012: Uma visão geralDesenvolvimento web com vs2012: Uma visão geral
Desenvolvimento web com vs2012: Uma visão geral
 
Boas práticas de desenvolvimento de temas para WordPress
Boas práticas de  desenvolvimento  de temas para  WordPressBoas práticas de  desenvolvimento  de temas para  WordPress
Boas práticas de desenvolvimento de temas para WordPress
 
Conhecendo o ASP .NET 4.5
Conhecendo o ASP .NET 4.5Conhecendo o ASP .NET 4.5
Conhecendo o ASP .NET 4.5
 
CSS
CSSCSS
CSS
 
Construindo temas para Plone com Diazo
Construindo temas para Plone com DiazoConstruindo temas para Plone com Diazo
Construindo temas para Plone com Diazo
 
Hierarquia de templates WordPress
Hierarquia de templates WordPressHierarquia de templates WordPress
Hierarquia de templates WordPress
 
Devmedia - Conhecendo o framework front-end Foundation
Devmedia - Conhecendo o framework front-end FoundationDevmedia - Conhecendo o framework front-end Foundation
Devmedia - Conhecendo o framework front-end Foundation
 
TechDay - Sistemas WEB em Java - Rogério N. Jr.
TechDay - Sistemas WEB em Java - Rogério N. Jr.TechDay - Sistemas WEB em Java - Rogério N. Jr.
TechDay - Sistemas WEB em Java - Rogério N. Jr.
 
ZF Básico - 5. Modelo
ZF Básico - 5. ModeloZF Básico - 5. Modelo
ZF Básico - 5. Modelo
 
Operações - Base de Conhecimento - Parte 02
Operações - Base de Conhecimento - Parte 02Operações - Base de Conhecimento - Parte 02
Operações - Base de Conhecimento - Parte 02
 
PDC - Engenharia - Plataforma Microsoft .NET
PDC - Engenharia - Plataforma Microsoft .NETPDC - Engenharia - Plataforma Microsoft .NET
PDC - Engenharia - Plataforma Microsoft .NET
 
Desenvolver um tema para Moodle 2.7 - 9º Moodle Moot Brasil
Desenvolver um tema para Moodle 2.7 - 9º Moodle Moot BrasilDesenvolver um tema para Moodle 2.7 - 9º Moodle Moot Brasil
Desenvolver um tema para Moodle 2.7 - 9º Moodle Moot Brasil
 

Mais de Matheus Thomaz

Minicurso Iniciando no Mundo Front-End - Dia 01 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 01 - SASPI {5}Minicurso Iniciando no Mundo Front-End - Dia 01 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 01 - SASPI {5}Matheus Thomaz
 
Minicurso Iniciando no Mundo Front-End - Dia 02 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 02 - SASPI {5}Minicurso Iniciando no Mundo Front-End - Dia 02 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 02 - SASPI {5}Matheus Thomaz
 
Minicurso Iniciando no Mundo Front-End - Dia 03 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 03 - SASPI {5}Minicurso Iniciando no Mundo Front-End - Dia 03 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 03 - SASPI {5}Matheus Thomaz
 
Minicurso Iniciando no Mundo Front-End - Dia 05 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 05 - SASPI {5}Minicurso Iniciando no Mundo Front-End - Dia 05 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 05 - SASPI {5}Matheus Thomaz
 
Minicurso Iniciando no Mundo Front-End - Dia 04 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 04 - SASPI {5}Minicurso Iniciando no Mundo Front-End - Dia 04 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 04 - SASPI {5}Matheus Thomaz
 

Mais de Matheus Thomaz (10)

Auto-gerenciamento
Auto-gerenciamentoAuto-gerenciamento
Auto-gerenciamento
 
Jekyll
JekyllJekyll
Jekyll
 
Programar é pensar
Programar é pensarProgramar é pensar
Programar é pensar
 
Minicurso Iniciando no Mundo Front-End - Dia 01 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 01 - SASPI {5}Minicurso Iniciando no Mundo Front-End - Dia 01 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 01 - SASPI {5}
 
Minicurso Iniciando no Mundo Front-End - Dia 02 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 02 - SASPI {5}Minicurso Iniciando no Mundo Front-End - Dia 02 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 02 - SASPI {5}
 
Minicurso Iniciando no Mundo Front-End - Dia 03 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 03 - SASPI {5}Minicurso Iniciando no Mundo Front-End - Dia 03 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 03 - SASPI {5}
 
Minicurso Iniciando no Mundo Front-End - Dia 05 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 05 - SASPI {5}Minicurso Iniciando no Mundo Front-End - Dia 05 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 05 - SASPI {5}
 
Minicurso Iniciando no Mundo Front-End - Dia 04 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 04 - SASPI {5}Minicurso Iniciando no Mundo Front-End - Dia 04 - SASPI {5}
Minicurso Iniciando no Mundo Front-End - Dia 04 - SASPI {5}
 
Less
LessLess
Less
 
Gulp
GulpGulp
Gulp
 

Instale o Jekyll e crie um site estático