Zennの共有GitHub リポジトリにプッシュする方法

GitHub上に作成したZennの共有リポジトリにプッシュする方法を紹介します。

これを実行することで、ターミナル上からZennの記事を公開、もしくは下書き保存することが可能になります。

## 準備

### その1  ZennとGitHubを連携

あらかじめZennとGitHubを連携させておきます。やり方はこちらを参照。

ZennとGitHubを連携させる方法 - Qiita https://qiita.com/akiba_burari/items/2423d284bab666e01f45

https://qiita.com/akiba_burari/items/2423d284bab666e01f45


### その2　mdファイルを作成

記事を作成し、mdファイルを保存しておきます。

ChromebookとZenn CLIで記事を書く方法 - Qiita https://qiita.com/akiba_burari/items/a831dfb9562402012bf9

https://qiita.com/akiba_burari/items/a831dfb9562402012bf9

### その3 GitHubのTokenを取得

後で必要になるGitHubのPrivate Access Tokenを作っておきます。

作り方は難しくありません。以下の手順で進めると簡単です。


　**1 GitHubへアクセスします。**

　**2 右上のProfile > Settingsをクリックします。**

　**3 Developer Settingsを選択**

　**4 Personal access tokensを選択**

　**5 Tokens(Classic)を選択→Generate new tokenを選択**
    
取得したトークンコードはメモしておきます。    


## GitHub リポジトリにプッシュ

GitHub リポジトリにプッシュしていきます。

作業はすべてターミナル上で行います。

エラーが出たら、

```
$ git status
```

で状態を確認してください。


### 記事内容を確認

記事を zenn.dev 上で「公開」するにはpublishedオプションが **「true」** になっていることが必要です。

下書きでいいのなら **「false」** にしておきましょう。



### 該当ディレクトリに移動

cdコマンドを使って、該当のディレクトリまで移動します。

今回は記事をプッシュするので、 **「zenn/articles」** に移動します（※あらかじめzennというディレクトリを作成しています）。
```
$ cd zenn/articles
```
## 初期化 / ステージリンク
```
$ git init  #gitを初期化
```

```
$ git add .      #ステージングにあげる
```

### エラーの対処法

ここでエラーが出るときがあります。

fatal: remote origin already exists.

と表示されてリポジトリにpushできないときは、

originを削除します。
```
$ git remote rm origin 
```

### コミットメッセージを書く

最初のコミットメッセージを書きます。省略可能です。
```
$ git commit -m "first commit"
```
### GitHubリモートリポジトリにアクセス

GitHubリモートリポジトリにアクセスします。

一般的には以下のように書くようにします。

```
$ git remote add origin ここにgithubで作ったリポジトリのURL
```


例

**git remote add origin https://github.com/AkibaBurari/zenn_connect.git**

しかし、これでは後でユーザー名とパスワードを入力しなければならず、非常に面倒です。

しかも「パスワード」の欄には、GitHubの「Tokenコード」を入力しなければなりません。

そこで新たに修正したコードの方で入力します。

**修正したコードの書き方**
```
$ git remote add origin https://{ユーザ名}:{tokens}@github.com/{ユーザ名}/{リポジトリ名}.git
```

修正したコードの例

**git remote add origin https://AkibaBurari:XXXXXXXXXXXXXXXXXXXXXXXXX@github.com/AkibaBurari/zenn_connect.git**





### masterへpush

最後にmasterへpushします。

```
$ git push origin master
```


これで無事にZennから共有GitHub リポジトリにプッシュできました。


## GitHubにアクセス

プッシュしたファイルがちゃんとプッシュされたかどうかを確認します。

すると、ファイルが「zenn_connect」の中に入っていました。

**zenn_connect/4e63b5fc8e6a2b.md**

Zennの公式ブログでは「articles」ディレクトリの中に入れなければならいので、

ファイルの保存場所を

**zenn_connect/articles/4e63b5fc8e6a2b.md**

にする必要があります。



## 新しいディレクトリを作成する

GitHubにアクセスしたら、「zenn_connect」ディレクトリに移動し、

「4e63b5fc8e6a2b.md」を開きます（※ファイルの保存場所はmainではなく、masterブランチにある）。

画面右上の「**えんぴつマーク**」をクリックし、編集画面を開きます。

上の方に、ファイルの保存場所を示す欄があり、そこに

**zenn_connect/4e63b5fc8e6a2b.md**

とあるので、これを

**zenn_connect/articles/4e63b5fc8e6a2b.md**

に書き換えます。


画面下の「**Commit Changes**」を押して終了します。





## Zennブログにアクセス

今度はZennブログにアクセスし、投稿したmdファイルがちゃんとあるかどうか確認します。

Zennにアクセスしたら、画面右上の自分のロゴをクリックします。

「**GitHubからのデプロイ**」を選択


## デプロイを修正する

履歴を見るとファイルがうまく更新されていないようです。

そこで、上のタブから「**リポジトリ設定**」を選択

デプロイ対象ブランチを確認すると、

「**main**」

になっていました。

正しくは

「**master**」

なので変更します。

次に「**手動デプロイ**」を開始し、再びデプロイ履歴を見てみます。

今度はデプロイがうまくいき、きちんと更新できました。














##  参考サイト  一覧

Zenn CLIで記事・本を管理する方法 https://zenn.dev/zenn/articles/zenn-cli-guide

ローカルリポジトリをリモートにpushするまで - Qiita https://qiita.com/sayama0402/items/9afbb519d97327b9f05c

コマンドラインからVS Codeでファイルやフォルダを開く - Qiita https://qiita.com/1natsu172/items/b951aa33451dad36bd7c

git add .の際のエラー | 侍テラコヤ - 日本最安級のサブスク型プログラミングスクール https://terakoya.sejuku.net/question/detail/10577

【GitHub】authentication failedの解決方法【２段階認証】 https://donachikiblog.com/github-authentication-failed/

[GitHub] httpsでremote: Repository not found.となった時の対応方法 https://zenn.dev/nasubita/articles/b4d9cfaf0b6a78

ブラウザからGitHubリポジトリにフォルダを作成する - よしたく blog https://yoshitaku-jp.hatenablog.com/entry/2018/07/07/225642