†でおきしブログ†

ウナギ食べたいヽ(•̀ω•́ )ゝ✧

IISにWebページ突っ込んでWiFi経由でiPadで参照した【ローテク】

☆こんなの


BootstrapのテーブルでURL Linkを表示してるだけ。

☆作り方

  • IIS起動
    • [コントロールパネル]->[プログラム]->[Windowsの機能の有効化または無効化]からIISを有効にする
    • [蛇足]IISマネージャーのDefaultWebSiteの基本設定からルートディレクトリの場所を変更できるのでシステムドライブ以外にファイル置きたい時とかに便利
  • index.htmlファイル置く
    • デフォルトの場所はC:\inetpub\wwwroot
    • jQueryとBootstrap落っことして作るだけ
  • iPadから接続
★html側(tableの定義)
<div id="bootTable" class="container">
  <table class="table table-striped table-bordered ">
    <thead>
      <tr>
        <th>#</th>
        <th>名前</th>
        <th>URL</th>
        <th>***</th>
      </tr>
    </thead>
    <tbody>
    </tbody>
  </table>
</div>	
javascript側(tableへの行設定)
var urls = [];

//追加したいURLをpushで配列に追加=========================================START
urls.push("https://www.google.co.jp/");

//追加したいURLをpushで配列に追加=========================================END

$(function(){
	setBootTable();
});

/**
* テーブルへの情報設定
*/
var setBootTable = function(){
	for(var k in urls){
		var index = Number(k) + 1;
		var addRow = "<tr>";
		addRow += "<th scope='row'>"+ index +"</th>";
		addRow += "<td>"+urls[k]+"</td>";
		addRow += "<td><a href ='"+urls[k]+"'>LINK</a></td>";
		addRow += "<td></td>";
		addRow += "</tr>";
		$("#bootTable tbody").append(addRow);
	}
};

☆何故作ったか

ベランダでホタル族(タバコを喫う者)してるんですけれど、PCで作業してて引き続き参照したいWebページ見たい時とかに便利かなーと思い作ってみました。


もちろん以下のようなウェブサービスでもこの要件は解決すると思います。

★それでも作った事へのメリット
  • ローカルネットワーク内のアクセスなので速い
  • ブラウザアクセスのみ。ログインやらアプリ経由である必要もなくシンプル
  • jquery slim版をDLする時に「Ajax」じゃなくて最近は「Fetch」なのかー。とか勉強になる
  • BootStrapとか初めて触って楽しめた

IIS7.0 WEBサーバー管理ガイド (マイクロソフトITプロフェッショナルシリーズ)

IIS7.0 WEBサーバー管理ガイド (マイクロソフトITプロフェッショナルシリーズ)

jQuery最高の教科書

jQuery最高の教科書