GitHub - ragingwind/generator-chrome-extension: Scaffold out a Chrome extensionYou 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
テストがないJS環境にモダンなテスト環境を導入していく - Qiita
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
JavaScriptでさまざまなソートアルゴリズム | 110chang.com
ソートアルゴリズムの視覚化って面白いですよね。 見るたびに一度書いてみたいと思っていました。 15のソートアルゴリズムを可視化した動画が気持ち(・∀・)ｲｲ!! （自分で書いてから改めて動画を見ると、なるほど感慨深いものがあります） ダンスで覚えるソートアルゴリズム いきなり視覚化は難しそうですし、まずは書くだけ書いてみよう、ということで。主に他言語での実装を参考にして書いてみました。というか可能なものはロジックそのまま移植しています。再帰は苦手です。 実行できるサンプル 入力欄に数値を入れて実行すると、入力値を最大としてかぶりのない整数をランダムに並べた配列を作成し（10000と入力すれば0〜10000をシャッフルした配列を生成）、ソートを行います。それぞれのアルゴリズムで、実行時間の計測（単位はミリ秒[ms]）と確認のためArray#sortの実行結果との照合を行い、「黒い画面」風に表
Javascriptで新しいウィンドウを開く – Webデザインラボ
こんにちは（・∀・） Lightbox系のプラグインが使われるようになってきてJavascriptを使って新しくウィンドウを開くという動作はあまり使われなくなってきましたが、最近使う機会があり少し修正したので再掲します。 Javascriptを使用したサンプルをご紹介します。 今回は新しいウィンドウを開くサンプルです。 Javascriptを使えば新しくウィンドウを開く際の細かな指定ができます。ウィンドウの位置、サイズ、ツールバー・メニューバー等の表示非表示、サイズ変更の可不可等々。デザインに合わせて設定する事ができます。 対応ブラウザ IE Firefox Opera Chrome Safari ウィンドウの位置 Topから50px、Leftから50pxの位置に表示。 left=50 top=50 ウィンドウのサイズ width=550 height=550 ツールバーやメニュー
Qiitaのストックとはてなブックマークの追加を同時に実行するChromeエクステンション - Qiita
Qiitaにストックするか、はてなブックマークに追加するか迷ったあげく、どっちにも保存するという、面倒なことをすることがあったりするので、この作業めいたことを簡略化するため、Chromeのエクステンションを書いてみました。↓ Github:high5/qbta このエクステンションは, Qiitaのストックボタンを押すと、はてなのブックマークレットをたちあげ、Qiitaの対象の投稿記事についたタグをはてぶコメント欄にタグとして挿入して、追加ボタンをクリックするというのを自動的にやってくれます。はてブのほうの追加ボタンが自動でクリックされるかはオプションで選択できるようになってます。Qiitaのタグの他にコメントを残したいような人はこのオプションをオフにしてください。
javascript - で bilateral filter (選択的ガウスぼかし)を実装してみた : 404 Blog Not Found
2012年09月06日18:03 カテゴリアルゴリズム百選Math javascript - で bilateral filter (選択的ガウスぼかし)を実装してみた HTML5 Canvas Steve Fulton / Steve Fulton / 安藤 慶一訳 [原著:HTML5 Canvas] 「選択的ガウスぼかし」がえらい気に入ったので、アルゴリズムの学習も兼ねてJavaScriptでやってみたら思いの他使い物になりそうということで。 Demo: File APIを実装しているブラウザーで動きます。IEの方ごめんなさい。IEだと10以降になります。小さめのファイルを読み込ませて下さい。1024*1024ピクセルを一応の上限に設定してあります。(追記2021.11.29:上限を16Mピクセルまで上げました。その他CSS周り修正) Info: Source: Radius: Thr
Webエンジニアに知ってほしいSwiftのスゴいところ5選 - Qiita
macOSやiOS、watchOSといったApple製OSは、Swiftという言語で開発できます。Swiftは他言語の長所を取り入れた新しい言語であり、普段JavaScript等のWeb開発言語を扱っている方ならば、比較的学びやすいものとなっています。今回は、ActionScriptやJavaScript(TypeScript)といったWeb開発用言語と比べて、Swiftの便利な点を紹介していきます。 以下、JS=JavaScript(TypeScript)、AS3=ActionScript 3.0と表記します。 ここがスゴイよSwift言語 1. switch文のbreak宣言が不要 バグの原因を追っていくと、switch文のbreakを一つだけ忘れ、予期せぬ分岐に入っているのを見かけたことがよくあります。Swiftの場合はそんな心配はありません。case節にはbreakは必須ではないの
FluxのActionとStoreをちゃんと分ける話 - pixiv inside [archive]
ピクシブ株式会社 Advent Calendar 2015、19日目の記事です。 qiita.com こんにちは、愛らしくも憎らしいJavaScriptを書いてご飯を食べている @geta6 です。業務では pixiv Sketch というサービスの開発や運営に携わっています。 pixiv Sketchでは、node.jsとReact/Fluxibleを使用してサーバーとクライアントを同じコードベースで動作させるIsomorphicな構成を採用しています。 このプロジェクトでコードレビューをしていて、チームメンバーがつまずきやすいと感じたのが『FluxにおけるActionとStoreのどちらに何を実装するべきか』という点でした。 そこで、本日は『ActionとStoreとの適切な責務の持たせ方』について話をしたいと思います。 ReactとFluxについておさらい 今年の4月にこんなスライド
![FluxのActionとStoreをちゃんと分ける話 - pixiv inside [archive]](https://cdn-ak-scissors.b.st-hatena.com/image/square/f0dc903a09dd0db9542d08d176be2911190b205f/height=288;version=1;width=512/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2Ff5b365d4045ffa2adfb0f013c105cc50076def6d%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttp%253A%252F%252Fcdn-ak.f.st-hatena.com%252Fimages%252Ffotolife%252Fg%252Fgeta6%252F20151218%252F20151218175826.png)
意外と知らない？ JavaScript トレンド 2015 - Gaiax Engineers' Blog
Gaiax Advent Calendar 2015 18日目担当の @hoto17296 です。 昨今の JavaScript は状況がめまぐるしく変化していて、それほど関心がない人にとっては追随するだけでも一苦労なのではないでしょうか。そこで今回は最近の JavaScript がわからない人向けに「昨今の JavaScript トレンド」について書きます。 トレンドっぽいキーワード一覧 ひとまずパっと思いつくキーワードを列挙してみます。 Node.js v4.2 "Argon" (LTS) npm v3 ES2015 / ES2016 Class Arrow Function let, const Promise Generator Async/Await co Observable 開発環境 Babel Gulp Browserify Webpack TypeScript アーキテク
モダンJavaScript開発環境 on Rails - クックパッド開発者ブログ
投稿推進部の外村（@hokaccha）です。 クックパッドブログの開発でRails上にECMAScript6などのモダンなJavaScript開発環境を導入した経験を元にノウハウを紹介したいと思います。 RailsはSprocketsというgemでJavaScriptやCSSをコンパイルする仕組みが提供されています。Sprocketsによるasset管理の仕組みは非常によくできており、AltJSのトランスパイルやファイルの結合、minifyなど、assetのコンパイルに必要な機能を一通り備えています。 しかし、JavaScriptにおけるモジュールの依存関係の解決や、ライブラリの管理などについてはモダンなJavaScript開発と乖離してきているのが現状です。そこで、Railsでも以下のようなことを実現できることを目標に環境を作りました。 ECMAScript6のシンタックスを使う モジュ
JavaScriptの素振りする技術
JavaScriptの素振りする技術 ライブラリをちょっと試す ライブラリをブラウザで試す JavaScriptライブラリはデモを置いてることも多い デモがないとローカルで動かすのは面倒くさい わざわざローカルでnpm installして... ちょっとしたこと試す時に使えるツール npmをその場で試す Tonic: a better REPL for node.js Browserify + REPLのようなサービス npmからリンクが貼られてる! 例: Tonic: npm on Tonic 他にも色々 RequireBin Browserify + JSFiddle的なサービス Firefox DevTools URLをページにインジェクト出来る 開発ツールバーの inject コマンド ライブラリを読み込ませてConsoleで叩く JS Envy ライブラリをちょっと試すまとめ ラ
Chromeのオリジナル拡張機能を開発しよう（ソースコードあり） | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
Chromeの拡張機能とは？ Chromeの拡張機能は実質的にはただの圧縮したフォルダです。そして、そのフォルダの中身もただのHTMLやCSS、JSファイルです。 つまり、拡張機能の作り方はWebページのそれとは大差ないということですね。 拡張機能にしか提供されていない豊富なChromeのネイティブのAPI群（Chrome.* API）を利用できるところが拡張の魅力です！ 一般公開目的ではなく、普段の業務効率化目的でも十分な利用価値があると思うので、まだの方はぜひ一度触ってみてください。 拡張機能の種類 拡張機能の種類は大きく分けて3つあります。 Browser actions Page actions Override Pages 1つずつ見ていきましょう。 Browser actions ツールバーの右側に小さなアイコンを表示させるタイプの拡張機能です。一番頻繁に見かけるのがこのタイプ
Web開発の未来 – React、FalcorおよびES6 | POSTD
この記事でWeb開発の未来を垣間見ることができるでしょう。UIの構築やサーバ、データ・エンドポイントの新しい見解を得ることができると思います。ここで、ブラウザとサーバコードの両側を含めたフルスタックな話をしていきます。これを読めば、 完全に機能するGitHubリポジトリ で紹介されたすべてのコードの検証や実行ができるようになります。皆さまが開発者として次の資質を持っていることを前提に話を進めていきます。 JavaScript中級者 HTML中級者 クライアント/サーバ間通信の基礎知識 JSONの基礎知識 Node.jsの基礎知識 上の知識がなくても、 おそらく この記事の進行についていけるでしょう。しかし、知識がないと私の紹介するコードを現実的なシナリオあるいは重要なシナリオに応用するのは難しいでしょう。インターネットは情報の宝庫なので、理解に必要な概念などをたくさん提供してくれます。必要
DMMで新規サービス作ったらフロントエンドエンジニアの重要性が浮き彫りになった話 - DMM Study night
WP-CLIとWordPress公式ディレクトリを活用した爆速サイト構築術 ーインストールからデザイン、ページ作成までを10分でー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
タブ区切りテキスト(TSV)を様々なデータ形式に変換するWEBサービスとライブラリ - Qiita
JavaScriptでクロージャ入門。関数はすべてクロージャ？ - Qiita
30分で出来る、JavaScript (Electron) でデスクトップアプリを作って配布するまで - Qiita
漢は黙ってjQuery
Node.js Is Dead - なぜ私がNode.jsを捨ててElixirに切り替えたのか-
PixiJS v4
