はじめに ネットには様々な情報が溢れており、JavaScriptに関する情報も多数存在しております。 その中には、「今時こんな書き方しねえよ…」と思わずツッコミを入れたくなるような、本当に、本当に古い内容について書かれている古文書も存在します。 そんな罠記事の情報に囚われてしまって、いつまで経っても現代的なJavaScriptが書けない皆さんのために、このシリーズの記事では、各セクション毎に分けて、旧石器時代の記述と、現代の記述を紹介する形で、文明開化をしていきたいという思いで記述する。 最初は、現在比較的メジャーなブラウザで一通り動作する「ECMAScript 5」までの内容に関してポエムを書き連ねていき、最終的には一連の内容を読むだけで「ES6(ES2015)」による新機能や、絶賛提案中の「ES7」の一部提案内容についても把握し、おおよそ現代人を育成することを目標とする。 …なんてめっ
その名もズバリ「OS.js」というJavaScriptライブラリです。 誰かのイタズラかと思いきや、使ってみるとブラウザの中にもう1つ別のパソコンが起動しているような感覚になり、その完成度の高さに驚かされます。 APIも提供されており、「OS.js」で起動したデスクトップ環境用のアプリケーションを自分で開発することも可能になっているのは面白い点でしょう。
Post author:sider Post category:Engineering / Other Reading time:3 mins read Post published:2016-01-13 エンジニア x ニッチ(特化)なサービスを調査、「これは流行りそう…!」と思ったサービスを10個ご紹介。 誰もが知っていそうなサービスは含んでません。「俺はエンジニア向けサービス詳しいぜ！」という方も安心して御覧ください。 CI(継続的インテグレーション) DEPLOYBOT デプロイのためだけのCIサービス。デプロイに特化。 リリースノートページやリリースの度にリリース内容をメモする事が出来る機能、デプロイのトリガーを手動で実行することが出来る「デプロイ」ボタン機能などがある。 1リポジトリの「Hobby」ユースであれば永年無料。 deploybot.com Codecov コードのテ
目次 1. はじめに 2. Promiseの概念を理解する 幕間：行列が嫌いな女の子 2.1 Promiseとは何か？ 幕間：実行順序 2.2 Promiseと並行処理 幕間：式の抽象化 3. Promiseのからくりを理解する 3.1. Promiseで式を順序付けする 3.2. 最小限のPromise実行 4.Promiseとエラー処理 幕間：計算失敗の場合 4.1. エラーをPromiseで処理する 4.2. Promiseの失敗の伝播 5. Promiseの結合 5.1. Promiseを確定的に結合する 5.2. Promiseを非確定的に結合する 6. Promiseの実用的な理解 6.1. ECMAScript Promiseの導入 6.2. .then の分析 7. Promiseとは相性が悪いケースとは？ 8. まとめ 参考文献 追加資料 資料とライブラリ 1. はじめに
Qiita:Teamに投げた社内ドキュメントだったけど、特に問題ないのでQiitaにも投げる。 前提として browserify-rails とbabelify が導入されている状況を想定してる。 基本方針 新規コードはES2015で書く 本番はbrowserify(-rails)でコンパイルする。 単体テストは node 環境下で走らせる テスト環境下では jsdom で window, document をモックする 単体テストでは ブラウザ特有の挙動はテストしない 裏側の環境(browserifyやspec-helper)は難しくして良いが、利用者からみえる範囲は複雑にしない(npm install; npm testで走る) Universal JavaScript に寄せることでコードのポータビリティを上げる 事前準備 browserify-railsを導入する。 .babelr
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました JavaScriptが他のプラットフォームを侵略しています。Node.jsによってサーバサイドを侵略し、React NativeやTitaniumがスマートフォンアプリ開発を攻めています。 他の言語はそのままで良いわけではありません。逆にJavaScriptを攻めるのです。今回はGroovyのコードをJavaScriptに変換できるGrooscriptを紹介します。 Grooscriptの使い方 Grooscriptの例です。クラスも使えます。さらにメソッドがない場合の呼び出しもできたりします。これはGroovyとして実行できるコードです。 class Hello { def methodMissing(String name, args) { println "Hello ${n
RawGitは、2019年10月に、サービスを終了するとのことです。 https://rawgit.com/ RawGit is now in a sunset phase and will soon shut down. It's been a fun five years, but all things must end. GitHub repositories that served content through RawGit within the last month will continue to be served until at least October of 2019. URLs for other repositories are no longer being served. If you're currently using RawGit, please st
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました JavaScriptの活用範囲が広がるのに合わせてJavaScriptをはじめなければと思っている方が増えています。しかしその書き方や特徴がどうも馴染まないと苦労していることでしょう。 そこでJavaエンジニアの方に試してみて欲しいのがJSweetです。Javaで書いてJavaScriptにコンパイルするプログラミング言語です。 JSweetの使い方 構文の例。左側はまさにJavaっぽい感じですね。 DOMはjsweet.domといった感じのオブジェクトが用意されています。 フォーカスの外れた時に入力チェックといった仕組みも作れます。 デモで用意されているブロック崩し。今までにやったことがないくらいきついゲームだったのでぜひ試して欲しいです。こちらはCanvasを使っています。 J
FirefoxではPDFビューワーをJavaScriptで実装しています。それがPDF.jsです。PDFは公開されているフォーマットではありますが、解析して表示するのはとても大変なものだと想定されます。 そんなPDF.jsを活用してスライドビューワーにするのがpdf.js-controllerです。PDFプレゼンを行うのに向いていそうです。 pdf.js-controllerの使い方 実行しているところです。ちょっと余計な文字が下に出てしまっています。 矢印キーを使ったスライド移動にも対応しています。 ツリービューのような複雑な表示にも対応しています。 PDF、さらにJavaScriptとは思えない表示ですね。 PDFはビジネスの場では数多く使われています。編集が容易ではないことがメリットですが、その結果として再利用性が悪いのが欠点でした。pdf.js-controllerを参考にすればP
Angular 2 の特徴を美味しいところだけ凝縮してお届けします
この記事はシステムエンジニア Advent Calendar 2015 - Qiitaの記事です。 弊社アーキ部で@kawasimaさんに教えてもらったさいきょうの二重サブミット対策について書いていきます！ 二重サブミットが発生するケース 不正な更新リクエストが発生するケースとして、以下のものが考えられます。 サブミットボタンをダブルクリックする 戻るボタンで戻って、再度保存ボタンを押す 完了ページでブラウザリロードする CSRF攻撃による不正な更新リクエスト 1. サブミットボタンをダブルクリックする 確定ボタンをダブルクリックすることによって、ユーザが意図していないリクエストが発生してしまうケース。 2. 戻るボタンで戻って、再度保存ボタンを押す 処理完了画面から戻るボタンで前の画面に遷移し、再び確定ボタンを押すケース。 本来は入力➡︎確認➡︎完了の画面遷移が適切だが、その画面遷移にな
Node.jsはシングルスレッド、ノンブロッキングI/O、イベントループなどの特徴があり、「向いていること」と「向いていないこと」があると思います。 言語選定の際に使えるメモとして、Node.jsの構築事例も加えてまとめてみました。 ##Node.jsに「向いていること」 処理が短時間でイベント処理が重要なアプリ 例えば、チャットアプリなどの大量のアクセスのあるリアルタイムなネットワークプログラミングが得意 シングルCPUのサーバー シングルCPUの環境化でもその性能を十分使い切れるため、比較的性能の小さいサーバ上で大きなパフォーマンスを発揮できる ##Node.jsに「向いていないこと」 CPU負荷の高い処理 CPUリソースを大量に必要とするJavaScriptの処理を行うとイベントループが回らない状態になり、イベントハンドリングが行えない状態に陥る。このため、CPU処理が大量に必要とさ
はじめまして、アニメイトラボのフロントエンドエンジニア id:koharusugiura です。 フロントエンドエンジニアとして働いていると、いかにサーバーサイドに負担を掛けずに処理を行うかについて考えることも多いと思います。 そこで今回は、サーバーに画像の転送を行う前にクライアント側で画像加工をする話について書きます。 この記事は animateLAB Advent Calendar 2015 15 日目の記事です。 qiita.com JavaScript で画像処理を行う ウェブアプリケーションで画像ファイルの加工が要件にある場合、サーバー側で画像加工を処理するケースが大半だと思います。 しかし、データ通信のことを考えると、最適な考え方とは言えない気がしています。 近年、日本のインターネット回線の速度は大きく向上しているとはいえ、モバイルデータ回線はまだまだ速度的に完璧とは言えません
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 背景 僕が本格的にWebのエンジニアになったのは2014年頃からで、早いものでもう丸2年ほど経ってしまうことになります。 Webに転向してからは主にフロントエンドエンジニアとして勤務してきました。 よく言われることですが、最近のフロントエンドの趨勢は本当に早いです。 最初はキャッチアップに苦労したことを覚えています。 しかし段々と新しい何かを覚えることは苦でなくなり、今はこの流れに身を置くことが楽しいと思えるようになってきました。 激動の趨勢の中で、Webのフロントエンドエンジニアが口にするパラダイムは日ごとに変化しています。 この記事
はじめに Node.js と連携することで、昔は大変だったフロントエンドのテストがとても便利になってます。 という内容です。 はじめに QUnit があった JS のテスト手段として、自分の観測範囲で最も古い（4, 5年前に知った）ものが QUnit でした。 このテスティングフレームワークは、例えばこのように使用します： <html> <head> <link rel="stylesheet" href="//code.jquery.com/qunit/qunit-1.20.0.css"> <script src="//code.jquery.com/qunit/qunit-1.20.0.js"></script> <script src="foo.js"></script> <script src="bar.js"></script> <script src="tests.js"></
この記事でWeb開発の未来を垣間見ることができるでしょう。UIの構築やサーバ、データ・エンドポイントの新しい見解を得ることができると思います。ここで、ブラウザとサーバコードの両側を含めたフルスタックな話をしていきます。これを読めば、 完全に機能するGitHubリポジトリ で紹介されたすべてのコードの検証や実行ができるようになります。皆さまが開発者として次の資質を持っていることを前提に話を進めていきます。 JavaScript中級者 HTML中級者 クライアント/サーバ間通信の基礎知識 JSONの基礎知識 Node.jsの基礎知識 上の知識がなくても、 おそらく この記事の進行についていけるでしょう。しかし、知識がないと私の紹介するコードを現実的なシナリオあるいは重要なシナリオに応用するのは難しいでしょう。インターネットは情報の宝庫なので、理解に必要な概念などをたくさん提供してくれます。必要
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。情報システム本部の伊藤(@koh110)です。 社内システムの開発、運用を担当しています。 今回、担当しているシステムをNode.js LTS(v4.x)へバージョンアップしました。 それに伴い実施したES6対応の中から3つの事例を紹介したいと思います。 varを撲滅しよう arrow functionを使おう callbackを撲滅しよう varを撲滅しよう varをlet, constに置き換えます。基本はconstに置き換えます。 メリットは以下の点で、コードの品質向上につながると思います。 プログラム中で変更不可である事を明示的に示せる。 誤った使い方をした時にバグとして検出される。 varを利用するとブロック
一昔前にCanvasが実用段階になった頃、JSのゲームエンジンが大量に出てきたことがありました。それらは大抵DOM/CanvasのFallbackを持っていたのですが、今現在の状況は、実際には非効率なメモリ消費やモバイルのブラウザのフラグメント化で実用に足るものがなかった、という辛い現状があります。 そんな中pixi.jsという描画ライブラリが台頭してきました。このエンジンは webglとcanvasの fallbackを持ち、(いくらかのバグはありつつも)DOMを切ったことで現実的なパフォーマンスの課題をクリアできるのでは？という期待感が高まっています。 Pixi.js - 2D webGL renderer with canvas fallback http://www.pixijs.com/ そして 2015年、RPGツクールMVが発表され、ブラウザ吐き出し対応がアナウンスされました
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
