悪名高きスワイプ広告を解析する - Qiita
この記事の概要 ユーザーから嫌われている広告の1つに「スワイプ広告」というものがある。 誤タップをしやすいことが理由だが、あまりにもこの広告だけ誤タップするため調べたところ 実は誤タップしたように見せかけて意図的に広告先に遷移させる広告であるということがわかった。 スワイプ広告とは、左右にスワイプすると画像がついてくるタイプの広告である。 スワイプ広告とは スワイプ広告とは、主にアフィリエイトサイトで見られる広告形式の一つである。 ユーザーは指で画面上の広告を左右にスワイプすることで、広告画像を切り替えることができる。 スワイプによるインタラクティブ性を活かし、複数のメッセージやメディアを使い、魅力的な広告体験を提供することが特徴である。 なぜ悪名高いのか しかし、スワイプ広告はユーザーから嫌われている。その理由は、誤タップを誘発しやすいからである。 誤って広告をタップして画面が遷移してし
idやclassを使ってテストを書くのは、もはやアンチパターンである - Qiita
いきなり結論を書くと、idやclassはスタイルのためのものなので、テストでそれを使うのはやめましょう。そして、カスタムデータ属性を使いましょう。(idやclassはスタイルのためだけではないという意見はごもっともです！しかし、主にとしてスタイルに使われるということでご了承頂いて以下の駄文に付き合って頂けると幸いです🙇) 先に断っておくと主にreactについての話で、JSXを前提とします。(手法はReactに限りませんが理由は後述) 2020/03/23 追記 この記事は1年以上前に書かれた記事なのでテストフレームワークとしてenzymeを使っていますが、現時点ではTesting Libraryの使用をオススメします。data-testid に対応するクエリを備えています。 React Testing Library · Testing Library はじめに ご存知の通り、ロジックと
JavaScript言語について · GitBook
JavaScript言語について 言語的特徴 動的型付け 関数も値の一種 C-likeな文法 プロトタイプベースの継承構造 近年Class構文が追加された 言語のコア部分はECMAScriptとして標準化されている JavaScript と ECMAScript 仕様について (JavaScript Overview - MDN) ECMAScript最新仕様は ECMAScript® 2016 Language Specification 以下では、ECMAScript2016をベースに、JavaScriptという言語自体について解説します。
カリー化と部分適用（JavaScriptとHaskell） - Qiita
カリー化と部分適用について簡単に説明します。特定の言語に依存しない概念を説明するのが目的ですが、例としてJavaScriptとHaskellを使用します。 JavaScript カリー化と部分適用はよく混同されるので注意が必要です。 関数を引数1つずつに分割してネストさせることをカリー化と呼びます。 一部の引数を固定化して新しい関数を作り出すことを部分適用と呼びます。 非カリー化 カリー化
Unique object identifier in javascript
I need to do some experiment, and I need to use some kind of unique identifier for objects in JavaScript so I can see if they are the same. I don't want to use equality operators. Instead, I need something like the id() function in Python. Does something like this exist?
自動フォーマット駆動の JavaScript 開発環境 - build error
Python や Go では、コードの編集時には標準のコードスタイルで自動チェックし、保存時にもその同じコードスタイルで自動フォーマットするといったことができる。言語で決められた標準のコードスタイルのない言語では、自動チェックと自動フォーマットで同じコードスタイルが適用されるようにしないと意味がない。 Closure Linter はまさにそのためのツールだけど Google JavaScript Style Guide に限られる。 jsfmt は esformatter を自動フォーマットエンジンとして利用する。esformatter では diff を出力することはできるけどコードスタイルエラーの詳細を出力できない。 Linter である JSHint や ESLint にはコードスタイルに関するオプションもある。それらを esformatter における同等の設定に変換して jsf
EmacsのESLint環境をセットアップした - Umi Uyuraのブログ
以前、EmacsでReact(JSX)コーディングする環境について調べた際に、JSXの構文チェックとして JSXHint を使うようにしました。 umi-uyura.hatenablog.com ところが、こちらの記事によると、どうやらすでにJSXHintはDeprecatedになっていて、ESLintへの移行を促しているとのこと。 vim + syntastic + jshint だと JSX がエラーになる問題 | はなたんのブログ ESLintがJSXにも対応していることは前回把握していたものの、一通り設定をするのが面倒だったので採用していませんでしたが、そろそろES6も触ってみたいこともあり、このタイミングでESLintの環境を用意しておくことにしました。 ESLintの導入 npmからESLintをインストールしておきます。 $ npm install -g eslint Fly
私たちはなぜReactではなくVue.jsを選んだのか | POSTD
Qwintryチームは最近、既存のすべてのプロジェクトのフロントエンドをVue.jsに移行しはじめました。新しいプロジェクトでもVue.jsを使います。 レガシーなDrupalのシステム（qwintry.com） ゼロから新しく書きなおすqwintry.comのブランチ Yii2で動くb2bシステム（logistics.qwintry.com） その他、比較的小さめのプロジェクト（ほとんどは、PHPとNode.jsでバックエンドを構築しているもの） プロジェクトの規模についていうと、 Qwintry は世界中で約50万人の顧客が使っています。アメリカとドイツに倉庫を持っていて、アメリカ国内 最大の郵送先 のひとつで、東欧や中東への出荷に注力しています。Qwintryは、アメリカのオンラインストアでグッズを購入する人たちのためのツールです。私たちの倉庫に届いた荷物をコントロールパネルで管理で
React、Angularになじめなかった僕に手を差し伸べてくれたVue.js - Qiita
ギークハウス Advent Calendar 2016の12月２２日の記事です。 他の方とは、全然違う雰囲気になってしまいましたが、読んでいただけると幸いです。 なぜVue.js？？ 普段の仕事では、Ruby/Railsなので、フロントエンド周りは、jQueryにCoffeeScriptで片手間感覚... ↓ しかし最近のフロントエンド界隈は、良くも悪くも盛り上がっていて楽しそうだなあと思う日々。 ↓ いろいろ、ググって調べてみると、ES6、Babel、Reactふむふむ...🤔 ん？？ Webpack? JSX?? Flux?? Redux?? 「落ち着け！とりあえず日本語でOK」状態。。正にこの記事で書かれている状態そのものでした。 ↓ Reactとかでイケてるフロントエンド開発をちょっと試したいと思っても、BabelやWebpackの設定など環境構築でつまづき、肝心のアプリケーショ
このブログのコードのシンタックスハイライトにPrismを利用することにした ·
このブログはcasper(vjeantet/hugo-theme-casper)というテーマを使っています。 デフォルトではコードを貼り付けたときにシンタックスハイライトが効かないことに気づいたので、CSSやJS周りを調整しました。 ✎Prismを使ってみる Prism(PrismJS/prism)というやつが目に止まりましたのでこれを使ってみます。 MITライセンスです。 まずhttp://prismjs.comに訪問する。こんな↓サイトです。 「DOWNLOAD」ボタンを押すとこんな画面です。↓ ここで利用する言語に応じてCSSをカスタマイズすることができます。 チェックした言語がCSSに反映されるようです。 さらに「DOWNLOAD JS」及び「DOWNLOAD CSS」ボタンを押すと、prism.jsとprism.cssが降ってきます。 ✎casperに反映させる どうやらcasp
10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。
2015年はCSSが普及した以来となる10年に1度のフロントエンド大変革期で、それまでのツケが一気に回ってきたと個人的に感じていました。目まぐるしく状況が変化していきましたが、2016年になり、個人的にだいぶ落ち着いてきたと感じているので、ここらへんでまとめておきたい思います。 最初に結論を書いておくと、 『React + Redux + react-router + material-ui + axios + ES2015 + Babel + webpack + ESLint + Airbnb JavaScript Style Guide』 という組み合わせが、いま僕の採用しているJavaScriptの環境です。 主要ライブラリは React A JavaScript library for building user interfaces | React 去年、一気に普及したReact
ECMAScript 2015はなぜ策定まで時間がかかったか？ 仕様策定のリーダー、アレン・ワーフスブラック氏に聞く
Mozilla主催のフロントエンド開発者のためのカンファレンス「ViewSource Conference」が、北米・オレゴン州ポートランドにて11月2～4日に開催された。ここで、ECMAScriptの仕様策定のリーダーを務めたアレン・ワーフスブラック氏は「ECMAScript 2015：なぜそんなに時間がかかったのか」というタイトルでセッションを行った。氏によると、2015年6月にリリースされたECMAScript 2015は、1999年のECMAScript 3リリース以来、初めての包括的な再定義となるという。なぜ時間がかかったのか、その思うところについてインタビューを行った。 聞き手：近藤佑子（編集部）、矢倉眞隆氏 協力：清水智公氏（Mozilla Japan）、浅井智也氏（同） アレン・ワーフスブラック（Allen Wirfs-Brock）氏 アレン・ワーフスブラック氏の行ったセッ
[図解]フロントのJavascriptだけでFacebookログイン実装 (2015年3月版) - Qiita
はじめに FacebookのAPIってコロコロ変わって面倒ですね。 2012年とか2013年とかに書かれた記事はほぼ参考になりません。(disってる訳じゃないです。事実です汗) 久々に触ってみたので現時点(2015年3月)での実装手順をまとめてみました。 トップページ 開発者トップページ https://developers.facebook.com/ My Apps > Add a new app > ウェブサイトを選択しましょう。 それか直接↓のリンクでも大丈夫です。 webサイト向けのリンク Webページ向けの機能を作る場合はこちら https://developers.facebook.com/quickstarts/?platform=web 入力フォームに新しく作るアプリケーションの名前を書いて、Create New Facebook App IDを選択します。 カテゴリに任意
![[図解]フロントのJavascriptだけでFacebookログイン実装 (2015年3月版) - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/31c61adc50118dc2393e0fc4531ab6ca47ecadb8/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9JTVCJUU1JTlCJUIzJUU4JUE3JUEzJTVEJUUzJTgzJTk1JUUzJTgzJUFEJUUzJTgzJUIzJUUzJTgzJTg4JUUzJTgxJUFFSmF2YXNjcmlwdCVFMyU4MSVBMCVFMyU4MSU5MSVFMyU4MSVBN0ZhY2Vib29rJUUzJTgzJUFEJUUzJTgyJUIwJUUzJTgyJUE0JUUzJTgzJUIzJUU1JUFFJTlGJUU4JUEzJTg1JTIwJTI4MjAxNSVFNSVCOSVCNDMlRTYlOUMlODglRTclODklODglMjkmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtY2xpcD1lbGxpcHNpcyZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPWI3MGE0N2ZjMTI3NWYzMDMwNDQ4N2RlNmEwZjc1NGYy%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwbjBiaXN1a2UmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTU1MWVlZWU5YWEyYTYxNTdmYTllNWM3ZWY1NWQyZmUy%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3D3d753adc5f212a6bcd182758cfb6604b)
Turbolinks 3こそRailsの未来 - Qiita
Turbolinks 3こそがRailsの未来 かもしれない。 追記 2016/2/22 と書いてたけど実現しない感じになってきました。 現状のTurbolinksは Turbolinks classic とリポジトリ名が変更され、新たにTurbolinks5の開発が進められることになったようです。 背景にはiOSやAndroidとのCompatibilityを高めるためみたい。 Turbolinks3で目玉として導入される予定だったPartial ReplacementxはViewの遷移の責務がTurbolinksが持つことになり複雑さがますため、取りやめになりました。その代わりにpersistさせたいelementにdataを記述することでTurbolinksのDOMの置き換えがその部分は行われない手法が採用される予定みたい。これで複雑さを減らし、同じように高速化が実現出来るみたい。R
JavaScriptをプロトタイプベースのオブジェクト指向言語と言うべきではない - id:anatooのブログ
勘違いしている方も結構多いと思ったので、これの解説。 JSをプロトタイプベースのオブジェクト指向言語って言うの誤解しか産まない気がしてきた— anatoo (@anatoo) 2015, 5月 3 ウェブ上の記事を眺めていると、JavaScriptをプロトタイプベースのオブジェクト指向言語(以下OOPと書く)と説明している例がよく散見される。この書き方は間違ってはいないかもしれないが、もはや誤解を生むだけである。 そう言う理由には、ES6からはclass構文があるため、通常のクラスベースのOOPと一切何も変わらなくなっているからというのがある。だが最も大きな理由は、JavaScriptはプロトタイプベースのOOPの中でも異端であり、本来のプロトタイプベースのOOPとはあまり似ていないからである。 JavaScriptでは、new演算子を使ってオブジェクトを生成したり、prototypeオブ
DOM要素のidはグローバル変数 - ジンジャー研究室
DOM: element IDs are global variables 知らなかった…orz とはいえ普段は使わないほうがよさそう。 既に定義されているグローバル変数と被っていると上書きされない。 <div id="a">Hello!</div> <script>console.log(a);//<div id="a">Hello!</div></script> <script>var b;</script> <div id="b">Hello!</div> <script>console.log(b);//undefined</script> <script>c = null;</script> <div id="c">Hello!</div> <script>console.log(c);//null</script> <script>d = undefined;</script>
私の中のJavaScriptライブラリの歴史 - Fuzoku実践入門ブログ
最近、JS界隈ではReactが大いに盛り上がっていますが、私のような一介の風俗解説本の著者からみると、何の話だろうといった感じです。 そこで、一度自分の中のJavaScriptライブラリの流れを整理してみようかなと思ってメモしたので公開してみます。 Ajax登場 2004年くらいまでは、 JSは危険だからブラウザでオフにしよう JSなしでも見られるページ作りをしよう という考え方が、Webに詳しい人達のわりと一般的なコンセンサスだったが、Ajax（主にGmailとGoogle Maps）の登場により世界は一変。Webの世界は、はっきり言ってJSなしでは生きられなくなった。 ちなみに、それまでのJSといえば、右クリックを禁止したり、ポップアップウィンドウを開いたりする、ただただウザい存在でしかなかったので、上記の考え方は別に尖っているわけではなかった。 素のJS書くのつらい → 最初の有名ラ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
コンパイラの人からみたWebAssembly | κeenのHappy Hacκing Blog
Packaging Generated Code for gRPC Services
GitHub - airbnb/javascript: JavaScript Style Guide
