Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Jekyll the static site generator
Search
bruno2ms
August 20, 2015
Technology
0
43
Jekyll the static site generator
Jekyll the static site generator
bruno2ms
August 20, 2015
Tweet
Share
More Decks by bruno2ms
See All by bruno2ms
Will Js Kill CSS
bruno2ms
0
170
Google Design Sprints
bruno2ms
0
170
Building UX Team
bruno2ms
3
85
Jekyll the static site generator Liquid For Designers
bruno2ms
0
61
Bad Leaders - Manual de como falhar como líder
bruno2ms
0
36
Lean UX
bruno2ms
3
250
Other Decks in Technology
See All in Technology
経験がないことを言い訳にしない、 AI時代の他領域への染み出し方
parayama0625
0
150
Building GoReleaser - from shell script to paid product
caarlos0
0
270
MCP とマネージド PaaS で実現する大規模 AI アプリケーションの高速開発
nahokoxxx
1
1.4k
会社もクラウドも違うけど 通じたコスト削減テクニック/Cost optimization strategies effective regardless of company or cloud provider
aeonpeople
2
160
DATA+AI SummitとSnowflake Summit: ユーザから見た共通点と相違点 / DATA+AI Summit and Snowflake Summit
nttcom
0
220
低レイヤソフトウェア技術者が YouTuberとして食っていこうとした話
sat
PRO
7
5.8k
エンジニアリングマネージャー“お悩み相談”パネルセッション
ar_tama
1
660
Shadow DOMとセキュリティ - 光と影の境界を探る / Shibuya.XSS techtalk #13
masatokinugawa
0
270
「現場で活躍するAIエージェント」を実現するチームと開発プロセス
tkikuchi1002
6
1k
AWS Well-Architected から考えるオブザーバビリティの勘所 / Considering the Essentials of Observability from AWS Well-Architected
sms_tech
1
850
Ktor + Google Cloud Tasks/PubSub におけるOTel Messaging計装の実践
sansantech
PRO
1
270
Turn Your Community into a Fundraising Catalyst for Black Philanthropy Month
auctria
PRO
0
130
Featured
See All Featured
Become a Pro
speakerdeck
PRO
29
5.4k
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.7k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
How to train your dragon (web standard)
notwaldorf
96
6.1k
Facilitating Awesome Meetings
lara
54
6.5k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Typedesign – Prime Four
hannesfritz
42
2.7k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
2.9k
Measuring & Analyzing Core Web Vitals
bluesmoon
7
530
A Tale of Four Properties
chriscoyier
160
23k
How STYLIGHT went responsive
nonsquared
100
5.6k
Transcript
Sta$c Site Generator @bruno2ms
Como começar?
Ruby + Liquid + YAML
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
O que já vem pronto? • Paginação • Estrutura
personalizada de permalinks • Posts relacionados • Syntax highlight • Conversão Markdown/Tex$le
Estrutura Inicial
Configuração Centralizada _config.yml
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
Exemplo
YAML Front MaJer --- layout: post title: Blogging Like a
Hacker permalink: /path/to/my/page/ published: true categories: [categoria1, categoria2] --- <!DOCTYPE HTML> <html> <head> <title>{{ site.name }} - {{ page.title }}</title> </head> <body> ...
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/
Comentários do Blog? Extender -‐ Disqus (exemplo) -‐
Intense Debate -‐ Facebook Comments
Disqus ... layout: default comments: true # other options ...
{% if page.comments %} {% include disqus.html %} {% endif %} <div id="disqus_thread"></div> <script type="text/javascript"> 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); })(); </script> sua_pagina.html _includes/disqus.html
Data Files? _data/*/*.yml _data/*/*.csv _data/*/*.json
Data Files - name: Tom Preston-Werner github: mojombo - name:
Parker Moore github: parkr - name: Liu Fengyun github: liufengyun <ul> {% for member in site.data.members %} <li> <a href="https://github.com/{{ member.github }}"> {{ member.name }} </a> </li> {% endfor %} </ul> index.yml _data/members.yml
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 <ul> {% for org_hash in site.data.orgs %} {% assign org = org_hash[1] %} <li> <a href="https://github.com/{{ org.username }}"> {{ org.name }} </a> ({{ org.members | size }} members) </li> {% endfor %} </ul>
Arquitetura de Plugins (facilidade de extender) _plugins/*.rb hTp:/ /jekyllrb.com/docs/plugins/
OBRIGADO (confira as próximas apresentações avançadas) @bruno2ms