イラっとしない超ミニマルなフォームバリデーションを素のJSで実装しよう 2017/08/17 James Edwards 74 フォーム送信前のバリデーション(検証)は欠かせませんが、あまりリッチな機能ではかえって使いにくくなることもあります。なるべくブラウザーの機能を使って、シンプルなバリデーション機能を実装する方法を解説します。 HTML5ではブラウザーベースのフォームバリデーションを実装するために、新しい属性がいくつか導入されました。たとえばpattern属性はtextarea要素やinputに対して有効な入力値を正… Loading...
ReactとFeathersを使ってモダンでCRUDなWebアプリを作る方法 2017/08/16 Michael Wanyoike 82 リアルタイムなAPIを作れるフレームワークFeathersとReactを使って、CRUDなWebアプリを開発する基礎を解説します。 モダンなプロジェクトでは、コードの再利用性を高めるため、フロントエンドとバックエンドでロジックを分けてコードを書くことが求められます。具体的な再利用の用途は、バックエンドAPIにアクセスするネイティブモバイルアプリを作る場合や、モジュール方式の大規模プラットホームにお… Loading...
NoSQLじゃなくてMySQLを使いたい!Node.jsのmysqlモジュールの使い方 2017/08/15 Jay Raj 65 JavaScriptでデータベースといえば非SQLだと思っていませんか? Node.jsのmysqlモジュールでMySQLを使う方法を解説します。 Node.jsアプリのバックエンドに適しているからか、非SQLのデータベースが話題ですが、流行っていて格好良いという理由だけで次のプロジェクトに採用するわけにはいきません。プロジェクトで要求されることに基づいてデータベース型を選ぶべきです。プロジェクト… Loading...
CanJSで初めて作る!GitHub連携のリアルタイムなToDoアプリ 2017/08/14 Chasen Le Hara 46 動きの早いJavaScriptフレームワークの世界で、長い歴史と実績を持つCanJSを知っていますか? その魅力を解説しながら、簡単なWebアプリを作成するチュートリアルをお届けします。夏休みの課題にどうぞ。 CanJSは、長期にわたってメンテナブルなWebアプリの作成に役立つ、革新的なフロントエンドライブラリーです。何十個もの独立したパッケージがあり、必要なライブラリーを選択できるため、100k… Loading...
Nodeベースの次世代CMS「KeystoneJS」はWordPressの代わりになるか? 2017/08/10 James Kolce 342 CMSの定番といえばWordPressですが、開発者にとってより柔軟で使いやすいCMSを探しているなら、Node.jsベースのKeystoneJSがおすすめです。KeystoneJSの特徴と使い方、WordPressとの比較をまとめました。 KeystoneJSはコンテンツ管理システム(CMS)で、データーベースと連動するサーバーアプリケーションを構築するためのフレームワークです。Node.jsの… Loading...
手間のかかるSPAのソーシャルログインをPassport.jsで手軽に実装する方法 2017/08/10 Graham Cox 87 従来のWebアプリケーションなら簡単なGoogleやFacebookのソーシャルログインも、シングルページアプリケーションに実装するのは意外と大変。実装に戸惑った方へ、ちょっとしたコツを教えます。 シングルページアーキテクチャーを使って開発されたWebアプリケーションを目にすることが多くなりました。このアーキテクチャーでは、アプリケーション全体がJavaScriptとしてブラウザーに読み込まれ、サ… Loading...
面倒なJavaScriptの日付の処理は「date-fns」でラクに片付けよう 2017/08/09 Edwin Reynoso 81 単純そうに思えることでも意外と面倒なのがJavaScriptでの日付の処理です。素のJavaScriptよりも使いやすくラクに処理できるコンパクトなライブラリー「date-fns」を紹介します。 JavaScriptで日付を扱うと、素のDateメソッドは冗長な記述になり、整合せず、バグが発生しがちです。そこで日付操作に適したライブラリーが役立ちます。ライブラリーとJavaScriptのDateとの… Loading...
きれいで読みやすいJavaScriptを書く デコレーターの基本を先取り 2017/08/04 Graham Cox 194 わかりやすく見通しのいいコードが書ける、デコレーターの基本と使い方を解説します。 ES2015の登場とトランスパイラーの普及により、コードや記事の中で言語の新機能を見かけることが増えました。とりわけ難しい新機能がJavaScriptのデコレーターです。 デコレーターはAngular2に採用されたことで人気が高まりました。デコレーターは現時点ではAngularではTypeScriptで使うことができ… Loading...
SeleniumによるNodeアプリの機能テストとデバッグのコツ 2017/07/28 Mike Cantelon 45 Seleniumを使ったNodeアプリの機能テストの手順を解説しながら、テスト失敗時のデバッグを効率よく進めるヒントも紹介します。 Nodeアプリケーションの機能テスト Web開発プロジェクトで機能のテストをするには、起こり得るユーザーの操作リストを基にブラウザーでDOMの遷移をチェックします。仮にコンテンツマネジメントシステム(CMS)を作っているとして、画像ライブラリーのアップロード機能をテス… Loading...
JavaScript疲れに効く! codemodとJSCodeshiftでリファクタリングが捗る 2017/07/21 Chris Laughlin 73 開発者なら誰しもJavaScriptをはじめとするコードのメンテナンスが面倒だと感じています。日々変更される標準や構文、サードパーティのパッケージ変更に付いていくのも大変です。 近年、JavaScriptを取り巻く状況は一変しています。JavaScript言語のコアは進化し続けて、基本中の基本である変数宣言の方法さえ変更されているのです。ES6では、letやconst、アロー関数などの変更がコアに… Loading...