GitHubは、無料のWebサーバーとして使える。↓↓↓
Yahoo! JavaScriptマップAPIで作成したサイトをGitHubのWebサーバーにコピーしてみた。正常動作している。
≪2nd マップ (Yahoo)≫
https://ok2nd.sakura.ne.jp/y-map/
↓↓↓↓↓
≪2nd マップ (Yahoo)：GitHubサーバー≫
https://ok2nd.github.io/ymap/index.html
HTTPSが無料で使えるWebサーバーとしてGitHubを使う。
HTTPSが無料で使える無料のWebレンタルサーバーを探したが見つからない。
Google Drive、Dropbox、Yahoo!ボックスなどをWebサーバーとして使う方法があったらしいが、いずれも現在は使えなくなっているらしい。
現在、使えそうなものとしてGitHubがある。ということで、GitHubを試してみた。
次の「ferret」の記事が分かりやすかったので、参考にさせてもらった。
ただ、現時点では「GitHubのデスクトップ版」がバージョンアップされて、上記記事とはUIなどが変わっているようなので、以下に手順を備忘録として載せて置く。
【事前準備１：GitHubアカウント作成】
GitHubサイトにアクセスして、「Sign up」の画面からアカウントを作成。
【事前準備２：GitHubのデスクトップ版インストール】
以下のサイトからGitHubのデスクトップ版「GitHub Desktop」をダウンロードして、インストール＆アカウント設定。
【１．リポジトリ作成】
以下、デスクトップ版を使っての手順。リポジトリを作成。「Create new repository」ボタンを押す。
2つ目以降を追加する場合は、メニュー「File」の「New repository...」を選択。
例として、リポジトリ名は「Test」とする。
Local Pathは任意のパスに置き換えて、「Create repository」ボタンを押す。
自分のパソコンのLocal Pathで指定したディレクトリ下にリポジトリ名のディレクトリが出来上がる。
【２．テスト用HTMLを作成】
テスト用HTML（「Hello World」を出力させる）を作成して、自分のパソコンのリポジトリ名のディレクトリに入れる。
<!DOCTYPE html>
<html>
<body>
<h1>Hello World</h1>
</body>
</html>
GitHubのデスクトップ版の画面に以下のように表示される。
【３．コミットする】
Summary欄に何か入れて、「Commit to master」ボタンを押す。
【４．Publish repository 】
「Publish repository 」する。「Keep this code private」のチェックを外す事。
【５．レポジトリの設定画面でSourceを「master branch」にする】→（仕様変更になっている。下の５．を参照。）
Web画面の「Settings」で、下の方にスクルールし、「GitHub Pages」欄のSourceがNoneになっているのを「master branch」に変更し、「Save」ボタンを押す。
【５．レポジトリの設定画面でSourceを「main」にする】
Web画面の「Settings」で、下の方にスクルールし、「GitHub Pages」欄のSourceがNoneになっているのを「main」に変更し、「Save」ボタンを押す。
【６．ブラウザで作成したサイトの確認】
ブラウザで、作成したサイトの確認をする。URLは、以下の形式。
https://ユーザー名.github.io/リポジトリ名/index.html
リポジトリ名に大文字を使った場合は、そのまま入れること。「Hello World」と表示されればOK。以下は例。
https://ok2nd.github.io/Test/index.html
【修正する場合】
１．ソースの修正。
以下、「GitHub Desktop」で操作。
２．「Current repository」で該当のレポジトリを選択。
３．Summary に何か入れて「Commit to master」
４．「Push origin」する。
【補足：リポジトリの削除方法】
Web画面の「Settings」で、下の方にスクルールし、Danger Zone欄の「Delete this repository」ボタンを押す。
確認画面で、消したいリポジトリの名前を入力し、「I understand the consequences, delete this repository」ボタンを押す。
GitHubをWebサーバーとして使ったWebページ。
https://ok2nd.github.io/myportal/index.html
https://ok2nd.github.io/sitemap/hatena-sitemap.html
https://ok2nd.github.io/sitemap/hatena-sitemap-table.html
https://ok2nd.github.io/sitemap/hatena-sitemap-table-img.html
GitHubをWebサーバーとして使った事例。↓↓↓
2018年「みなとこうべ海上花火大会」と「カンパイKOBE」
8月4日。神戸「みなとこうべ海上花火大会」と、花火大会に合わせて開かれるイベント「カンパイKOBE」。
「カンパイKOBE」の開催場所は、三宮南の「みなとのもり公園」。日本酒ブースでは無料試飲などがある。が、毎年無料試飲の酒の種類が減って、アルコール度数の低い軽い酒ばかりになってきた。昨年はチーズの試食やコーヒーの無料試飲もあったが、今年はなかった。
花火大会は、打ち上げ場所に近い場所は混雑するし、カンパイKOBEの場所も高速道路やポートライナーの高架があって、花火は見づらいと思うので、昨年は「みなとのもり公園」から東に15分程の脇浜海岸通で、今年は脇浜海岸通からさらに東に15分程の兵庫県立美術館の4階テラスから見た。打ち上げ場所からは遠いので、臨場感には欠けるが、それなりによく見える。写真はSONY DSC-HX90Vの花火モードで手持ちで撮影したが、やはりブレブレの写真になった。
無料版はてなブログでスマホのCSSをJavaScriptを使ってカスタマイズする方法。成功せず。
無料版はてなブログでは、スマホのデザイン(CSS)を設定で一律に変更することができない。レスポンシブ対応のテーマを使えばできるが、そうでない場合、CSSを設定できない。
詳細設定で、headにJavaScriptを追加できるので、JavaScriptを使ってCSSを追加することを考えたが試した限りでは成功していない。
【試した方法 １】jQueryを使って。
$(function(){
$('#content pre').css('color', '#00a');
});
【試した方法 ２】jQueryを使わず。
window.onload = function() {
var els = document.querySelectorAll('#content pre');
for (var i=0, l=els.length; i<l; i++) {
var el = els[i];
el.style.color = '#00a';
}
};
【試した方法 ３】jQueryを使わず。
window.addEventListener('load', function() {
var els = document.querySelectorAll('#content pre');
for (var i=0, l=els.length; i<l; i++) {
var el = els[i];
el.style.color = '#00a';
}
});
【試した方法 ４】CSSファイルを別サイトに置いて読み込む。
document.write('<link rel="stylesheet" href="https://ok2nd.sakura.ne.jp/css/hatenablog.css">');
岩手山）犬倉分岐→犬倉山。
8月1日。岩手山網張登山口→網張展望リフト→犬倉分岐→犬倉山往復。
休暇村岩手網張温泉横の網張展望リフト3本を乗り継いで犬倉分岐下まで。昨日に比べて天気が良く視界も開けている。犬倉分岐のまわりの山が良く見えた。ただ、岩手山には雲がかかっていて山頂は見えない。
犬倉山山頂を超えて降りる道は、昨日の犬倉分岐から大松倉山までの道と同じく粘土質で水分を含んだ道で歩きづらい。途中からかなり曇ってきた。
昨日歩いたコースも含めて犬倉山周辺はトンボが多い。シャツにとまったトンボがカメラを近づけても逃げない。
帰りは、最後の一番下のリフトは使わずに歩いて下る。
リフトも含めて、7.3km、休憩時間含んで3時間。歩行距離は2km、歩行時間は1時間30分。
