PHPでユーザ入力値を使ってDB操作をする際に、プリペアドステートメントを使うと安全だ。 と色んなサイトに載っています。 実際にPHPマニュアルにも明記されています。 アプリケーションで明示的にプリペアドステートメントを使用するように すれば、SQL イ…
MAMPでクエリログを出力したい時のTipsです。 環境 MAMP : バージョン 2.0.5 設定 MySQLの起動用シェルスクリプト（/Applications/MAMP/bin/startMysql.sh）に以下の様にオプションを追加します。 /Applications/MAMP/bin/startMysql.sh # /bin/sh /Applicat…
プロジェクトNo.40：ユーザ管理画面 - DEMO前回の超簡素なログインシステムに引き続き、ユーザ管理画面を作りました。 SELECT, INSERT, DELETE, UPDATEと基本的な機能のみを考えて、なるべくセキュリティにも気を使いました。
プロジェクトNo.39：PDO - DEMOPHPの変数やループなどの基本的な書き方はわかってきたら、次のステップはPHPからのDB接続。 単にDB接続と言っても色んな書き方があったり、セキュリティを気にしなくてはいけなかったり、結局どういう風に書けば良いの？ とい…
プロジェクトNo.38：matter.js - DEMO重力、バウンド、慣性。これらを表現するには数学的知識とそれを実装する根気が必要です。 そんなものは持ち合わせていない私は、先人が作った素晴らしい物理演算エンジンのmatter.jsを使うことにしました。 なんとスマ…
プロジェクトNo.37：自作JQueryプラグイン - DEMOこれまで既存のJQueryプラグインをいくつか使ってみたが、 自分でも簡単に作れるようなのでやってみた。 仕様は、クリックするとメッセージが表示されるものになります。
プロジェクトNo.36：blend-mode - DEMO複数の背景画像や色などを重ね合わせることができるCSSの機能「ブレンドモード」。 ただ単に重ね合さるだけではなく、色々な効果を与えることができます。 言葉で説明するのが難しいのでまずはDEMOをご覧ください。
プロジェクトNo.35：localStorage - DEMOHTML5のWeb Storageの一つであるlocalStorageを使ってTODOリストを作ってみましたが、 今回は正直、結構はまりました。 そのバグトラッキングも含めてご紹介したいと思います。 新しく覚えた部分が多かったので少し長…
プロジェクトNo.34：layerBoard.js - DEMOたまにサイトに訪問すると、最前面に表示されるアレ。 実はモーダルウィンドウっていう名前のものなんですね。（私も今回初めて知りました） layerBoard.jsは簡単にモーダルを表示させるためのJQueryプラグインです。
Windowsではフォルダプロパティから、Linux系のコマンドならls -aで表示できますが、 Macではどうやって隠しファイル及び隠しフォルダを表示するか。
プロジェクトNo.33：textillate.js - DEMOtextillate.jsはテキストにアニメーションをかける事ができます。 実際のエフェクトの種類はanimate.cssの機能です。
3本指で横にスワイプ！（ビャッ！）デスクトップの切り替え！ 3本指で上にスワイプ！（ビャッ！）立ち上げてるアプリの一覧表示！ 4本指でキュッ！（この動作の名前がわからない）アプリケーション一覧表示！ 4本指でファッ！（この動作も名前がわからない）…
プロジェクトNo.32：jQuery.Deferred - DEMOjQuery.Deferredはバージョン1.5から導入された、非同期処理をうまく扱うための標準モジュールです。 jQuery.Deferredなしで要素を順にアニメーション表示するにはコールバック関数とdelay()を使えばできるようで…
プロジェクトNo.31：上部に固定ナビゲーション - DEMO画面上部のヘッダーを固定してスクロールしても常時、上部にリンクがある様にする方法。 色んなサイトでよく見られる表現ですが、ページ内リンクでずれるなど、色々気を付けねばいけない事がある様です。…
プロジェクトNo.30：fullPage -> DEMO1画面毎にスクロールできるプラグインです。 縦スクロールはもちろん、横にもスクロールさせてスライドの様にも使えます。
プロジェクトNo.29：画面サイズいっぱいの背景画像 - DEMO ビジュアル重視のサイトでよく使われるテクニックです。
MacでPHPなどのローカル環境開発に導入が超楽なMAMP。 サーバを起動ボタンを押すと、本来ApacheサーバとMySQLサーバが起動するはずが、 たまにMySQLサーバのみ起動しない時がある。 この対処法を紹介します。
プロジェクトNo.28：jquery.inview - DEMOパララックス（要素出現）も以前自作しましたが、プラグインがあったので使ってみたいと思います。 また、せっかくなのでCSSでPinterest風に表示させてみました。
プロジェクトNo.27：Nikebetterworld Parallax Effect背景画像のパララックスは以前自作しましたが、プラグインがあったので使ってみたいと思います。 また、同梱していたライブラリでサイト内遷移がヌルッと動くスムーズスクロールも実装してみました。
プロジェクトNo.26：gallerifficサムネイル付きでオプション豊富なフォトギャラリーのgallerifficを使ってみたいと思います。 このプラグインはサムネイルにページング機能があるので、画像が多い場合に便利です。 また、プリロードする画像数などを決めれる…
プロジェクトNo.25：flexsliderそろそろ実際に仕事で役立つ（だろう）技術を使えるようにと、様々なプラグインを活用していこうかと思います。 手始めにここで紹介されているプラグインを片っぱしから触っていきます。 【新人向け】簡単にできた！Webサイト…
プロジェクトNo.24：パララックス3前回に続けてパララックス効果を使ったサイト第３弾。 今回はマウスポインタの方向を目玉が追いかける様なパララックスサイトを作って見ました。
プロジェクトNo.23：パララックス2前回に続けてパララックス効果を使ったサイト第２弾。 今回はスクロールすることで背景位置が変わるのと、要素が出現するパララックスサイトを作って見ました。
プロジェクトNo.22：パララックス1パララックスとはparallax=(観察者の位置の移動による)変位、 つまり視差の事で、視点の差を使って立体的な効果を出すことをパララックス効果と言います。 一時期流行った手法ですね。 今回はスクロールすることで要素が変…
プロジェクトNo.21：神経衰弱ドットインストールのレッスンを参考にJavaScriptで神経衰弱を作ってみた。 改良点はカード画像と３段階のレベルを用意した。 今回の記事では、前から気になっていた「全体をfunctionで括る理由」や「onclickをHTML内で書いては…
プロジェクトNo.20：パズルHTML5から利用可能になったドラッグ＆ドロップ専用の新しいイベントや新しいメソッド・属性などを使ってみた。 mousedownやmouseupで無理やりできるものもあるが、Googleドライブの様にローカル環境のデータをドラッグでアップロー…
プロジェクトNo.19：チャットアプリJQueryで結構簡単にAjaxが使えるということで、 せっかくなら非同期通信のメリットを活かせるリアルタイムな簡易チャットを作ってみた。
プロジェクトNo.18：スクラッチくじCanvasを２枚重ねて、前面のcanvasをマウスダウンとマウスムーブで消すといったものを作りました。
プロジェクトNo.17：イライラバーJQueryのお勉強。 前回、JQueryのマウスイベントを利用して描画アプリを作成したが、 今回はその応用としてマウスがオブジェクト上から離れたらゲームオーバーになる、 いわゆるイライラ◯◯を作ってみました。
プロジェクトNo.16：Doodle(Canvas)jQueryとHTML5のCanvasを使って描画ツールを作成しました。 線と四角の描画、色の変更、太さの変更、消去、ギャラリーに追加、ギャラリーのデータを保存する事が可能です。
