ローカルサイト近況報告
ローカルサイト近況報告
サーバー化をやめた。
pcのスペックが原因かは定かじゃないけど反映が遅い＆CGIやphpを使わないので、もうhtmlファイルをChromeにドラッグアンドドロップして表示させたほうがいいやんとなり、そうしてます。
ブクマすれば見れるしね。
あれからだいぶローカルサイトが豊かになった。
大昔の絵や小説をまとめるサイトを個別で作って、ローカルサーチ(ローカルランキング)も作ってサイトを並べたり、
気に入ってる5chのスレをまとめてcssで見やすくカスタマイズしたり、
wDiaryで普通の日記と本のレビューブログ、音楽のレビューブログ作ってhtml化してローカルサイトに繋げたり、
一次創作(all健全)の二次創作サイト(18禁)を作ったり、
絵描き+小説書きに100の質問に答えたり、
ネットで気に入った同人関係の記事をまとめたり、
ファンシー系のイラスト素材や、古のデコメ絵文字を作って素材サイトを作ったり…
(デコメ絵文字大好きで外に出してもまったく需要はないが並べたり自分が使ったりするのが楽しい)
デザインセンスが終わってるのでたまにテンプレートをお借りしてサイトを作ると「知らない人のサイト」感で新鮮味がある。
いろいろやってみるととにかく自由で楽しいので、
オンラインサイトだと人目が気になって仕方ないとか、サイトを持ちたいけど自分一人で創作活動を楽しみたい、自分の創作を独り占めしたいとか、自分だけの作品保管場所が欲しいって方は、
ローカルサイトおすすめです。
私はオンラインサイトも持ってて、いまは人の目に疲れてしまってローカルサイトを本館にしてるんだけど、
オンラインはオンラインで、人目があるとモチベがあがるとか、人目があってようやく作品を完成させられる(ローカルだと楽しいところだけ書いてしまうので私の場合一生作品が完成しないw それが悪いわけではけっしてないんだけど、完成させたいときもある)とかもあるので、おそらく私はずっとオンラインとローカルがの二足の草鞋になるかなぁと思います。
でも考えって流行みたいに時間で変わっていくのでオンラインｲﾔ~ッ！！！ローカル一途になる！ってなって消しちゃうかもだけど
SDカードにhtmlファイル（サイト）を入れて、ローカルファイルをスマホのブラウザで開くことでサイトを閲覧出来るらしい
実は今までもローカルサイトの作り方を調べて行く中で「SDカードにサイトのフォルダを入れてスマホで見られる」という情報は何度も目にしていたもののなかなかうまく行かなかったのですが、つい先程ようやく成功したので共有。
たぶんSDカードなくても直接スマホにサイトのデータ入れても出来ると思うけどやってないからそこは書いてない。試してみてください。
前提
・機種：Android
１.まずSDカードにサイトのファイルを入れる。
２.SDカードのファイルパス（場所）を調べる。
↓こちらの記事がとてもわかりやすく、参考にさせていただきました。
３.opera BrowserをインストールしてURLに「file://(ファイルパス)」を入れる
例：「file:// /SDカード名/index.html」
// /のスペースはわざと空けてます。実際打つ時は開けないでね
で閲覧出来ます。
Chromeで試したんですけど、ローカルファイルのリンク（上記のfile://～ ）を入力すると勝手に検索しちゃってアクセス出来ないんですよね。PC側、スマホ側に拡張機能入れてもダメだった。なんやねん
どうすればいいのか分からなくてググったらFirefoxとoperaなら行けるとのことでFirefoxで試してみた所うまく行かず…operaで試すと上手くいきました。
これならわざわざアプリに課金しなくても使えるので手軽で最高だと思います。
こんなに簡単に出来るとは思っても見なかった。
operaが永遠にローカルファイルリンク出来ることを願う。
ローカルサイト（KSWEB）重すぎ問題
ローカルサイトを立ち上げたはいいものの、ファイルが増えるとリンク飛んでからページ表示されるまで５秒以上待たされるの何？？？？？？？無理・・・・・・やっぱり私にローカルサイトは無理なのかな・・・・・（ネガティブ）って思ってたら、どうやらフォントが悪さをしていたらしい。
ネットに繋がってないのに頑張ってGoogle font呼び出そうとしてたからクッソ重くなってた。
消してフォント変えたらバチバチに快適になりました。
＞追記
どうやらリンクがうまく出来てない（相対パスとか）場合でも重くなったりすることがあるみたいです。
他にも、フォルダ内のファイルが多すぎるとそれの読み込みによって重くなることもある模様。
私の場合、1フォルダに20ファイル入っていると重くなったので、1フォルダ10ファイル以内に収めるようにすると軽くなりました。
こんな感じ↓
（念のために言うとこれは例です！実際はhtmlファイルだよ！）
10ファイル以降はまた新規フォルダを作ってそこに収納すればOK。
＞＞追記
ストレージがいっぱいでも重くなるのである程度の余裕が必要。
私の場合、ローカルサイト専用のSDカードを購入しました。
KSWEBでファイル指定しなきゃいけないのにSDカードのファイルパス（場所）がわからん…ってなって、こちらの記事が役に立ちました。
ローカルサイトを作る＋スマホで閲覧可能にする方法
つい昨日一昨日に念願のローカルサーバーを構築してローカルサイトを立ち上げたので、同じようにローカルサイトを作りたい人のためにメモ代わりに記事を残しとく。
とはいえ有識者の記事を読んでその通りに実行しただけなのであまり説明することもない……ので記事を貼っておく。
＞＞追記
↓もっと簡単にスマホでローカルサイトを閲覧出来ます。
私の環境
・PC（win10）
・Android（スマホでローカルサイトを閲覧したいiPhoneユーザーの方は参考にならないと思いますｺﾞﾒﾝﾈ・・）
【XAMPP】インストール方法を解説する【使い方講座①】
https://miya-system-works.com/blog/detail/41
↓
【XAMPP】Apache・MySQLの使い方を解説する【使い方講座②】
https://miya-system-works.com/blog/detail/42
↓
【XAMPP】ApacheでローカルWEBサイトを作る【使い方講座③】
https://miya-system-works.com/blog/detail/43
めちゃくちゃ説明がわかりやすいのでこの順番で記事の通りにやればめちゃくちゃ簡単＆スムーズに出来る。
私の場合、躓いたのはスマホでローカルサイトを見る方法だった。
いろいろ検索して記事を見てみたけど機械音痴には難しくてわからん。というか用語が難しくて何を言っているのかわからん。
でもなんかどうやらIPアドレスを使えばスマホからローカルサイトが閲覧できるらしいという知識を得る。
http://localhost/
↑このlocalhostの部分をIPアドレスに入力し直せば良いとのこと。
しかしそれっぽいIPアドレスをいれてもページが表示されない。なんで？？？？？
え、もしかして私がIPアドレスだと思ってるものがIPアドレスじゃなかったりする？？？？
知恵熱が出そうな中、唯一「おお…！」と参考になったページ↓
（おお…！となったもののある意味自分の希望通りにならなかったので急いでる方はここを飛ばしてもOK）
localhostのWEBサイトをスマホ実機で確認する方法 QRコードが便利
https://cumak.net/blog/sp-qrcode/
この方はMACでやってるけど、win10でも操作はそう変わらなかったので、ローカルIPを調べられた。
念のため詳しく書くと、設定→ネットワークとインターネット→プロパティ→一番下にIPv4アドレスの横に書かれた数字がローカルIP
（PCによってIPv4っていう表記じゃなかったりするかもしれん知らんが）
そしてようやく本物のIPアドレスがわかったところで、URLにアクセスしてみる。
注意してほしいのが、
localhostのWEBサイトをスマホ実機で確認する方法 QRコードが便利
https://cumak.net/blog/sp-qrcode/
↑この記事に
http://（IPアドレス）:3000
とあるが、このお尻にある3000は、XAMPPの記事（【XAMPP】インストール方法を解説する【使い方講座①】
https://miya-system-works.com/blog/detail/41～など）の通りにやれば、http://localhost:80/で作成されている。
つまり
http://（IPアドレス）:80
と入れるようにしてね！！！私はド忘れして何時間も頭を悩ませたよ！！！
そして無事にスマホでローカルサイトを表示させることに成功！！！！！！！！
したが………
XAMPPを停止（PCの電源を落とす）すると、スマホのローカルサイトも表示されないことに気づく。
あれ……思ってたんと違う…………（；O；）
そりゃそうだと思いながらもどうしても落胆してしまった。
私としてはPCの電源を落としてもお布団の中とかでぬくぬくしながらスマホでローカルサイト見たかったの・・・
ということで再びスマホでローカルサイトを閲覧する方法をネットの海から探し出す時間が始まった。
するとどうやらAndroid限定でKSWEBというXAMPPの代わりのようなアプリがあるらしい。
速攻インストールしてみると、
何故か過去の私がインストールした経験があったらしく……
（なんか過去にもローカルサイト作りたいと思って試しにやってみたんだと思う記憶ないけど…）
本来６日？くらいの試用期間があるようなのだが、私の場合課金しないと使えない状態だった。
そのため使いこなせるかどうかわからないままバチバチに課金をした。
スタンダード版で420円払って、途中で記事を調べながらアプリをいじっている内に「もしかしてプロ版じゃないからこんなにうまく行かないのか…？」って思って結局追加料金で120円払った。
もしかしたらスタンダード版のみでやっていけるかもしれない方は追加で課金しなくてもいいかもしれません。わかりませんが。
試用期間でいろいろ試してくれ。
とにかくKSWEBをいじりました。
初期状態からいろいろ増えてて試行錯誤の後が見えますが、とにかくやることはシンプルです。
まずここをオンにしないと始まらないのでオンにします。
（実は上記のIPアドレスわかんない事件は、ここのIPアドレスとPCのローカルIPを混同したことによって生まれた）
オンにすると、Host 0の「http://localhost:8080」にページが表示されるようになります。
なんか英語で書いてありますが気にしなくてOKです。ローカルサーバーが構築された証拠です。
そしてページが表示されてることを確認したら、再びさっきのHost 0の「http://localhost:8080」が表示されてるSTATUSのページに戻りまして、
左にスワイプすると、ページが移動します。
LIGHTTPDのタブに移動したら、Hostsの「localhost(8080/～うんたらかんたら英語)」となっている部分をタップすると、ポップアップが出てくるので、「Edit host」を選びます。
するとこんなページに飛びます。
ココをタップし、フォルダの場所に、XAMPPで作ったローカルサイトのフォルダを指定すればいいわけです！
どうやって？？？
つまり、「PCのローカルサイトのフォルダをまるごとコピーして、スマホに移して、スマホのローカルサーバーを利用して表示させる」ってこと！
勘のいい人は気付いてるかもしれないけど、ローカルサイトのURLが変わっているということは、別サイトということになるわけで、つまりローカルサイトのミラーみたいな形になるのね。
つまりPC側のローカルサイトのデザインをいじって保存したからと言って、スマホ版のローカルサイト側も反映される、というわけじゃないのです。
スマホで見たい場合は、繰り返しになるけど「PCのローカルサイトのフォルダをまるごとコピーして、スマホに移して、スマホのローカルサーバーを利用して表示させる」。
ごめんもっと他に効率いい方法あるのかもしれんが私にとってはこれが限界＆最善だった。
そして記事はもう少し続く。
まとめると、
１.PCのローカルサイトのフォルダをまるごとコピーして、スマホに移して、スマホのローカルサーバー（KSWEB）を利用して表示させる
２.KSWEBでローカルサイトのフォルダを指定して、「http://localhost:8080」のページにローカルサイトが表示されるようにする
まず１、
スマホにデータを移す。
いろんな方法があると思う。PCとスマホ繋いでデータ送るとか。
ていうか絶対そうして。普通にそれで出来るから。
でも私はやったことないし、こっちでも出来るやろ～って軽い気持ちでGoogleドライブを使った。
しかしGoogleドライブはフォルダごとダウンロード出来ないので、
PCでzipにする→Googleドライブからスマホでダウンロード→スマホでアプリ使って解凍（ZArchiverってやつ使いました）
というクソめんどｋさい方法でスマホに入れた。あほなん？
あとは
２.KSWEBでローカルサイトのフォルダを指定して、「http://localhost:8080」のページにローカルサイトが表示されるようにする
で確認してその通りになったら成功です。
KSWEBはオンにしてる限りいつでもスマホからローカルサイトに飛べるので最高です。
みんなも良いローカルサイト人生を
↓この記事も役に立つかも
