タグ

javascriptに関するngzmのブックマーク (92)

  • 「Gruntで始めるWeb開発爆速自動化入門」関連の最新 ニュース・レビュー・解説 記事 まとめ - ITmedia Keywords

    JavaScriptメインでWeb開発を行う際にさまざまな作業を自動化して開発効率を爆発的に高めるツール(Grunt、Yeoman、Bowerなど)やエディター、IDE、実行環境などを紹介していく連載。 gulp.jsで始めるWeb開発爆速自動化入門: 便利なGruntの弱点を補うgulp.jsのインストールと使い方 タスク自動化のためのビルドツールgulpの概要と、Gruntとの違い、セットアップ方法や基的な使い方、よく使用する主なAPI5つなどを紹介します。(2014/8/19) Gruntで始めるWeb開発爆速自動化入門(終): あなたのWeb開発人生を変えるYeoman、Bower、Yoのインストールと使い方 JavaScriptメインでWeb開発を行う際にさまざまな作業を自動化して開発効率を爆発的に高めるツールなどを紹介していく連載。今回は、プロジェクトひな型生成の「Yo」とパ

  • 第11回 JSONP入門 | gihyo.jp

    こんにちは、太田です。今回から、Ajaxと呼ばれるような非同期な通信処理を行うJavaScriptについて解説していきます。今回は特にJSONPについて基礎的な部分を解説します。 JSONとは JSONについては第9回でも少し触れていますが、改めて解説します。 JSON(JavaScript Object Notation)はJavaScriptから生まれたデータ記述フォーマットで、真偽値、数値、文字列、null値の組み合わせを持ったハッシュか配列かその両方で構成されます。 JSONはそのシンプルさから多くの言語でネイティブにサポートされており、特にウェブ関連ではポピュラーなデータフォーマットです。 JSONのサンプル(配列) ["aaa", "bbb", "ccc"] JSONのサンプル(ハッシュ) {"aaa":1, "bbb": 2, "ccc": 3} JSONのサンプル(ハッシュ

    第11回 JSONP入門 | gihyo.jp
  • 非エンジニアに贈る「具体例でさらっと学ぶJSON」 | DevelopersIO

    よく訓練されたアップル信者、都元です。「JSONってなんとなくわかるけど、構造を読み取れる自信はないし、ましてや書ける気はまったくしない。」そんな人に贈るエントリーです。残念ながら、「13日の金曜日」や「Why Japanese people!!」しか思い浮かばない人は、想定読者対象外ですのでお引き取りください。逆に、正確な定義が欲しい人はRFC 4627RFC 7159(アップデートされてました)をご確認ください。 「JSON」とは。 JSONとは JavaScript Object Notation の略で、要するに「JavaScriptの中でオブジェクトを記述する書式」のことです。と言われてもなんのことだか分からない人向けの説明なので安心してください。 JSONというのは「データを表現するための記法(≒文法)」です。シンプルなデータであれば、文法など気にせずにただ書けば問題ありません

    非エンジニアに贈る「具体例でさらっと学ぶJSON」 | DevelopersIO
  • 最近の行儀のよい JavaScript の書き方 - Qiita

    JavaScriptは移り変わりの早い言語です。 もう1年以上経っていますし、記事のメンテもちゃんとできていないので、消し線を入れることにしました。 参考程度のために記事は一応残しますが、より新しい情報を読まれることをお勧めいたします。 はじめに --- 最近では JavaScript の実行環境はブラウザに限りません。(node.js, Web Workers) また、旧来のような <script> 経由でのロードもとうに古くなっています。今は CommonJS スタイルで、require を用いたモジュールのロードを行なうことがより良いとされています。 ですから、次のようなことは改める必要があります。 - var YourModule = {}; などとして、外部から YourModule.hoge(); などと呼び出す書き方 - this === window だと思うこと 今回は、

    最近の行儀のよい JavaScript の書き方 - Qiita
  • とほほのAngularJS入門 - とほほのWWW入門

    AngularJS と Angular は別物です。バージョン 1.x を AngularJS、2.0 以降を Angular と呼びますが、根から作り直しているので互換性はありません。AngularJS は 1.8.x で開発を停止しており、2021年12月31日にサポートも停止されました。現在は拡張LTS (XLTS) のフェーズにはいっています。(2022/1/2追記) AngularJS は、下記の様な特徴を持つ JavaScript フレームワークのひとつです。 Google社とコミュニティが開発するJavaScriptフレームワーク ライセンスはMIT License。オープンソース。商用利用可能。 今現在(2015年8月15日)の最新版は 1.4.4。 JavaScriptでクライアントサイドのMVC(Model-View-Controller)モデルを実現します。 これま

  • JavaScript書くときに便利なVimプラギン集 - Life goes on

    この記事はVim Advent Calendar 2012の52日目の記事です。 前回の記事はasion_mさんのフロントエンジニアがちょっと幸せになるかもしれないプラグイン作ってます。でした。 良い具合に、フロントエンドのお話続きになっており「流れがキタ!」などと浮かれていたところ、はてなブログが0時から8時まで長時間のメンテに入っており泣きたい気分で一杯になっています。 気を取り直して、エントリを書いていきたいと思います。 さて、自分は一応JavaScriptを書くことで(または書かない事で)オマンマをべさせていただいてる訳ですが、そういえばあんまりJavaScript書く環境についてブログに書いてないなーと思い、自分が使ってるJavaScript関連のプラギンと設定なんかを紹介していこうと思います。 もちろん、「これは常識でしょpgr」などというものが多数含まれていることは予想され

    JavaScript書くときに便利なVimプラギン集 - Life goes on
  • AngularJS 1.2 日本語リファレンス | js STUDIO

    AngularJS 1.2 API ガイド TIPS ngモジュール ディレクティブ フィルター サービス 型 グローバルAPI ngMockモジュール サービス グローバルAPI AUTOモジュール サービス ngAnimateモジュール サービス ngCookiesモジュール サービス ngMockE2Eモジュール サービス ngResourceモジュール サービス ngRouteモジュール サービス ディレクティブ ngSanitizeモジュール フィルター サービス ngTouchモジュール ディレクティブ サービス このサイトについて AngularJSの日語リファレンスです。 AngularJSの家サイト(英文) の内容を翻訳して作成していますが、誤訳や誤記があると思いますのでその点についてはご了承ください。 もし、誤訳などの間違いを見つけましたら、 @tomof まで教え

  • AngularJS ― Superheroic JavaScript MVC Framework

    AngularJS support has officially ended as of January 2022. See what ending support means and read the end of life announcement. Visit angular.io for the actively supported Angular. Why AngularJS? HTML is great for declaring static documents, but it falters when we try to use it for declaring dynamic views in web-applications. AngularJS lets you extend HTML vocabulary for your application. The resu

  • EmacsでJavaScriptを書くときのおすすめメジャーモード - Boost Your Programming!

    JavaScriptのメジャーモードについて Emacs23.2からJavaScriptのメジャーモードが変更され(js-mode)、以前とは比べ物にならない程使い勝手がよくなりました。 しかし、js-modeではリアルタイムでのエラーチェックが行われないためもの足りないと感じます。 js2-modeは人気のメジャーモードで、リアルタイムでチェックを行なってくれるのですが、 インデント周りで不具合があるようでespresso.elと組み合わせるのが主流のようです。 基的にはこちらを参考に設定するだけで良いのですが、設定項目がごちゃごちゃしていてあまりよろしくないです。 そこでid:moozさんがjs2-modeにパッチを当てたものを使用します。 これは特に細かい設定をする必要無く使うことができます。 また、ハイライト機能もこちらの方が良いです。 インストール方法 js2-mode.elを

    EmacsでJavaScriptを書くときのおすすめメジャーモード - Boost Your Programming!
  • rails3 + html5 canvasでお絵かき投稿サイトを作ろう!

    はじめましてこんにちは。 KRAYアルバイトの浅海です。 html5のcanvasを使ってお絵かき投稿サイトを作ってみようと思います。 初めてブログ記事を書くということで気合が入りました。 ちょっと長めですがお付き合い下さい。 機能 お絵かき投稿サイトの必要最低限な機能って? ざっと下のような機能を入れてみます。 絵を描ける 絵を消せる 描画を一回分戻れる 線の太さを変えられる 線の色を変える 絵を投稿できる 投稿された画像の一覧を表示できる → 完成見はこちら完成見の公開は終了致しました。 絵を描ける HTML5のcanvasにマウスの軌道に線を引いていくわけです。 canvasでのマウス軌道の描き方は、 ・mousemoveイベント発生時に点をプロット という手段が真っ先に思い浮かぶと思いますが、これは、以下の様になります。 これではお話になりません。 なので、点ではなく線を引くこ

    rails3 + html5 canvasでお絵かき投稿サイトを作ろう!
  • ASCII.jp:HTML5のCanvasで作る、Flash不要のお絵かきツール|古籏一浩のJavaScriptラボ

    HTML5 Canvasで作った「シンプルペイント」。ペンの色とサイズが選べ、保存もできる。画像クリックでサンプルページを表示します(Firefox 3/Opera 10/Safari 4で表示可能) HTML5の新機能で特に注目を集めているのが、Flashなどのプラグインを使わずにWebブラウザー上でグラフィックを描画できる「Canvas」です。Canvasは、すでにInternet Explorer(IE)をのぞく、ほとんどのブラウザーに実装されていますし、マイクロソフトは現在開発を進めている「IE9」でHTML5を積極的にサポートするとしていますから、IE9にCanvasが実装される可能性は高そうです(ただし、現在公開されているPlatform Preview版ではCanvasは実装されていません)。すべての主要ブラウザーでCanvasが利用できるようになれば、画像処理を伴うWebア

    ASCII.jp:HTML5のCanvasで作る、Flash不要のお絵かきツール|古籏一浩のJavaScriptラボ
    ngzm
    ngzm 2015/09/16
    お絵かき
  • canvas要素 + Javascriptで作る、動的コンテンツ

    HTML 5 + Javascriptで作る動的なコンテンツ 前回の授業では、HTML 5について、その成り立ちや特徴を解説した上で、新しい構造化のための要素について解説しました。また、あわせてCSS3によって格段に進歩した表現力について実際にサンプルページを作りながら解説しました。 今までは、Webページで動的に図や画像やアニメーションを描画するにはFlashが代表的な選択肢でした。しかし、ここ数年でその状況が大きく動きつつあります。Flashに代表されるような動的なコンテンツが、専用のプラグイン無しに、HTMLの要素とそれと連携するスクリプトだけで実現できるようになりつつあるのです。こうした技術は、今後のWebの動向を大きく変える可能性を秘めた技術として脚光を浴びています。 HTML 5で動的に画像やアニメーションを生成するためには、canvas要素という新規に導入された要素と、can

    canvas要素 + Javascriptで作る、動的コンテンツ