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
![20 年代のフロントエンド.md](https://cdn-ak-scissors.b.st-hatena.com/image/square/1ef26f6cb4349557952890dbe3e567f7f98dc151/height=288;version=1;width=512/https%3A%2F%2Fgithub.githubassets.com%2Fassets%2Fgist-og-image-54fd7dc0713e.png)
これからJavaScriptを学習するならES2015(ES6)に基づいたコーディングをしたほうがいい項目をピックアップしました。 はじめに JavaScriptはNetscapeによって開発され、当時、業務提携していたSun MicrosystemsのJavaが注目されていたので名前がJavaScriptとなりました。 主にNetscapeが設立したMozillaが仕様を策定し、Ecma InternationalによってECMAScriptとして標準化されています。 そのため、仕様の版(edition)はECMAScript 5th editionなどの番号が付きます。 2015年に公開されたECMAScript 6th edition(ES6)から「ECMAScript 2015」と年号が付くようになって毎年改訂されています。 このECMAScript 2015(ES2015)ではダ
技術本部 Web Initiative Center で Web プロダクトの品質改善や組織の技術推進に取り組んでいます、 @1000ch です。その活動のひとつに、直帰率や PV/Session といったプロダクトの KPI を上げることを目的とした Web パフォーマンスの向上があるので、今日はその取り組みについて書きます。 旧来の Web パフォーマンスの評価指標 これまでは DOMContentLoaded イベントや load イベントの値が Web ページのパフォーマンスの良し悪しとして扱われることが多かったと思います。しかしアーキテクチャの複雑化の一途をたどる Web ページのパフォーマンスを測る上では、もはや適切な指標とは言えません。 DOM 構築完了を指す DOMContentLoaded イベント DOMContentLoaded は DOM ツリーの構築完了を表します
ECMAScript 6(2015年6月に公開され、今もなお比較的新しい JavaScript)の大目玉である イテレータ と ジェネレータ。なかなかに複雑で巨大な仕組みになっていてややこしいです。 そこで今回は イテレータ を、順を追って理解できるように解説したいと思います。 Qiita: JavaScript の イテレータ を極める!(この記事) Qiita: JavaScript の ジェネレータ を極める! また、実用的なサンプルを「3. 実用サンプル」に示しました。 初めにこちらを見て、何ができるのかを知ってから読み始めるのもオススメです。 (2017年3月現在、オープンなページでの使用はまだ避けたほうがいいかもしれませんが、実装は確実に進んでいます。ECMAScript 6 compatibility table) 1. ことばの定義 1.1. イテレータ (Iterator
ECMAScript 6(2015年6月に公開され、今もなお比較的新しい JavaScript)の大目玉である イテレータ と ジェネレータ。なかなかに複雑で巨大な仕組みになっていてややこしいです。 そこで今回は ジェネレータ を、順を追って理解できるように解説したいと思います。 Qiita: JavaScript の イテレータ を極める! ←こちらから読むのがオススメです Qiita: JavaScript の ジェネレータ を極める!(この記事) また、実用的なサンプルを「3. 実用サンプル」に示しました。 初めにこちらを見て、何ができるのかを知ってから読み始めるのもオススメです。 (2017年3月現在、オープンなページでの使用はまだ避けたほうがいいかもしれませんが、実装は確実に進んでいます。ECMAScript 6 compatibility table) 1. ジェネレータ、ジェ
※本記事は、2019年11月に公開された内容です。 2018年に行われたFLEXY主催のCTOmeetupでも好評だった、JavaScriptテーマ。 今回もフロントエンドのプロフェッショナルな方々に、とことんJavaScriptについて語っていただきました。 2019年の今、最前線で技術を研鑽し続けるエンジニアはJavaScriptの現在や未来をどう見ているのか。 フレームワークの選定基準や、フロントエンドエンジニアに求められる資質、採用手法なども網羅しています。 【ご登壇者】 株式会社リクルートテクノロジーズ・グループマネージャー 古川 陽介さん 株式会社ZIKU Technologiesフロントエンド開発担当者執行役員/UXエンジニア 株式会社Emotion Tech プロダクトアドバイザー 株式会社GIG プロダクトアドバイザー 林 優一さん STUDIO株式会社 技術顧問 菅原
JavaScriptの入門書などでは、よくfunction文やfunction式を普通の「関数」として紹介しています。ES5までであれば、それで正しいのですが、ES2015(ES6)以降のJavaScript入門でも同様の説明がなされていることが多いです。 私にはそのことが多くの初心者をJavaScriptの闇に引きずり込んで苦しめているように思えます。 function文は使ってはいけない ホイスティング function文で定義された関数は、宣言のホイスティング(巻き上げ)が行われます。
TL;DR 要点だけ知りたい方は、最後の方だけ読めば大丈夫です。 背景:Reduxが全然わからないのでちゃんと勉強した 開発現場にReduxを導入しておきながら、チーム全員が「全然分からない。俺達は雰囲気でReduxをやっている」状態だったので、本腰入れてドキュメント読みました。基本を押さえたら一気に見通しが良くなったので、説明します。色々なサイトやドキュメントは明らかに冗長な説明多いので、極限までエッセンシャルを絞って説明することで、ゼロ知識からでもある程度、理解できるレベルの説明に落とし込むことに挑戦しました。うちの開発チームで知見として残すために作成したものですが、需要がありそうかなと思ったので、公開します。需要がなければすみませんでした。おかしな点があれば、まさかりお待ちしております。 今回は、公式ドキュメントのBasics辺りの話まで。 Reduxの主な登場人物 Reducer
HTML5 Conference 2018 の登壇資料のまとめです。 資料を発見次第随時アップデートしていきます。 https://events.html5j.org/conference/2018/11/ 2018年11月25日(日) 東京電機大学 千住キャンパス 1号館 タイムテーブル https://events.html5j.org/conference/2018/11/session/ ハッシュタグ 総合: #html5j ホール(2階): #html5j_h 各ルーム(1階:A-C/2階:D,E): #html5j_a #html5j_b #html5j_c #html5j_d #html5j_e セッション ZOZOのグローバルECのフロントエンドアーキテクチャ設計 (権守健嗣さん) 光を超えるためのフロントエンドアーキテクチャ (mizchiさん) TypeScript E
1 はじめに CX事業本部の平内(SIN)です。 処理ごとに蓄積される「一覧(ログ)ファイルを、リアルタイムにS3上に作成する」というニーズに対して、昨日、下記のようなブログを書きました。 これに対して、社内から、このような要件なら、「FIFOなSQSより、KinesisでSequenceで管理した方がLambdaも入れやすいし使い勝手は良さそうな気がします。」という貴重なアドバイスを頂いたので、やってみました。 注意:今回も、S3の「結果整合性」の制約下で完全な「排他制御」が出来たわけではありませんので・・・「それでも!」という方は、読み進めて頂ければ嬉しいです。 2 Kinesis Data Streams Kinesis Data Streamsを log-sample-stream という名前で作成しました。 ストリームを処理するタスクの同時実行を制限するために、シャードを1に設定
Typetalk チームフロントエンドエンジニアの岡藤(@johnykei)です。先日 Typetalk Webサイトリニューアルに伴い、フロントエンドの技術を jQuery から React + styled-components に刷新しました。本記事では、React を用いた Web サイト制作についてお伝えします。 はじめに タイトルにもあるように、僕は今まで JavaScript を書く必要がある時は使い慣れた jQuery を使っていました。 フロントエンドエンジニアという肩書きではありますが、フロントエンドエンジニアという職種は幅広く、僕はどちらかというとページやUIのスタイリングが主な業務で、普段 JavaScript を書く頻度もそんなに高くありませんでした。 最近海外ではそのような業種の人をフロントエンドデザイナーと呼ぶ動きも出てきていますが、jQuery しか使ってい
Service workers offer incredible utility, but can be tricky to work with at first. Workbox makes service workers easier to use. However, because service workers solve hard problems, any abstraction of that technology will also be tricky without understanding it. Thus, these first few bits of documentation will cover that underlying technology before getting into Workbox specifics. To view a runnin
Apply instant loading with the PRPL pattern Stay organized with collections Save and categorize content based on your preferences. PRPL is an acronym that describes a pattern used to make web pages load and become interactive, faster: Preload the late-discovered resources. Render the initial route as soon as possible. Pre-cache remaining assets. Lazy load other routes and non-critical assets. In t
前書き このエントリーは Recruit Engineers Advent Calendar の 1日目の記事です。 www.adventar.org リクルートテクノロジーズのフロントエンド開発 リクルートテクノロジーズではいくつもの並行するタスクが走っていて、プラットフォーム基盤と呼ばれる基盤技術開発とインフラソリューションと呼ばれるインフラ開発、後はアプリケーション開発支援などのタスクが存在します。 アプリケーション開発支援の中でもウェブフロントエンド開発は目下のところ重要タスクとされており、色んなやり方をトライアルしています。 基本的には、 React Redux Node.js という組み合わせでフロントエンド開発をしています。 主には以前 ubb.jp というイベントで発表したこの資料に記載されている内容でやっていますが、諸々補足します。 リッチなウェブアプリケーションを作るた
We’re excited to introduce you to Twitter Lite, a Progressive Web App that is available at mobile.twitter.com. Twitter Lite is fast and responsive, uses less data, takes up less storage space, and supports push notifications and offline use in modern browsers. The web is becoming a platform for lightweight apps that can be accessed on-demand, installed without friction, and incrementally updated.
TypeScript再入門 ― 「がんばらないTypeScript」で、JavaScriptを“柔らかい”静的型付き言語に JavaScriptプロジェクトでTypeScriptを導入する際には、“柔らかい”静的型付き言語とするのがおすすめです。藤吾郎(gfx)さんがまとめた「がんばらないTypeScript」のガイドラインです。 TypeScriptは、すべてのJavaScriptプロジェクトで採用する価値のある技術です。TypeScriptとこれに対応したエディタを導入することで、補完や型ベースの整合性のチェックにより、すべてのプロジェクトで生産性が上がります。またリファクタリングも容易になるので、長期あるいは大規模なプロジェクトでも品質を保ちやすくなります。 この記事では、TypeScriptについて最低限の知識とともに、サクッと(どちらかというと既存のプロジェクトに)導入するための
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く