GitHubで素敵なリポジトリを見つけると、ついついforkしてしまいます。

なぜなら、Forkの方がはじめやすいからです。

詳細が気になる方は、過去にforkとcloneに違いについて解説しているのでこちらの記事をご覧ください：

ですが、forkしてリポジトリを設置すると非公開設定に変えられないんです。。。

そこで、今日は、一度はforkしたリポジトリをcloneしなおして非公開設定にする方法を解説します！

今まで動かしていたfork済みのリポジトリーのページから【Codeボタン】を押して、Cloneするための【HTTPS】リンクをコピーします。

今回私がコピーしたリンクはこちら：

https://github.com/herohoro/astro-notion-blog.git

VSCodeを立ち上げて、【Clone Git Repository…】を選びます。

リンクを入れる場所が表示されるので、そこに先ほどのリポジトリーのリンクを貼り付けます。

↓

↓

特に指定がなければそのままDestinationとして選びます。

そのまま誘導に従って進みます。

↓

ローカルリポジトリーができました😄

開発環境(npm run dev)で作業をできるようにするには環境変数を設定しておく必要があります。

package.jsonなどがある一番上の階層に.envファイルを設置します。

↓

.envファイルにNotion APIのTokenやNotionDBのIDを追記します。

※ 今まで使っていたfork済みリポジトリ内にある.envファイル内の内容をコピペすればOKです

NOTION_API_SECRET=
DATABASE_ID=

改造の仕方によっては環境変数が増えている場合があるので、よくご確認ください。

例：Notionサポーターサイト

NOTION_API_SECRET=
DATABASE_ID=
SUB_DATABASE_ID=
HOME_PAGE_ID=

ターミナルでnpm installをして、ライブラリーなどの依存関係を取り込みます。

↓

特にエラーが出なければ成功してます⭐️

npm run dev を入力してローカルホストが表示されるか確認してみます👀

最新版のastro-notion-blogは、http://locakhost:4321/ と表示されているはずです。

⌘+クリック で、開発画面を表示させてみます！

Cloneすると前に使っていたブランチも一緒に付いてきてしまって、

どれが使えるブランチなのかが分からなくなってしまいます。。。

Pushしたのに送れない…っていうので悲しくならないように、整理しておくのがオススメです！

Gitアイコンから3点マークをクリックし、Remoteの項目でRemove Remoteを選びます。

originブランチとして現れるリンクはforkしたリポジトリーのリンクになっています。

今回、forkしたリポジトリーを非公開するためにCloneして新たに非公開用のリポジトリーを設置しようとしているので、もうforkしたリポジトリーをつないで作業をすることはありません。

originブランチを選択してremoveしてしまいましょう！！！！！

originブランチを消さずに作業を進めようとしてハマった記事はこちら：

GitHubのページへ行って、新規でリポジトリーを作成します。

リポジトリー名はお好きな名前でOKです！

デフォルトではPublicになっているので、Privateに変更します。

【Create repository】を最後クリックして完成です！

GitHubでリポジトリーを新規で作成すると

リポジトリーのリンクがコピーできるようになっているのでコピーします。

VSCodeに戻って、Gitアイコンから3点マークをクリックし、Remoteの項目のAdd Remote…を選びます。

コピーしたリンクを貼り付けます。

Add remote from URLをクリックするとremote nameを聞かれるのでoriginとしておきます。

先ほど、npm installをしたときに依存関係の差分がcommit待ちしている状態なので、今回はそれをcommitしてみます。

差分がない場合は、何かちょっとコードの下に改行を加えたりして差分を作ってからcommitしてみてください。(動かなくならない程度に…)

commit名は何でもいいので、「first」としておきます。

commitボタンを押すと、Git Graphの方に反映されていることが確認できます。

ここでは、ローカルのmainブランチにfirstというcommitがpushされたという状態です。

Publish Branchボタンを押します。

originブランチを選択してGitHubのリポジトリーへつなげます。

少しPublish Blanchボタンのあったところがグルグルした後、Git Graphの方に反映がされたら成功です。

GitHubのページに戻ってリロードしてみると….

反映されています

このあと、ブラウザでブログを表示させるためにCloudflareの設定をします。

Cloudflareの設定方法は、astro-notion-blogのREADMEに詳しく記載がありますので、そちらを参照していただければ問題ないかと思います。

Cloudflareで環境変数を登録する際も、.envと同様に、手を加えて環境変数を増やしている場合には追加します。

問題なく動いていることを確認できたら、カスタムドメインを追加します。(⭐️)

forkして使っていたリポジトリーにつながっているCloudflareを開き、

カスタムドメインの環境変数を削除してください。

今回新たに用意したCloudflare(⭐️)の方で、Retry deploymentを実行します。

これですべて完了しました〜〜〜＼(^^)／＼(^^)／＼(^^)／＼(^^)／

おつかれさまです！！