33
Pelican による www.python.jp の構築 2014/9/13 PyCon JP 2014 Atsuo Ishimoto

Pelicanによる の構築

Embed Size (px)

DESCRIPTION

Pelicanによる www.python.jpの構築

Citation preview

Page 1: Pelicanによる の構築

Pelicanによる

www.python.jp

の構築

2014/9/13 PyCon JP 2014

Atsuo Ishimoto

Page 2: Pelicanによる の構築

自己紹介

2

いしもと

石本 敦夫 あつお

python.jp 管理人

Page 3: Pelicanによる の構築

㈱ UNCOVER TRUTH勤務

3

社員募集中!

Page 4: Pelicanによる の構築

Python本を書きました

4

Python文法詳解 ← NEW

パーフェクトPython

Page 5: Pelicanによる の構築

5

python.jp の歴史

Zope(2001年9月 ~)

Zope2

Squishdot

DTML

Page 6: Pelicanによる の構築

python.org専用ツール

(2012/9 ~)

6

YAML

reStructuredText

mako

Page 7: Pelicanによる の構築

Pelican

(2014/5 ~)

7

reStructuredText

Markdown

AsciiDoc

jinja2

Page 8: Pelicanによる の構築

Pelican

Static Site Generator, Powered by Python

8

コンテンツ(reStructuredText,

Markdown.,

HTML…)

テンプレート (jinj2)

HTML

RSS

CSS etc.,

http://docs.getpelican.com 設定ファイル

Page 9: Pelicanによる の構築

Pelican

9

非技術者でも使えるサイト構築ツール

Page 10: Pelicanによる の構築

コンテンツ

10

ブログのエントリ

日付・カテゴリ・タグなどを設定

サイトを構成する静的なページ

著者紹介、Aboutなど

アーティクル

ページ

Page 11: Pelicanによる の構築

テンプレート

11

Pelican テーマ集

https://github.com/getpelican/pelican-themes

Page 12: Pelicanによる の構築

Pelicanのインストール

12

pip3 install pelican

Markdownを使う場合は、

pip3 install Markdown

を追加

Page 13: Pelicanによる の構築

Pelicanサイトの作成

13

$ pelican-quickstart Welcome to pelican-quickstart v3.3.0. This script will help you create a new Pelican-based website. Please answer the following questions so this script can generate the files needed by Pelican. Where do you want to create your new web site? [.] > What will be the title of this web site? Test Site > Who will be the author of this web site? Atsuo Ishimoto …

pelican-quickstart コマンドでひな形を作成

Page 14: Pelicanによる の構築

pelican-quickstart

で生成されるファイル

14

プロジェクトディレクトリ

├── content 作成した記事を格納

│ └── (pages) ├── output 記事を変換したHTMLなど │ └── (html, css, etc.,) ├── develop_server.sh テスト用HTTPサーバ ├── fabfile.py サイト構築用fabfile ├── Makefile ビルド用 Makefile ├── pelicanconf.py 設定ファイル └── publishconf.py 本番環境用設定ファイル

Page 15: Pelicanによる の構築

contentディレクトリ

15

content │ ├─ アーティクルA.rst 作成した記事 ├─ カテゴリ1 カテゴリ1の記事 │ ├── アーティクルA.rst │ └── アーティクルB.rst ├─ カテゴリ2 格納カテゴリ2の記事 │ └── アーティクルC.rst ├─ pages ページを格納 │ ├── ページ1.rst │ └── ページ2.rst ├─ images 画像ファイル等 │ └── picture1.png

Page 16: Pelicanによる の構築

reStructuredText

16

Python公式ドキュメントで採用

高機能

拡張性

デフォルト設定が、Pythonドキュメントの記述用

西洋語向けのマークアップ

Page 17: Pelicanによる の構築

Markdown

17

Githubなどでおなじみ

シンプル・覚えやすい

Page 18: Pelicanによる の構築

記事のメタデータ

18

記事タイトル

##############

:date: 2014-09-14 12:00

:tags: Python, プレゼン :category: python :slug: file_name

rstのサンプル

本文中や、ファイル名にメタデータを記述

• タイトル

• 日付

• タグ

• 著者

• urlのパス

• etc

Page 19: Pelicanによる の構築

メタデータでURL/ファイル名を指定

19

記事タイトル

##############

:save_as: path/to/save/index.html

:url: path/to/save/

output/path/to/save/index.html を作成

ページへのリンクは、 path/to/save/ となる

Page 20: Pelicanによる の構築

カテゴリ

20

pelicanconf.py で設定

DEFAULT_CATEGORY = "blog"

メタデータで指定 記事タイトル

##############

:category: python

ディレクトリで指定 Contentディレクトリの、サブディレクトリ名をカテゴリとする

ex) ./content/python/article.rst

デフォルトカテゴリ

Page 21: Pelicanによる の構築

ページ間リンク

21

ページ間リンクの記述方法#########################

rstでの

`相対リンク <{filename}page1.rst>`_ と `絶対リンク <{filename}/page1.rst>`_

Page 22: Pelicanによる の構築

構文ハイライト

22

.. code-block:: python3

def say():

print('hello')

Pygmentsで構文ハイライト

Page 23: Pelicanによる の構築

ページ

23

作成方法 content/pages ディレクトリに作成

ブログエントリ以外の、Aboutや著作権表示など

表示方法 • DEFAULT_CATEGORY = True

ならリンクを表示

• リンクしないページは、メタデータで :status: hidden

Page 24: Pelicanによる の構築

スタティックファイル

24

content │ ├─ images │ └── picture1.png

./content/imagesに配置

./output/images/ にコピーされる

./content/images/picture1.png → ./ountput/images/picture1.png

Page 25: Pelicanによる の構築

サイトのビルド

25

コマンド 機能

make html プロジェクトをローカル環境用にビルドします

(pelicanconf.pyを実行)

make publish プロジェクトをプロダクション環境用にビルドします

(pelicanconf.py + publishconf.py を実行)

make regenerate ファイルの変更を検出すると自動的にビルドします

make devserver develop_server.sh を実行し、プロジェクトの自動ビルド・テスト用HTTPサーバを起動します

Page 26: Pelicanによる の構築

設定ファイル

26

pelicanconf.py

publishconf.py

• make html と make publish で使用

• make publish でのみ使用

• プロダクション環境用

Page 27: Pelicanによる の構築

テーマ

27

pelican-themesコマンド

指定方法 pelicanconf.py で、ディレクトリ名を指定

THEME = "my_theme"

テーマ設定コマンド

$ pelican-themes --list

notmyidea

two-column@

simple

Page 28: Pelicanによる の構築

記事インデックスページ

28

インデックスページ /index.html

すべてのアーティクルのインデックス

カテゴリ別インデックスページ /category/カテゴリ名/index.html

カテゴリごとに作成される、アーティクルのインデックス

その他、タグ別・ 著者別・年別など

Page 29: Pelicanによる の構築

アーティクルの保存パスとURL

29

ARTICLE_SAVE_AS

【例】 ARTICLE_SAVE_AS = 'articles/{slug}/index.html'

アーティクルの保存ディレクトリを指定

ARTICLE_URL

【例】 ARTICLE_URL = 'articles/{slug}/'

アーティクルのURLを指定

Page 30: Pelicanによる の構築

SLUGIFY_SOURCE = 'basename'

30

• デフォルトは、SLUGIFY_SOURCE = 'title'

• アーティクルのタイトルから、slugを生成

• 日本語のタイトルだと、カオスなURLに

:title: Zipファイル一個で実行可能なPythonアプリケーションを作ってみる

ziphuairu-ge-deshi-xing-ke-neng-

napythonapurikeshiyonwozuo-tsutemiru.html

• SLUGIFY_SOURCE = 'basename' なら、ファイル名からslugを作成できる

Page 31: Pelicanによる の構築

スタティックファイルのコピー先

31

EXTRA_PATH_METADATA = { 'images/favicon.ico': {'path': 'favicon.ico'}, }

EXTRA_PATH_METADATAで、ファイルを配置するパスを指定する

Page 32: Pelicanによる の構築

フォーム

Python関連ニュースなどの登録

-------------------------

:url: news/submit.html

:save_as: news/submit.html

:category: news

ニュース登録フォーム

++++++++++++++++++

.. raw:: html

<form method="POST" action="/cgi-bin/submit_news.py">

<p>

<label>タイトル <i>(必須)</i></label>

<input name="title" id="input_title" size=80>

<span class='form_sample'> 例: Python関連書籍 出版のお知らせ

32

submit_news.rst

Page 33: Pelicanによる の構築

www.python.jp

33

https://github.com/pyjug/pelican.python.jp