NKSSG
NakaKen Static Site Generator

クイックスタート

クイックスタート

ここでは、NKSSG の使い方の概要を見ていきます。環境構築からサンプルサイトの作成まで、一連の流れをざっと見ていきます。

環境構築(はじめの1回だけ)

Python のインストール

NKSSG は Python で書かれています。Python のコードを書かなくても NKSSG を使うことはできますが、Python のインストールは必要です。

Python がすでにインストールされているかどうかは、コマンドプロンプトやターミナルで次のコマンドを実行してみるとわかります。

python --version

Python がすでにインストールされていれば、バージョンが表示されます。何かエラーが出れば、インストールされていないということなので、以下のサイトを参考にインストールしましょう。

Python 3.6 以上が必要ですので、バージョンが古い人はバージョンアップしましょう。はじめてインストールする人は、最新バージョンをインストールするといいでしょう。

VSCode のインストール

記事を書くためには、エディタが必要です。また、サイトを構築するために、コマンドを実行する必要があります。これらが簡単に実行できるように、NKSSG では Visual Studio Code(VSCode)を推奨しています。

VSCode のインストールは、以下のサイトから行うことができます。

OS に合わせてインストールしましょう。

サイトの初期化

仮想環境の構築

NKSSG をインストールするために、Python の仮想環境を作ります。仮想環境を使うと、他の Python の環境と独立してインストールなどを行うことができます。仮想環境を使わなくても NKSSG を使うことはできますが、NKSSG では仮想環境の使用を推奨しています。

VSCode を使っている場合は、エクスプローラ上で作業用のフォルダを作ってから、VSCode でそのフォルダを開きます。そして、Ctrl + @でターミナルを開き、以下のコマンドを実行します。

python -m venv .venv

このコマンドで、仮想環境を作ることができます。最後の .venv が仮想環境の名前です。仮想環境には他の好きな名前をつけてもかまいません。

仮想環境を作る必要性、仮想環境を作ったときに一緒にやっておくと便利な設定などは、次のページで説明しています。

Visual Studio Code Visual Studio Code

「仮想環境に関する設定」までをやっておきましょう。VSCode の便利機能なども説明しているので、一度も使ったことがない人は見ておくと参考になると思います。

NKSSG のインストール

NKSSG をインストールします。仮想環境を使う場合はアクティベートしてから(参考:python )、次のように pip コマンドを実行します。> より後をコピーして貼り付けて実行してみましょう。

(.venv) > pip install -U git+https://github.com/nakaken88/NKSSG

なお、(.venv) は、仮想環境をアクティベートしている証です。アクティベートしないと、おおもとの Python の環境にインストールすることになるので注意しましょう。

しばらくすると、インストールが完了します。インストールがうまくいったかどうかは、以下のコマンドで確かめられます。

pip list

インストールされているパッケージ一覧が表示されるので、この中に NKSSG があれば、きちんとインストールできていることになります。

新規サイトの作成

NKSSG をインストールしたら、以下のコマンドを実行すると、実行した場所にサイトのひな型が作成されます。

nkssg new site

今の場所の下にフォルダを作ってそこにサイトのひな型を作りたい場合は、次のようにします。

nkssg new site {new-site}
cd {new-site}

{new-site} は、新しくできるフォルダの名前です。好きな名前で置き換えましょう。

記事の追加

NKSSG をブログとして使う場合、次のコマンドを実行してみましょう。

nkssg new post

こうすると、 /docs/post/ フォルダの下に、記事ファイルが作成されます。VSCode を使っている場合は、作成されたファイルのパスが表示されるので、 Ctrl + クリック で開くことができます。ここに記事の内容を書いていきます。

記事がどのように表示されるかは、次のようにしてローカルサーバーを立ち上げて確認できます。

nkssg serve

http://127.0.0.1:5500 から確認することができます。ファイルを保存するたびにページが更新されます。

ファイルの出力

記事を書き終えたら、公開用のファイルを作成しましょう。次のコマンドを実行しましょう。

nkssg build

このコマンドを実行すると、public フォルダの下に公開用のファイル一式が作成されます。アーカイブページや画像なども一緒に出力されます。このように、公開用のファイル一式を作成することを、ビルドといいます。

このフォルダの中身一式をサーバーにアップロードすれば、サイトの公開が完了です。

次は何をする?

この後は、記事の追加とファイルの出力を繰り返していくだけです。記事をいくつか追加してみて、どのように表示されるか見てみましょう。

ある程度、使い勝手がわかってきたら、いよいよサイト全体の構成を考えていきます。ブログを作るか、サイト(非ブログ)を作るかによって、以下のページを見ていきましょう。

🖌 ブログ作成の流れ

📗 サイト作成の流れ

また、デザインを変えたい場合は、以下のページが参考になるでしょう。

TODO