//tips
//Github・ターミナル理解
前回記事のGIthub理解により、共同でローカルおよびネット上のアプリのフォルダ(リポジトリ)を管理しやすくできること、ターミナルによりフォルダ(リポジトリ)の作成・移動が文字操作ベースでできることがわかった。
続いて、Githubとターミナルの連動方法を確認する。
https://qiita.com/yuhoneko/items/7faf37de592f6728e826
https://qiita.com/Leonardom/items/5b94cd7e96a6fe87c6a4
https://qiita.com/ka0ru19/items/1a8ff0fb9e945ef01256
Gitinitではディレクトリ内に.gitという隠しファイルが生成される。この.gitというファイルが含まれているフォルダとそれより下位にあるフォルダがgitで管理されることになる。
これは、ターミナルがGithubに干渉できるような設定がなされていることを前提としているので、macターミナル初回使用時のgitの設定を確認した。
https://qiita.com/ucan-lab/items/aadbedcacbc2ac86a2b3
https://qiita.com/tsweblabo/items/918cbed88f00215c4800
https://prog-8.com/docs/git-env
gitコマンドでxcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrunなどのエラーができるので、xcodeをインストールする必要があり、
xcode-select --install
を押すと、インストール画面が出る。
インストール実行中に「このソフトウェアは、現在ソフトウェア・アップデート・サーバから入手できないため、インストールできません。」と出るのでxcodeの容量が大きすぎてこのようなエラーが出る可能性もあるが、容量以外の可能性も見つかった。
Appleから手動で「command line tools」をインストールすると直るという記述を見つけたので試してみた。「command line tools」は2.3GB相当の容量。
https://developer.apple.com/download/more/
こちらで問題は解決し、git --versionもうまく表示された。
//github pages作成
ここからgithubpagesを用いてwebページを作成する。
下記を参考にした。
アップロードなどをすることにより、settingにあるgithubpagesのsourceに選択肢ができるので、そちらでmainを選ぶ。
githubpages/index.htmlに下記スクリプト記載ファイルをアタッチし、テーマを追加したものが画像のものとなる。
---
layout: default
---
<h1>Hi,world!</h1>
デフォルトのテーマ内容を変更するために下記を参考にして編集を行う。
https://aregsar.com/blog/2019/how-to-customize-your-github-pages-blog-layout-in-five-minutes/
Githubにフォルダを作成する方法はpath/to/.gitのように/まで含めてしまうことで作成できる。
https://qiita.com/tommy_aka_jps/items/b2ae85cbeab77e12a925
今回はAdd fileからcreate new fileを行い、_layouts/default.htmとすることで_layoutsフォルダ内にdefault.htmを設置することができる。
現在私が使用しているテーマのdefault.htmの下記オリジナルをコピーして、今回作成した自身のdefault.htmに貼り付ける。
https://github.com/pages-themes/cayman/blob/master/_layouts/default.html
default.htmの一部を下記のように変更。
<header class="page-header"
role="banner">
<h1 class="project-name">Areg Sarkissian</h1>
</header>
<main id="content" class="main-content" role="main">
{{ content }}
<footer class="site-footer">
© 2019 Areg Sarkissian
</footer>
</main>
最終的に下記のスクリプトないように変更し、ページを作成した。
<!DOCTYPE html>
<html lang="{{ site.lang | default: "en-US" }}">
<head>
{% if site.google_analytics %}
<script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', '{{ site.google_analytics }}');
</script>
{% endif %}
<meta charset="UTF-8">
{% seo %}
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#157878">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<link rel="stylesheet" href="{{ '/assets/css/style.css?v=' | append: site.github.build_revision | relative_url }}">
</head>
<body>
<header class="page-header" role="banner">
<h1 class="project-name">迷 宮 推 理</h1>
</header>
<main id="content" class="main-content" role="main">
{{ content }}
<footer class="site-footer">
© 2020 Akihiro Nakamura
</footer>
</main>
</body>
</html>
Github pagesの作成のみの場合、ターミナルコマンドを使用することなくpageを作ることができた。