Tweet
Tweet

Slide 1

Slide 1 text

@brodock blog.gabrielmazetto.eti.br Gabriel Mazetto

Slide 2

Slide 2 text

Sites Estáticos com o Middleman

Slide 3

Slide 3 text

CREATE, COLLABORATE AND DEPLOY

Slide 4

Slide 4 text

Por que Sites Estáticos?

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

Poderosos e Escaláveis

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

Inclusive para Blogs

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

Instalação e primeiros passos

Slide 11

Slide 11 text

$ gem install middleman Successfully installed middleman-4.1.1 Parsing documentation for middleman-4.1.1 Installing ri documentation for middleman-4.1.1 Done installing documentation for middleman after 0 seconds 1 gem installed

Slide 12

Slide 12 text

$ middleman init floripaonrails exist create .gitignore create Gemfile create config.rb create source/images/middleman-logo.svg create source/index.html.erb create source/javascripts/all.js create source/layouts/layout.erb create source/stylesheets/_normalize.scss create source/stylesheets/site.css.scss Do you want to use Compass? yes Do you want to use LiveReload? yes insert Gemfile insert config.rb ... run bundle install from "./floripaonrails"

Slide 13

Slide 13 text

$ middleman help Commands: middleman build [options] middleman config [options] middleman console [options] middleman deploy [options] middleman extension [options] middleman help [COMMAND] middleman init TARGET [options] middleman server [options] middleman version

Slide 14

Slide 14 text

No content

Slide 15

Slide 15 text

configure :development do activate :livereload end # Build-specific configuration configure :build do # Minify CSS on build # activate :minify_css # Minify Javascript on build # activate :minify_javascript end activate :disqus do |d| d.shortname = 'floripaonrails' end

Slide 16

Slide 16 text

plugins e extenções Funcionalidades

Slide 17

Slide 17 text

Templates Engines Use a que você quiser

Slide 18

Slide 18 text

Slim Erubis Less CSS Builder Liquid RDiscount Redcarpet BlueCloth Kramdown Maruku HAML RedCloth RDoc Radius Markaby Nokogiri CoffeeScript Creole (Wiki markup) WikiCloth (Wiki markup) Yajl Stylus

Slide 19

Slide 19 text

Hands On

Slide 20

Slide 20 text

Onde Fazer o Deploy?

Slide 21

Slide 21 text

Apache/Nginx Github Pages Gitlab Pages

Slide 22

Slide 22 text

.gitlab-ci.yml

Slide 23

Slide 23 text

image: ruby:2.2 variables: LANG: "C.UTF-8" pages: script: - which ruby - bundle install --deployment --jobs $(nproc) - bundle exec middleman build artifacts: paths: - public only: - source

Slide 24

Slide 24 text

config.rb

Slide 25

Slide 25 text

... # Pretty URLs activate :directory_indexes # Build HTML files to 'public' folder (GitLab Pages convention) set :build_dir, 'public' ...

Slide 26

Slide 26 text

No content

Slide 27

Slide 27 text

Perguntas?

Slide 28

Slide 28 text

http://doc.gitlab. com/ee/pages