post Image
Python製のWebサイト生成ツールLektorで、github pagesに自分のサイトを公開する

はじめに

Lektorというpython製の静的Webサイトジェネレータが気になりすぎたので使ってみました。
Lektor + github pagesでWebサイトを公開する手順のメモです。
Screen Shot 2018-01-07 at 19.19.36.png

メリット (Lektorが気になった理由)

  • github pagesが使える
  • 新しい (2015年末に公開された)
  • 製作者が有名 (Lektorの製作者は、python製webフレームワークFlaskの製作者)
  • python製 (github pagesで最も使われているjekyllはruby製)
  • wordpressみたいに管理画面が使える (github pagesでよく使われているpelicanはpython製だが管理画面がない)

デメリット

  • 記事が全然ない
  • テーマが全然ない

開発環境

  • macOS Sierra 10.12.6
  • Python 3.6.3
  • Lector 3.0.1

手順

githubにリポジトリを作成しておく

github pagesにuser siteを公開するために、「username.github.io」という名前のリポジトリを作成しておく。

Screen Shot 2018-01-07 at 18.49.16.png

Lektorのインストール

とりあえずCommand Lineのインタフェースをインストールすれば良い。

curl -sf https://www.getlektor.com/install.sh | sh

Lektorプロジェクトの作成

quickstartでプロジェクトを作る。
以下のコマンドを実行して、いくつか質問に答えていけば良い。

lektor quickstart

Screen Shot 2018-01-07 at 16.05.27.png

これでryokomyLektorというディレクトリが作成されている。(ディレクトリ名は自分で指定したもの)

cd ryokomyLektor

github pagesに公開 (build と deploy)

lektorには、lektor buildlektor deployというコマンドがあり、
lektor buildで静的ファイルを出力し、
lektor deployで登録済みのgithubサイトにpushしデプロイできるようになっている。

そこで、lektor deployを利用するために、以下のようにプロジェクトファイルにサーバーの情報を追加する。

ryokomyLektor.lektorproject
[project]
name = ryokomyLektor

[servers.ghpages]
name = ghpages
enabled = yes
default = yes
target = ghpages+https://ryokomy/ryokomy.github.io

これで全ての準備は整ったので、以下のコマンドを実行する。
lektor build
Screen Shot 2018-01-07 at 18.46.30.png
lektor deploy
Screen Shot 2018-01-07 at 18.50.00.png

githubのプロジェクトページを見ると、lektorのbotがcommit, pushしてくれているのが確認できる。(かわいい)
Screen Shot 2018-01-07 at 18.50.27.png

websiteにアクセス

ブラウザに、「ryokomy.github.io」と自分のgithub pagesのアドレスを入力すると、
Screen Shot 2018-01-07 at 19.04.19.png
みれた!!

終わりに

この記事では、Lektor + github pagesでウェブサイトを公開することをやってみました。
Lektorを使うと、wordpressのように管理画面を使って記事の追加・編集などができます。
その辺りはこの記事なんかが参考になると思いますので、ぜひ試してみてください。
Screen Shot 2018-01-07 at 19.24.56.png

参考


『 Python 』Article List
Category List

Eye Catch Image
Read More

Androidに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Bitcoinに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Goに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

JavaScriptに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Pythonに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Rubyに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Scalaに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Swiftに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Unityに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Wordpressに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

機械学習に関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。