Sites statiques : Github, Middleman et Jekyll

User/project Github pages

Github : c’est un service web d’hébergement et de gestion de développement de logiciels, utilisant le programme Git (merci Wikipédia)… Pour faire court : une plateforme sociale de travail. Ce réseau offre d’innombrables solutions permettant le développement de communautés souhaitant collaborer au sein d’un environnement stable et agréable.

La technique

Commençons par un projet banal.

  • le code source doit être sur la branche master

Je veux changer d’URL

En effet, d’un point de vue communication, il est étrange de donner une adresse Github pour un site web (quoique…).

  1. faire pointer les DNS sur Github (explication à la suite)

Outils

Github’s Automatic Page Generator

Le premier de ces outils est bien évidemment livré par Github.

Middleman

Pour moi l’un des meilleurs générateur de sites statiques, Middleman est écrit et se développe en ruby.

  • Créez une branche orpheline gh-pages contenant le site compilé
gem install middleman # si vous ne la possédez pas encore
middleman init my_awesome_project --template=html5
# Gemfile

gem 'middleman', '~> 3.1.3'
gem 'middleman-deploy'
gem 'middleman-livereload', '~> 3.1.0'
gem 'middleman-syntax'
gem 'redcarpet'
gem 'slim'
# config.rb

activate :gzip
activate :livereload
activate :syntax

set :markdown, fenced_code_blocks: true
set :markdown_engine, :redcarpet

configure :build do
activate :minify_css
activate :minify_javascript
end

activate :deploy do |deploy|
deploy.method = :git
deploy.branch = 'master'
deploy.build_before = true
end

Jekyll

Avec un esprit “blog” plus important, Jekyll est L’outil pour gérer votre contenu de manière très simple.

  • _includes/ : les parties globales du site (header, footer, etc...)
  • config.yml : configuration générale
  • _site : placé dans le .gitignore, ce dossier représente votre site compilé (disponible après le premier lancement du serveur, voir plus bas)
  • _layouts/ : modèles utilisés dans un post, une page, etc... Il suffit de le préciser dans les données de cette page

--

--

Freelance software engineer, guitar player & triathlete

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Baptiste Lecocq

Baptiste Lecocq

Freelance software engineer, guitar player & triathlete