Upgrade to Pro — share decks privately, control downloads, hide ads and more …

html robusto e elegante

Avatar for Murilo de Siqueira Ferreira Murilo de Siqueira Ferreira
November 12, 2018
Technology
0
21

html robusto e elegante

Avatar for Murilo de Siqueira Ferreira

Murilo de Siqueira Ferreira

November 12, 2018
Tweet

More Decks by Murilo de Siqueira Ferreira

See All by Murilo de Siqueira Ferreira
Introdução ao AMP (Accelerated Mobile Pages)
Avatar for Murilo de Siqueira Ferreira muhroots
0
23
Criando componentes interativos em páginas AMP com <amp-bind>
Avatar for Murilo de Siqueira Ferreira muhroots
0
23
Acessibilidade na web
Avatar for Murilo de Siqueira Ferreira muhroots
0
39

Other Decks in Technology

See All in Technology
【Ubie】AIを活用した広告アセット「爆速」生成事例 | AI_Ops_Community_Vol.2
Avatar for Yoshiki yoshiki_0316
1
120
OCI Database Management サービス詳細
Avatar for oracle4engineer oracle4engineer
PRO
1
7.4k
GitHub Copilot CLI を使いやすくしよう
Avatar for Yuta Matsumura tsubakimoto_s
0
110
AI駆動開発を事業のコアに置く
Avatar for 鬼澤輔 tasukuonizawa
1
410
AWS Network Firewall Proxyを触ってみた
Avatar for nagisa_53 nagisa53
1
250
Embedded SREの終わりを設計する　「なんとなく」から計画的な自立支援へ
Avatar for SansanTech sansantech
PRO
3
2.6k
Greatest Disaster Hits in Web Performance
Avatar for Estela Franco guaca
0
300
プロポーザルに込める段取り八分
Avatar for ShoheiMitani shoheimitani
1
680
ブロックテーマでサイトをリニューアルした話 / 2026-01-31 Kansai WordPress Meetup
Avatar for Toro_Unit (Hiroshi Urabe) torounit
0
480
CDKで始めるTypeScript開発のススメ
Avatar for つくぼし tsukuboshi
1
600
コミュニティが変えるキャリアの地平線：コロナ禍新卒入社のエンジニアがAWSコミュニティで見つけた成長の羅針盤
Avatar for Kento Suzuki kentosuzuki
0
130
外部キー制約の知っておいて欲しいこと - RDBMSを正しく使うために必要なこと / FOREIGN KEY Night
Avatar for soudai sone soudai
PRO
12
5.7k

Featured

See All Featured
WENDY [Excerpt]
Avatar for Tessa Abrams tessaabrams
9
36k
Visual Storytelling: How to be a Superhuman Communicator
Avatar for David Neal reverentgeek
2
440
Building Flexible Design Systems
Avatar for Yesenia Perez-Cruz yeseniaperezcruz
330
40k
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
Avatar for Yuki Nakata chikuwait chikuwait
0
340
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
31
6.6k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
1k
Statistics for Hackers
Avatar for Jake VanderPlas jakevdp
799
230k
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
37
7.1k
Applied NLP in the Age of Generative AI
Avatar for Ines Montani inesmontani
PRO
4
2.1k
Leveraging Curiosity to Care for An Aging Population
Avatar for Cassini Nazir cassininazir
1
170
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
79
Accessibility Awareness
Avatar for Sarah Abderemane sabderemane
0
59

Transcript

  1. html robusto e elegante com template engines Murilo S. Ferreira

    Dev. Frontend

  2. Pug – robust, elegant, feature rich template engine for Node.js

  3. Indentação é muito importante O Pug utiliza a indentação/espaços em

    branco do seu código para organizar a hierarquia das suas tags html. • Evite utilizar tags html (<body>) • Configure uma indentação padrão no seu editor (.editorconfig)

  4. http://html2jade.org/

  5. Principais funcionalidades ➔ Herança de layout ➔ Interpolação ➔ Mixins

    ➔ Iteradores (suporta each e while)

  6. Herança de layout

  7. Exemplo com gulp.js (automatizador de tarefas) https://github.com/muhroots/template-engine-pug-with-gulp

  8. Referências 1. https://pugjs.org/api/getting-started.htm l 2. https://blog.codecasts.com.br/ecossistem a-javascript-parte-06-template-engines-b 41a41178dce 3. https://codeburst.io/getting-started-with-

    pug-template-engine-e49cfa291e33 4. https://medium.com/@robmuh/why-i-dr opped-jade-pug-bf440c2269ae