JavaScript

React Testing Library を使って TDD でコンポーネントを作る

こんにちは。相変わらず Testing Library にハマっている梅津です。 今回はタイトルの通り Testing Library を使ってテスト駆動開発(以下 TDD)をやってみる記事です。 Testing Library も TDD も始めたてなため微妙な点が多いかもしれませんが、「こんな感…

React Testing Library の使い方

こんにちは。Testing Library を布教したいマンの梅津です。 以前書いた記事で実装の詳細をテストすることの弊害と React Testing Library による解決方法を Kent から学びました。 今回はその React Testing Library の簡単な使い方を紹介したいと思います…

Testing JavaScript をやってみたら学びがあって良かった話

こんにちは。リファクタリングが大好きなフロントエンドおじさん梅津です。 自信を持ってリファクタリングするには信頼できる自動テストが必要ですよね。 じゃあ信頼できる自動テストとはなんだろう?どう書いたらいいんだろう?と考えていました。 とくにコ…

「ナイスですね!」Intersection Observer!

Adways Advent Calendar 2019 7日目の記事です。 http://blog.engineer.adways.net/entry/advent_calendar_2019 はじめに 12月10日を担当します、井古田です。 最近はプロダクトマネージャー(PdM)として仕事をしています! 久しぶりの会社のブログ投稿なので…

JavaScriptのソフトウェアメトリクスを測定してみた

Adways Advent Calendar 2018 4日目の記事です。 http://blog.engineer.adways.net/entry/advent_calendar_2018 こんにちは、佐藤です。 最近、担当しているプロジェクトのコード量も増えてきて、一度プロジェクト全体の状況を把握したいなと思いJavaScript…

React NativeのレイアウトエンジンYogaの仕組み [続編]

adwaysengineerblog.hatenablog.com adwaysengineerblog.hatenablog.com こんにちは、@binaryta です。 2度に渡ってYogaの仕組みを追っていきましたが、今回が最終回です。 YogaのメインルーチンをSTEPごとに解読する STEP 1: nodeの収容領域(inner)の計算 S…

React NativeのレイアウトエンジンYogaの仕組み [後編]

adwaysengineerblog.hatenablog.com こんにちは、@binaryta です。 前編ではYogaのデバッグ環境を整えて終わりました。 まだ読まれていない方は是非上記リンクから見てみてください。 前編の末尾の方で僕は次のような一文を残しました。 Yogaのレイアウトは…

React NativeのレイアウトエンジンYogaの仕組み [前編]

こんにちは、@binaryta です。 先日「React Native OSS ペアプロ会 #3 byFACTBASE」というイベントに参加してきました。 factbase.connpass.com OSSにcommitすることを主眼としていて、React Nativeのissueの問題に解決策を提示したり、解決できそうならPull…

Hyperapp & TypeScriptを試す

こんにちは、@binarytaです。 最近ちょくちょく噂を聞くHyperappに興味を持ったのでTypescriptと組み合わせて実践してみようと思います。 Vue.jsやReactもよく触れているのでこの辺との違いについても言及できたらと思ってます。 まずHyperappが提唱するコン…

ReactのContextAPIを使ってみた

クリエイティブディビジョンからインプルーブメントディビジョンに異動してきました、17新卒の早津です。 最近React v16.3でContext APIがアップデートされました。その使い方や以前とどのように変わったのかをコードを交えて紹介していきたいと思います。 …

❣️ I Love TypeScript ❣️

こんにちは@binarytaです。 そろそろ新卒が入ってくる時期なので優しめの記事を書いていきます。 はじめに ここ数年でGithubの中で最も使用されるようになった言語として名を馳せているJavaScriptですが、まだ当言語を好きになれない、苦手だというエンジニ…

Vue.jsの仮想DOMと差分レンダリングの仕組み③

こんにちは、@binarytaです。 今回が連載ラストとなりますので、是非お付き合いください。 blog.engineer.adways.net blog.engineer.adways.net ②回目の投稿では初回レンダリング時に走るpatchの処理の流れを追いました。 今回は状態変更が行われた際に差分…

Vue.jsの仮想DOMと差分レンダリングの仕組み②

こんにちは、@binarytaです。 blog.engineer.adways.net 前回に引き続き、今回もVue.jsの仮想DOMと差分レンダリングの仕組みを探っていきたいと思います。 間違いがあるかもしれませんので間違いがあったら指摘を頂けたら幸いです。 前回は差分レンダリング…

Vue.jsの仮想DOMと差分レンダリングの仕組み①

こんにちは、@binarytaです。 何回かに分けて記事を公開していこうかなと思っております。 前提 Vue.js version : 2.5.13 対象読者 JSフレームワークの知見がある 仮想DOMの仕組みを知りたい はじめに なぜVue.jsか?という質問が飛んできそうなので一応述べ…

three.jsで誰でも簡単に宇宙を創造

ウェブブラウザ上で簡単に3D空間を再現し、 好きな惑星をつくって自分だけの宇宙を眺めませんか? 初めまして。2016年新卒入社のデザイナー、相原です。 入社後は暫くバナー制作をしていましたが、 去年の9月からフロントエンドユニットに異動して働いていま…

新卒初心者エンジニアの私が6時間+1時間でエンジニア用語タイピングデスクトップアプリをElectronで作って配布までした話

初めまして!16新卒入社、プログラミング歴半年の山﨑です! 入社当時はHTMLもまともに書けませんでしたが、先輩に迷惑をかけながらエンジニアとして働いています。 今回はブログを書くということで、Electronを使ってデスクトップアプリケーションを作りま…

Jasmineの非同期処理を使ってみた

こんばんは、高橋です。前から気になっていたJavaScriptのテストフレームワークである「Jasmine」の非同期処理について試してみたので、ご紹介します!

RxJSを触ってみた

どうも もうすぐ25歳の井古田です。時の流れとは残酷ですね!!RxJSとはC#にあったLINQ(Language INtegrated Query)というクエリ式で、データの形態を気にせず汎用的にデータを問い合わせることができる機能を非同期イベントに対応できるように拡張したも…

ミルクココア?いいえmilkcocoaです

皆さん、こんにちはー!井古田ですー。 本日はmilkcocoaについて簡単に紹介させていただきます。「え、ミルクココア?」っていう人もいるかも知れませんが・・・milkcocoaです。少し前に、日本発のBaaS(Backend as a Service)”Milkcocoa”と書いてある記事を…

AngularJSをさわってみたよ

こんにちは~エンジニアの井古田です。 近年注目されているのJavaScriptのフレームワーク、AngularJSを紹介します!こっそり勉強してはいたものの、なかなか日の目を見る機会がありませんでした。 しかし、社内ツール開発を機にこっそりAngularJSを投入し、…

Gruntを触ってみた

皆さん、こんにちは!13新卒のSEの井古田です。 本日はGruntについて紹介させて頂きます! Gruntとは・・・JavaScriptのタスクランナーです。 ファイル圧縮やコンパイル、Lintなどの繰り返し実行しなければならないタスクを自動化することで、開発作業を楽に…

ExcelのコネクタのようなことができるjQueryプラグイン【jsPlumb】

アドウェイズエンジニアのイシマルです。 あっと気づけば、もう12月。忘年会のシーズンになりましたね。 飲みなどでハメを外すこともあるかと思いますが、程々に^^; では、本題のjQueryのプラグインjsPlumbの紹介に入りたいと思います。 Web系エンジニア…

Google SwiffyとCreateJSでAJAX通信入りFlash動画の変換に挑戦してみた

こんにちは!13新卒エンジニアの古川です。今回が初めての投稿です!よろしくお願いします。今回はAJAX通信入りFlash動画をJSに変換することが可能なのか、実際に検証した内容を記事にしました!実際に試したツール・Google Swiffy Googleが提供しているFlas…

enchant.jsとCoffeeScriptでゲームを作ってみた

皆さん、はじめまして。エンジニアの梅津です。Adwaysには技術向上プロジェクトというものがあるのですが、僕はその技術向上プロジェクトの時間にenchant.jsとCoffeeScriptを利用してゲームを作りました。今回はそのとき作ったゲームを簡単に紹介をしたいと…

phantomjsでfacebookに近況を投稿してみよう

こんにちは、SEの孟です。今日のブログネタはphantomjsにしたいと思います。http://phantomjs.org/phantomjsはヘッドレスのwebkitツールで、コマンドラインから普通のブラウザと変わらない挙動でjavascriptのapiやcss,domなどを利用することができます。また…

jQueryのクロスドメインではまる!

皆さんはじめまして!アドウェイズエンジニアの小松です。ついに入梅してしまいました(´・ω・`)小松はこの時期がとても苦手なのでかなりつらいです。早く夏になってほしい~~TTさて、最近、どんなサイトでも当たり前のように使われているJavascriptのフレ…