You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
No dependencies, fast and small 10KB JavaScript and 2.5KB CSS, that's all (minified, gzipped). User-friendly Navigate using keyboard or mouse. Easily change the themes for your website. Browser compatibility Works on Google Chrome, Mozilla Firefox, Opera, Safari and even Internet Explorer. Why using Intro.js? When new users visit your website or product you should demonstrate your product features
概要 読み込みが極端に遅い。 でもwebサーバやdbのloadなどチェックしても怪しいところがない。 なんだろうと思っていたらGoogleCDN設置のjQueryにアクセスできなくなっていた。 CDNもあくまで外部管理なので、リスクヘッジはしておくべき、と。 という訳でその方法が以下。 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script>window.jQuery || document.write('<script src="js/libs/jquery-1.10.2.min.js"><\/script>')</script> もしCDNにアクセスできなければ、ローカルのリソースを読む。 ※ window.jQueryは、 ・jQueryがロードされていれば
写真は @summerwind さんからです!ありがとうございました。 僕が最初に参加した学園祭から3年、まさか開催する側に立つとは3年前の僕は思いもしなかった。すごく楽しかった!! 東京Node学園祭 2013にスタッフ兼スピーカーとして参加しました。 - from scratch 東京Node学園祭 2012に行ってきました。 - from scratch 東京Node学園祭に行って来ました。 - from scratch ちなみに今回は2011年にも来たGuillermo Rauch、2012年にも来たMikeal Rogersに加えて新しくStrong Loopの元CEOであるIssac RothとNodeSchoolの主催者であるMaxwell Ogdenの4人を呼んで開催しました。自分で言うのもなんですが、ハンズオンあり、基調講演ありで非常に有意義なカンファレンスだったと思って
Reactive MVC and the Virtual DOM — Futurice のメモ。 Model-View-Intent and the Virtual DOM の記事版という感じ React/Fluxは最近話題になってる React/FluxはリアクティブプログラミングであるがAPIが少し違う Reactはリアクティブとインタラクティブなパターンを混ぜた感じ ゼルダのように昼と夜で同じマップだけど違う世界のように2重となるようなケースを考える The dual of Interactive is Reactive 普通のインラクティブの場合は、Xをに影響を与えるものを探す場合、他のモジュールでX.update()を探す必要がある しかし、リアクティブパターンの場合はXの中を探せば良くなる どうやってリアクティブパターンを実装するか? event emittersの導入 Xから
最近SVGにハマっている。ふとした思いつきで、SVGのcircle要素と物理エンジンをマッピングできたら、簡単にパーティクルが作れるのでは、と思ったのでやってみる。 PhysicsJS + Snap.svg(雑な描画マッピング) PhysicsJS + Snap.svg + 自力の差分管理 PhysicsJS + React 作るのは非常に雑な、こういうやつだ クリックしたらcircle要素が出現する 物理エンジンによって座標計算されて右方向に飛んで行く 50px 右に移動したら消える 物理エンジン的に面白い挙動とかはあとで考えることにする。 物理エンジンの世界を作る 今回はPhysicsJSを使うことにした。box2dはC++由来のAPIが古臭いし使いたくない。matter.js と PhysicsJSがメンテされててモダンな雰囲気がして試してみたのだけど、matter.jsは何かとおせ
Quick Start Add this line to your application’s Gemfile: gem "chartkick" Then follow the instructions for your JavaScript setup: Importmap (Rails 7+ default) Bun, esbuild, rollup.js, or Webpack Sprockets This sets up Chartkick with Chart.js. For other charting libraries and frameworks, see these instructions. Importmap In config/importmap.rb, add: pin "chartkick", to: "chartkick.js" pin "Chart.bun
Stay Relevant and Grow Your Career in TechPremium ResultsPublish articles on SitePointDaily curated jobsLearning PathsDiscounts to dev toolsStart Free Trial7 Day Free Trial. Cancel Anytime. It’s practically impossible to imagine any dashboard without graphs and charts. They present complex statistics quickly and effectively. Additionally, a good graph also enhances the overall design of your websi
はじめに この話はGuillermo Rauch氏が書いたhttp://rauchg.com/2014/7-principles-of-rich-web-applications/ という記事の翻訳です。許可を得て翻訳しています。 ここ最近Web業界を賑わしているSingle Page Applicationの必要性、HTTP2/SPDYといった技術、リアクティブプログラミングやIsomorphicデザインという考え方について包括的にまとめたすごく良い記事になっております。 最初に断っておきますが、ものすごく長いです。各セクションがわかれているので時間がない方はセクションごとに書かれたtl;DRとまとめを読むだけでも参考になるかと思います。 ちなみに明日のNode学園祭には、本記事を記述したGuillermo Rauch氏が見えるので、そこで詳しく聞いてみるのもいいのではないでしょうか。
※この記事は社内勉強会向けの資料の下書きです。書きなぐりの下書きで見直すと最後の方の文書がヤバいので、いつか書き直します。読み辛い所は申し訳ないです。 概要 TDD テスト自動化とTDDを整理 TDDとBDDの違い Test Framework in javascript QUnit/jasmine/mochaについて、違いやメリデメを知る mocha 基本的な書き方 アサーションライブラリのメリデメを整理する chai 記述形式の違い整理 基本文法 sinonjs spy stubs mock TDD Test Driven Development テスト駆動開発 by ケントベック 特徴 xUnit系/BDD系のテストフレームワーク使う テストするコードも実装 テストファースト 実装の後にテストするのではなく、テストを先に書いて実装する サイクル Red(失敗) => Green(通過
人間長い間生きていると、一度くらい夜中にヒンディー語の入ったファイルを修正する必要がでてきます。 手持ち(Windows)のサクラエディタや、vimでは残念ながらインドの偉大な英知を表示してくれはしませんでした。 ここでは、夜中にヒンディー語を修正するはめになり、かつ、グーグル先生に聞いてクールな多言語対応のエディタを探してインストールする余裕もないときに、どう対応すべきかを記述します。 ここでは、ブラウザー経由でヒンディー語の入ったファイルを修正してファイルに保存するようにします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xm
こんにちは!ChatWork CTOの山本です。 チャットワークのバックエンドをPHPからScalaへの切り替えることを決断し、現在は移行に向けての大プロジェクトが進行中です。 バックエンドはScalaにしていく。じゃあフロントエンドはどうするの?ということで、今回はチャットワークのフロントエンド開発における今後の戦略を書いてみようかと思います。 現在のフロントエンドにおける課題現在のJavaScriptコード量は、ざっと5万行ほどになっています。(OSSライブラリ、言語キーなどを除く。たぶん大規模・・ですよね?) 約5年前の開発スタート時より、素のJavaScriptとjQueryをベースにゴリゴリと書き重ねられ、これぐらいのコード規模になったソースコードはご想像通りメンテナンスコストがかなり高くなってしまっています。。。 バックエンドの刷新に伴い内部APIも一新されるため、どうせ大幅に
Concept 『Web Components with Virtual DOM』 ahomu/Claylump Motivation Web Components ラッパーを書いてみたいなーと思った React の JSX がイマイチ気にくわない(JSとHTMLを一緒にするなオジサン) <template> に書いた内容を Virtual DOM 生成器に変換すればいいんじゃね というような所から人様のライブラリを借りてツギハギして習作してみた次第。借りてきたライブラリ(HTML String パーサと Virtual DOM)は独自実装しても楽しそうなので、やる気があればやる。 もちろん実験品なので、実用には耐えない Files claylump.polyfill.js(webcomponents.js + window.fetch + es6promise) claylump.run
Google Chromeで(URLのみ指定で)window.open()を実行したとき、別タブで開く場合と、別ウィンドウが開く場合がある。 バージョン 33.0.1750.154 mで確認 サンプル Google Chrome: window.open() の動作の違い 条件 試してみて分かったことは、 jQuery.get() 等の、XMLHttpRequest を使用していると思われる処理の、(onreadystatechange経由でコールされた)コールバック関数内で window.open() を呼び出すと、別ウィンドウで開いてしまう らしいということ。 コールバック関数内でも別ウィンドウでは開きたくない場合 jQuery.get() 等を呼び出す前に、予め window.open('about:blank') をコールしておき、返された子ウィンドウの window オブジェクト
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く