サーバーだけに頼る時代は終わった!? クライアントサイドでしっかり Validation する方法 | phiary

2016/06/02 385 users クライアントサイド Validation Form サーバー

未だに form の validation って, とりあえずなんでも受け付けてサーバー側で してエラー返ってきたらヘッダーなりダイアログなりでエラーメッセージを表示するなんてのをよく見ます. 某大手サイトなんかはエラーがあるとリロードしちゃったりするし... 実はこの辺って HTML5 からクライアントサイドでもある程度できるように整備されています. なので ライブラリを使わなくてもある程度サー... 続きを読む

フロント界隈で一番イケてるのは AngularJS でも React でもなく Riot.js だという話 | phiary

2016/06/01 701 users AngularJS React Webpack wat イケ

10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。 あのライブラリは何故誕生したの?のまとめ - Qiita ここ最近話題になったエントリーですが, どちらも今最もイケてる Riot.js について全く触れられてなくて悲しくなったので書きました. はじめに 「webpack インストールしといてー」, 「gulp 導入して wat... 続きを読む

本日 JavaScript ゲームライブラリ『phina.js』をリリースしました! | phiary

2015/12/01 84 users ゲームライブラリ 国産 要求 設計 JavaScript

今日から phina.js Advent Calendar 2015 が始まりました♪ ってことで, 本日『phina.js』 をリリースしました! phina.js とは？ phina.js(フィナ ドット ジェイ・エス) は, JavaScript で作られた国産のゲームライブラリです. プログラミング初心者でも始めやすく, それでいて上級者のハイレベルな要求にも 応えられる, 柔軟な設計と豊... 続きを読む

JavaScript 便利メソッド集 | phiary

2015/11/16 168 users メソッド pure JavaScript コード 実際

ちょっとしたコードで JavaScript を豊かにしよう♪ ってこと jQuery は 嫌い 使いたくない. だけど Pure JavaScript だとちょっと物足りないってときに使える便利なメソッドをまとめてみました. すべて Runstant によるサンプル付きなので, 実際に開いて動かして試すことができます. 実行したりコードをいじってみたりと遊んでみてください. 他にもこんなメソッドあ... 続きを読む

CSS3 の box-sizing が便利すぎる!! padding や border に依存しない width, height 指定 | phiary

2015/11/04 639 users padding border box-sizing CSS3

今回は CSS3 から box-sizing について紹介します. width や height と同時に border や padding を指定しているときに, 少し値を変えただけで意図しない表示になったりレイアウトが崩れたという経験はありませんか？ これはボックスサイズの算出方法が複雑なのが原因です. そんな面倒な問題を解決してくれるのが box-sizing プロパティです!! box-s... 続きを読む

JavaScript の比較演算子 == と === の違い | phiary

2015/10/28 118 users fork Java 比較演算子 Runstant Lite

JavaScript における比較演算子 == と === の使い分けって, C や Java といった他の言語にはない仕組みなので意外と戸惑う人もいるみたいですね. 今回はその違いについてまとめました. Runstant Lite で作ったサンプルもあります. 良かったら fork して遊んでくださいな♪ 等価演算子と厳密等価演算子 JavaScript には, 型変換して比較するあいまいな比較... 続きを読む

JavaScript で DOM 要素の絶対座標を取得する方法 | phiary

2015/10/25 53 users DOM window.onload Hoge 備忘録 要素

備忘録. スペニット的に使ってもらえれば幸いです. DOM 要素の絶値座標を取得する element.scrollTop とかだと親からの相対値になっちゃいます. getBoundingClientRect() を使えば絶対座標を取得できます. window.onload = function() { var element = document.getElementById('hoge'); /... 続きを読む