TechCrunch | Startup and Technology NewsFeaturing Prime Minister of Greece & top Euro tech voices!
Vue.js の 単体テストについて、webpackなどビルドツールがない状況での環境を構築する - Qiita
背景 公式の単体テストでも、ビルドツールありきのテスト環境となっている。 ただ、自分の環境では、webpackなどビルドツールは使用しておらず、Vue.js の単体を使用している。 そんな状況だが単体テストは行いたい。 問題 公式でもwebpackなどを使用しているためか、vueのテストの情報は、ビルドツールありきになっている。 ただ、単体テストのためだけにwebpackを入れるか？ となるとそれはそれで、めんどくさい。 ちょろっと作ったvueアプリケーションの整合性が担保できればそれでいいので、できる限り手間をかけずにテストを行いたい。 達成目標 webpackは使わない. jasmine + karma での vue.js の単体テスト ヘッドレスなテスト (phantomjs使うよ) coverageは取れるようにしておく と以上の４点が達成できればOKということにします。 テストを
FRESH! Web パフォーマンス改善 〜クライアントサイド編〜 | CyberAgent Developers Blog
You can read this post in English. みなさんこんにちは、FRESH! でフロントエンドの開発している鈴木(sutiwo)です。 前回は、FRESH!におけるPCブラウザのFlash脱却という HLS の Web プレイヤーについて記事を書きました。 今回はスマートフォン・ PC でのブラウザに関するパフォーマンス改善の取り組みとその結果についてお知らせします。 まずクライアントサイドのパフォーマンス改善を行うにあたり、弊社の Web Initiative Center* から 1000ch 氏に加わっていただきどのようなことを目標とするか議論しました。 * Web プロダクトの品質向上とWeb技術を使ったチャレンジを目的に設立された弊社の組織 議論の様子 議論を行った後、今回の改善で以下のことに取り組むことが決まりました。 Service Worker で
1人仕事に限界あるので今年から取り組みはじめてること - 40歳からのキャリアチェンジ
Co-Edoでエンジニア・webデザイナー飲み会『健康的にお酒を飲んでわいわい交流しよう！』というイベントに参加してきたので、そこでこんなLTしてきました。 元々ブログに書きたいと思っていたネタなので、スライドの内容を補足する形で久しぶりにブログにまとめておこうと思います。 最初に前置き的なこと スライドでも触れてますが、2014年７月〜フリーランスになったので、気づいたら3年弱経過してました。 1人で仕事やってるので 忙しい時に仕事の依頼が来てやむなく断ってしまう 目先の案件の仕事ばっかりになってしまってこの先必要な技術習得を疎かにしがち ということが、時々発生してました。 やむなく断ってしまう場合にも出来ることはやっておく 忙しい時に仕事の依頼が来てやむなく断ってしまうという件については、仕事内容、先方の雰囲気などを踏まえて誰か良さそうな人がいないか周りの人に声をかけてみるということを
JOSE（JavaScriptオブジェクトへの署名と暗号化）は、絶対に避けるべき悪い標準規格である | POSTD
注： 本稿は元はJSON Web Tokens（JWT）について書いたものですが、JWTはJavascript Object Signing and Encryption（JOSE）のサブセットであるため、以下の批評はどちらかというとJOSE全体に焦点を当てています。 もし既にJavascript Object Signing and Encryption（JOSE）を実装することを決めているなら、それがJSON Web Tokens、JSON Web Encryption（JWE）、JSON Web Signatures（JWS）のいずれであっても、その決断に疑問を持つべきです。間違いを犯そうとしている可能性があります。 この投稿に書いたことはすべて、RFC 7519、RFC 7515、そしてRFC 7516に則っています。将来、新規のRFCでは以下に挙げるような欠陥はなくなっている可能
知ってるようで意外と知らない、JavaScriptの参照のしくみ
結論を言えば、JavaScriptにはポインターがなく、参照の方式は私たちが知っているほかの主要なプログラミング言語とは異なります。JavaScriptでは、ある変数が別の変数を参照すること（参照渡し）には対応していません。そしてオブジェクトや配列のような複合型のものだけが「参照渡し」を使います。 この記事では以下の用語を使用します。 スカラー（基本型）：1つの値もしくはデータ型（整数、論理値、文字列など） 複合型：複数の値から成るもの（配列、オブジェクトなど） プリミティブ：ほかの場所の値を参照しているだけのもの（参照型）と区別するため、実際に値を保有しているものをプリミティブとする JavaScriptのスカラーはプリミティブですが、Rubyなどほかの言語では参照型のスカラーになっています。JavaScriptではプリミティブなスカラーはイミュータブル（immutable）ですが、複合
TypeScriptにpluginがやってくる 使ってみよう編 - Qiita
はじめに どうも、 @Quramy です。 前回の投稿から随分日が経ってしまいましたが、この投稿はある意味で前回投稿の続編的な内容になります。 今日はTypeScript 2.3から導入されるLanguage Service Extensibilityと呼ばれている機能についてまとめてみようと思います1。 どのような変更なのか TypeScript Roadmapのリンクを辿っても、https://github.com/Microsoft/TypeScript/pull/12231 に行き着くだけで、パッと見は何の機能なのかよく分かりません。 このPRの実装を眺めると、次の機能が見えてきます。 tsconfig.jsonのcompilerOptionsに"plugins"というキーが追加されている pluginsに指定した内容は、TypeScript本体からresolveされる すなわち、
MOPID | Accelerate Your Hiring Process - Hire the Best, 10x Faster
Hire the best. At 10x the speed.Hire the best. At 10x the speed.Screen and interview candidates 10x faster with MOPID AI Recruiter that saves upto 80% of your time and resources. Hiring 100+ positions? Try⚡Blitzhiring⚡for a change!Hiring 100+ positions?Try ⚡Blitzhiring⚡ for a changeWe get it. Large scale hiring costs a lot. What if you could hire the perfect talent AND save up to 80% resources? We
Releasing Prettier 1.0
This post was written by vjeux and edited by jlongster. We officially announced prettier over two months ago as a way to solve the problem of wasting time formatting your code. It started as an experiment but it clearly resonated with a lot of people, amassing ~7000 GitHub stars and over 100,000 monthly npm downloads in just two months. In case you don't know, prettier is a JavaScript formatter th
「Reactの難しさ」を分解しよう - タオルケット体操
他のライブラリと比べるまえに まず、ReactとjQueryと比べるのはやめよう 「テンプレートエンジン」として捉えて、シンタックスを攻撃するのをやめよう ライブラリとしてのReactはとても簡単 Reactの思想を理解するのはチョットムズカシイ 環境構築が難しい JavaScriptそのものが難しい GUIが難しい jQuery時代からのパラダイムシフト フレームワーク関係者の情報量が多い SPAはとりわけ難しい まとめ ずっと感じてたもやもやを書き連ねたら長くなってしまったが、ぼんやりとReactとかなんか難しそうだしめんどくさいから新規案件だけどjQueryでやろっかなどうしよっかなーと迷っている人の指針になってくれればうれしい。 他のライブラリと比べるまえに まず、ReactとjQueryと比べるのはやめよう 出た時から延々と言われ続けているものの、やっぱり今でもjQueryとRe
A library for building cross-platform apps - ReactXP
Building on React ReactXP builds on the popular React JS and React Native frameworks. XP means X-Platform Share most of your code between the web, iOS, Android, and Windows. Apps Users Will Love Create great-looking, responsive web pages and mobile apps that feel native. The authors of React use the phrase “learn once, write anywhere”. With React and React Native, your web app can share most its l
WebRTCセキュリティレポート · A Study of WebRTC Security
WebRTCセキュリティレポート あらまし WebRTC(Web Real-Time Communication)は、Webアプリケーション技術の昨今のトレンドの一つだ。WebRTCを利用すると、プラグイン無しで、また他の条件も無しでリアルタイムコミュニケーションを実現できる。だが、そのオープンソースとして性質から、WebRTCを採用しようとする人がセキュリティ上の不安を覚えることもあるだろう。本レポートはWebRTCのセキュリティについて明らかにし、他の技術と比較してWebRTCのセキュリティが優れていることを解説する。 1. 導入 WebRTCはオープンソースのWebベースの技術であり、ユーザがリアルタイムメディア通信を、プラグイン無しで実現可能な技術だ。適切なブラウザを利用すれば、ウェブサイトをブラウズするだけで、他者に発信して通話することができる。 WebRTCの主なユースケースは
ReduxでのMiddleware不要論 - Qiita
問題提起 （※タイトルはキャッチーなのにしましたが、Middleware全般の不要論ではありません。非同期処理において不要論です。） Redux使うときに非同期処理はどう書きますか？ 「よくわからないけどMiddleware使うらしい」と思考停止していませんか？ この記事では、Reduxは本来どのように扱うことを想定されているのかと、なぜ非同期処理の文脈でもMiddlewareが出てきたのか、そして「実はMiddleware無くても読みやすく書けるよね」という話をしていこうと思います。 Reduxでの設計を悩む人への個人的な解です。 （気になる・詳しく知りたい箇所などありましたらお気軽にコメントください） この記事のゴール ActionDispatcherという筆者が命名したクラスを使うことで、 複数の非同期処理を含むロジックでも読みやすく書ける ネットワーク通信などを含んでもテストがしや
Reduxの正しい解釈の話
2016年の課題は状態遷移の管理だったと思う。 そのアンサーとして、 Fluxのような実装におけるStore相当にアプリケーションの状態をほぼすべて管理させるReactのようなVirtual DOMを搭載したビューの実装を透過的なユーザーインターフェースとして扱うこの2つの組み合わせにより、アプリケーションの状態と描画される画面が (ほぼ) 参照透過的になる。というのがFluxとReact以降のパラダイムだと思う (理論として) 。 このパラダイムなら、エラーの発生時にアプリケーションの状態を表現するJSONをエラー収集サービスに送るようにして、簡単にバグを再現したりできるし、状態の遷移をテストしていくことで、クラッシュするようなバグのうち大半を検出できる。 Fluxの問題そこで問題が出るのが、Action(Creator) とReducer (Store#reduce())の2要素間のル
WebAssemblyのゲームをアセンブリ直書きで作る - ABAの日誌
左右矢印キーでスタートして移動、降ってくる岩を避けて下さい。 wasm-game-by-hand コードは以下。 game.wat ブラウザ上のアセンブリ言語ことWebAssemblyがChromeやFirefoxで動くようになってきたので何か作ろうと思った。普通はUnityとかRustとかのWebAssemblyを出力できるエンジンや言語を使って生成するのだが、せっかくだから直に書いてみた。 WebAssemblyはS式で書ける（wast形式）。 Understanding WebAssembly text format WebAssemblyはスタックマシンなので、2つの値を足す場合、それら値をスタックに順に積んでAddを呼び出す、というふうに書く。 get_local $p get_local $p i32.add でも引数が先に来て後に命令がくるのはあまり直感的な感じはしない。なの
RxJS を学ぼう #1 - これからはじめる人のための導入編 | Recruit Tech Blog
React の登場と共に web フロントエンド界隈でも注目を集めるようになったリアクティブ・プログラミング ( RP ) 。その中でひときわ存在感を放っている1)オレ調べ。 RxJS について学んでみようと思います。 ReactiveX そもそも RxJS って何？ RxJS は Reactive Extensions for JavaScript の略称です。Observables というアーキテクチャを用いたリアクティブ・プログラミング用のライブラリであり、非同期処理 ( クリックなどイベント駆動の処理も含まれます ) を簡潔かつ可読性高くコーディング出来ることを主な目的としています。 で？Reactive Extensions ( Rx ) って何？ 元々は Microsoft が C# 向けのライブラリとして設計・開発したものです。2009年に始動したプロジェクトから生まれたこの
サービスの成長を支えるフロントエンド開発 #denatechcon
1. Copyright © DeNA Co.,Ltd. All Rights Reserved. サービスの成長を 支えるフロントエンド開発 February 10, 2017 Naoki Endo x Takefumi Yoshii DeNA Design Strategies Office DeNA Co., Ltd. 2. Copyright © DeNA Co.,Ltd. All Rights Reserved. AGENDA ■ 自己紹介 ■ サービス運用におけるパラダイムシフトとの最適な付き合い方 ■ 直近の業務における選択 - React を選んだ観点 - ■ 直近の業務における選択 - Vue.js を選んだ観点 - ■ 中長期的にサービスを支えるコンポーネント設計 2
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - ember-cli/babel-plugin-debug-macros
ChromeのヘッドレスモードをMacOSXで試してみた - Qiita
GitHub - babel/awesome-babel: 😎A list of awesome Babel plugins, presets, etc.
