Tweet
Tweet

Slide 1

Slide 1 text

Sta$c  Site  Generator @bruno2ms

Slide 2

Slide 2 text

Como  começar?

Slide 3

Slide 3 text

Ruby  +  Liquid  +  YAML

Slide 4

Slide 4 text

Como  funciona? • Converte  Markdown,  Tex$le  e  HTML  com   Liquid  Tags   • Aplica  templates  e  Layout  Pages   • Converte  arquivos  sass   • Se  aproveita  da  estrutura  de  pastas  para   gerar  blog  e  posts   • Transforma  isso  tudo  em  HTML  está$co

Slide 5

Slide 5 text

O  que  já  vem  pronto? • Paginação   • Estrutura  personalizada  de  permalinks   • Posts  relacionados   • Syntax  highlight   • Conversão  Markdown/Tex$le

Slide 6

Slide 6 text

Estrutura  Inicial

Slide 7

Slide 7 text

Configuração  Centralizada _config.yml

Slide 8

Slide 8 text

Configuração  YAML • Configuração  de  variáveis  globais   • Variáveis  reu$lizáveis  de  acordo  com   estrutura  dos  arquivos   • Adicione  as  chaves  que  desejar  para   reaproveitar  em  todo  o  site

Slide 9

Slide 9 text

Exemplo

Slide 10

Slide 10 text

YAML  Front  MaJer --- layout: post title: Blogging Like a Hacker permalink: /path/to/my/page/ published: true categories: [categoria1, categoria2] --- {{ site.name }} - {{ page.title }} ...

Slide 11

Slide 11 text

Deploy? • Instancia  grá$s  do  Heroku   • GitHub  Pages   • Direto  para  a  Amazon  S3   • Qualquer  lugar  que  aceite  páginas  está$cas   • hTp:/ /jekyllrb.com/docs/deployment-­‐ methods/

Slide 12

Slide 12 text

Comentários  do  Blog? Extender   -­‐ Disqus  (exemplo)   -­‐ Intense  Debate   -­‐ Facebook  Comments

Slide 13

Slide 13 text

Disqus ... layout: default comments: true # other options ... {% if page.comments %} {% include disqus.html %} {% endif %}
var disqus_shortname = ‘your_user'; (function() { var dsq = document.createElement('script'); dsq.type = 'text/ javascript'; dsq.async = true; dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js'; (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); sua_pagina.html _includes/disqus.html

Slide 14

Slide 14 text

Data  Files? _data/*/*.yml _data/*/*.csv _data/*/*.json

Slide 15

Slide 15 text

Data  Files - name: Tom Preston-Werner github: mojombo - name: Parker Moore github: parkr - name: Liu Fengyun github: liufengyun
    {% for member in site.data.members %}
  • {{ member.name }}
    • {% endfor %}
index.yml _data/members.yml

Slide 16

Slide 16 text

Data  Files name: Bluesoft members: - name: Tom Preston-Werner github: mojombo - name: Parker Moore github: parkr _data/orgs/blueso\.yml _data/orgs/webgoal.yml name: Webgoal members: - name: Tom Preston-Werner github: mojombo - name: Parker Moore github: parkr
    {% for org_hash in site.data.orgs %} {% assign org = org_hash[1] %}
  • {{ org.name }} ({{ org.members | size }} members)
    • {% endfor %}

Slide 17

Slide 17 text

Arquitetura  de  Plugins (facilidade  de  extender) _plugins/*.rb hTp:/ /jekyllrb.com/docs/plugins/

Slide 18

Slide 18 text

OBRIGADO (confira  as  próximas  apresentações  avançadas) @bruno2ms