tanaka's Programming Memo

プログラミングについてのメモ。

Web

さくらインターネットで.htaccessを使ったリダイレクト

Web

さくらインターネットのスタンダードプランのレンタルサーバーで以下をやった時のメモです。 独自ドメインのトップへのアクセスは、WordPressのブログへリダイレクト 独自ドメインの実在しないディレクトリやファイルへのアクセスは、httpsに変更してさくら…

Reactでのbrowser.js(browser.min.js)が見つからない

Reactのサンプルで、CDNから browser.min.js を読み込んでいます。ローカルで動かそうと思って、index.htmlで読み込んでいるスクリプトを用意しようとしたら、 browser.min.js は、Babel6で削除されたとか言われて入手が困難です。 browser.jsとは? browser…

Gulp+React+Babel(babelify)+watchify+BrowserSyncを使ったビルド設定

Reactの復習と、記憶を呼び戻すための自分用のメモです。uglifyやらmapファイルの作成もしてないごく簡単な動作確認用のものです。 利用するもの Gulp ビルドやデプロイなどを行うツール React クライアントサイドのビューを担当するエンジン Babel 策定中の…

PHPで簡単にPOSTする

PHPUnitのテストなどで、手っ取り早くPOSTする時の関数。PHPの公式ページのサンプルなどを参考にしました。PHP: file_get_contents - Manual

PHP DOMDocumentのloadHTML() ShiftJISでエラー

①などの文字が含まれるHTMLページをDOMDocumentのloadHTML()でDOMにしようとしたところ、以下のようなエラーが発生してしまいました。 DOMDocument::loadHTML(): input conversion failed due to input error, bytes 0x81 0xAE 0xE3 0x81 やりたいことは、Sh…

JavaScriptとjQueryで様々な画面サイズを取得する

Webアプリでレイアウトを制御しようとすると様々な画面サイズを把握する必要があります。iPhoneのシミュレーター上のSafariでの動作結果をまとめました。 取得方法 Webブラウザーのクライアント領域の論理ピクセル数 Webブラウザーが1画面で表示できる範囲で…

iPhone/iPadでタップが反応しないこととviewportの不具合対応

散歩リンクにおいて、iPhone/iPadだけ、以下の不具合が発生しました。 操作説明で、画面をタップして先に進む操作ができなかった 画面レイアウトが崩れていた その対処でやったことです。 タップが効かない 原因は、 iOS で click イベントがわけのわからな…

ReactでBootstrapのProgressBarを利用する

(メモのため、要点しか書いてません。)ReactでBootstrapのProgressBarを使って、ファイルの読み込み状況を表示しようとしたところ、バーが全然伸びない症状が発生しました。 原因 ファイルの読み込みなどの重い処理を実行中は、BootstrapのProgressBarのアニ…

JavaScriptでテスト PhantomJS のインストール

JavaScriptでブラウザーでの挙動をテストする場合、Seleniumを使ってGoogle ChromeやFirefoxなどのブラウザー上で実際にテストする方法と、PhantomJSというコンソールで動かせるブラウザーでテストする方法があります。基本機能のテストでは、Seleniumを使う…

gulp+watchify+browserify+babel+reactでビルドが速くならない

watchifyでビルドの高速化を図ろうとしたところ、ビルドするたびに遅くなってしまいました。原因は、Browserifyのオプションを指定していないことでした。以下、オプションとWatchifyとBrowserifyの部分の抜粋です。propsが必要でした。 var jsSrcPath = "./…

Unityの作品をGitHub Pagesで公開する

Unityの作品を気軽に配信するには、Webブラウザ上で実行できるようにして、ホームページで配信するのがよいでしょう。ここでは、GitHub Pages上でUnityの作品を公開する手順を紹介します。 公開する際の注意 うっかり守らなかったらどうなるのか UnityでWeb…

macのapacheが接続できなくなった時の対処

以前、SSL関連のエラーが気になって直そうとして失敗していたのが原因でした。/private/var/log/apache2/error_log を確認すると、以下のようなエラーが発生していました。 [Mon Aug 31 16:28:02.028682 2015] [ssl:emerg] [pid 2341] AH02562: Failed to co…

GulpとBrowserSyncでreloadが動作しない

gulpで監視タスクを開始して、監視対象のファイルを変更すると、ログでは「Reloading Browsers...」と表示されるのですが、ブラウザは更新されないという症状が発生していました。原因として見つけたのは以下のもの。 bodyタグがないと動かない linkの指定が…

mac OS X10.10 で gulp watchify が動かない

突然、gulp の watch タスクが動かなくなりました。原因は、該当フォルダーのSpotlightの設定が壊れていたことでした。 チェック方法 同様の症状かを確認するには、以下を行います。 Finderで、監視するJavaScriptなどが入っているフォルダーを開く ターミナ…

Yeomanのmacへの導入とチュートリアル

Yeoman(ヨーマン) 公式ページ: http://yeoman.io/Webアプリを開発する際に、利用したいライブラリを開発用フォルダー内に展開して、ビルドやテストの環境なども構築してくれるサービス。標準的なプロジェクトフォルダーの構築などを自動的に行ってくれるの…

Bootstrapの概要の概要

ざっくりとどういうものかの覚え書き。Bootstrap 3.0入門 (全18回) - プログラミングならドットインストール ←具体的な内容についてはこちらへ。その後、使う場合は公式ページにサンプルなど揃ってます。Bootstrap · The world's most popular mobile-first …

SASSのメモ

参考 フロントエンドエンジニア養成読本 [HTML、CSS、JavaScriptの基本から現場で役立つ技術まで満載! ] (Software Design plus) p73 SASSの公式サイト Sass: Syntactically Awesome Style Sheets @IT 爆捗! WordPressテーマ作成ショートカット(3):CSSコ…

CSS関連のメモ

フロントエンドエンジニア養成読本 [HTML、CSS、JavaScriptの基本から現場で役立つ技術まで満載! ] (Software Design plus)作者: 斉藤祐也,石本光司,加藤賢一,水野隼登,谷拓樹,泉水翔吾,原一成,平木聡,佐藤歩,杉本吉章出版社/メーカー: 技術評論社発売日: 20…

MongoDBをMacにインストール

インストール ダウンロードとインストール Install MongoDB on OS X — MongoDB Manual 3.0.1 を参照して、以下をターミナルで入力 brew update brew install mongodb --with-openssl しばらく待つと、インストールが終わる フォルダ作成 MongoDBを起動する前…

書籍TypeScriptリファレンスのメモ

TypeScriptリファレンス Ver.1.0対応作者: わかめまさひろ,井上章,丸山弘詩出版社/メーカー: インプレスジャパン発売日: 2014/05/16メディア: 単行本(ソフトカバー)この商品を含むブログ (2件) を見る 読んだ際の備忘録。 スコープはJavaScriptと同じ スコ…

TypeScriptの概要、Macへのインストール、チュートリアル

Microsoftが開発しているいわゆるaltJSというJavaScriptのコードを生成する言語。オープンソース。再利用や規模の拡大に耐えうるコードを書くのにはJavaScriptはいくらか機能が不足していたり、分かりにくいイディオムに頼らねばならない。そこで利用するの…

Underscore.js

Backbone.jsをやるにあたり必要そうなので事前に概要を勉強。 JavaScriptの便利なライブラリ eachやmap、templateなどで簡単に書くことができる 教材… Underscore.js入門 (全10回) - プログラミングならドットインストール 公式サイト. Underscore.js 勉強し…

BackboneJS

BackboneJS概要 技術評論社. フロントエンジニア養成読本 Web環境の変化に耐えるJavaScriptの設計と指針 p83-84より マナーを守るためのベースを提供 短期的な生産性の向上やコードの縮小はない 中・長期的な生産性や保守性の向上 MVC、イベントシステム、ル…

パーフェクトJavaScript勉強メモ(22)

前へ 22章 実践Node.jsプログラミング p502 ネットワークやファイルを非同期で処理する実例紹介 HTTPサーバ処理 http関連のAPIはhttpモジュール httpモジュールでは基本的なHTTP機能を提供 HTTPサーバ処理の基本 http.ServerクラスがHTTPサーバ処理の中心 イ…

パーフェクトJavaScript勉強メモ(21)

前へ | 次へ 21章 サーバサイドJavaScriptとNode.js サーバサイドJavaScriptの動向 p472 ネットスケープ社が提供していた時代があった 一度廃れたが復活してきた HTML5やAJAXなどや、Java仮想マシン上で動くJVM言語の盛り上がりの影響 JVMのJavaScript実装で…

パーフェクトJavaScript勉強メモ(20)

前へ | 次へ 20章 Web APIの実例 p439 Web APIのカテゴリ p440 Google Translate API Googleの翻訳用API 補足:現在は有料になっている Google Maps API p445 Google Static Maps APIは、画像タグのURLに仕込むことで、画像を得られる マイマップ p446 イン…

パーフェクトJavaScript勉強メモ(19)

前へ | 次へ 19章 Web APIの基礎 Web APIとWebサービス p422 APIとはApplication Programming Interfaceの略 Web APIが想定するシステム Web APIは、HTTPでリクエストを送り、結果を受け取る規約のこと Web APIの歴史 スクレイピング Webページはもともと人…

パーフェクトJavaScript勉強メモ(18)

前へ | 次へ 18章 WebWorkers WebWorkers概要 p408 WebWorkersとは WebWorkersの動作 通常のJavaScript実行環境をメインスレッド、Web Workersにより生成されるバックグラウンドのものをワーカと書籍では呼ぶ ワーカは複数生成できる メインスレッドとワーカ…

パーフェクトJavaScript勉強メモ(17)

前へ | 次へ 17章 WebSocket WebSocket概要 WebSocketとは p393 1本のHTTP接続上で双方向のメッセージやりとりができる HXMLHttpRequestとServer-SentEventsを利用したやりとりよりも効率がよく、設計や実装もシンプル 補足:2015/2/12現在、Operamini以外の…

パーフェクトJavaScript勉強メモ(16)

前へ | 次へ 16章 ストレージ Web Store p376 Web Storeとは WebStorageの容量は、書籍の時点では5MB程度 p377 オリジンごとに共有され、読み書きができる localStorageオブジェクトとsessionStorageオブジェクトにプロパティの読み書きをすればよい localSt…