2017.11.18 HANATANI Takuma(@potato4d) #jsfes
Nuxt.jsで変わる開発フローとUniversal JavaScriptのイマ #jsfes
2017.11.18 HANATANI Takuma(@potato4d) #jsfes
ウェブページを1秒台で表示させる原理と方法 | Philosophy Guides
Shared content - Storj
イマドキWebフロントエンド環境とReactを触りながらサンプルを10本書いてみた
はじめに Webフロントエンドの知識がjQueryで知識が止まっていたので、モダンなWebフロントエンドに触れてみた。そのメモ。 良かった点 「今はこうなっているのかー」と分かった。今後はナウい記事を読んでもビビらないと思う。 Reactのすごさ 触ってみて下の記事のいうことが理解できた。何がすごいの？と聞かれたら下の記事を掻い摘んで説明したい。 Reactを使うとなぜjQueryが要らなくなるのか 触ってみたもの ES6 Yarn Webpack Babel Sass/SCSS React とりあえずエディタ開いてHTMLを書くぞというタイプの人間だったので、フロントエンド開発にまずはコマンドラインを打って環境を構築する点が新鮮。自動化できるところはツールで共通化してラクできるところはラクをする、というのは分かった。Reactは使うか分からないが、Webpack/Babel/SCSSは絶
「フロントエンド開発に再入門する」タスクフォースの進め方 | MEDLEY Developer Portal
2017-11-09 「フロントエンド開発に再入門する」タスクフォースの進め方 こんにちは。開発本部の宍戸です。 メドレーでは定期的に、テーマに沿って組織の技術的な底上げを行うための機会（タスクフォースと呼んでいます）を行っています。そのタスクフォースの１つとして先日、フロントエンド開発力のベースアップを目的としたタスクフォースを行いました。本記事では、その取組みについてご紹介したいと思います。 背景 メドレーには現在 20 人弱のエンジニアが在籍しており、その約半数がサーバーサイド出身者です。また普段の開発においては、一つの機能をフロントからサーバーサイドまで一貫して一人が担当するケースが多くあります。サーバーサイド出身者のフロントエンド開発のスキルセットには多少ばらつきはあるものの、普段の開発業務ではレビュー等でそれぞれサポートしつつ開発を行っています。 しかし、フロントエンドの基礎的
Nintendo Switchの中ではReactが動いてる！Nintendo eShop開発秘話を聞いてきた
Nintendo Switchの中ではReactが動いてる！Nintendo eShop開発秘話を聞いてきた 白石 俊平（HTML5 Experts.jp編集長） こんにちは、編集長の白石です。 この記事は、9月24日に開催されたHTML5 Conference 2017に登壇したエキスパートに、お話されたセッションのトピックを中心に語っていただこうとういものです。セッションの内容をより深く理解する手助けになるだけでなく、本記事単体でも面白く読んでいただけることを目指しています。 今回は、「Nintendo SwitchとWeb」という講演をされていた任天堂さんに、Switch開発におけるWeb技術の活用方法や、開発秘話を伺ってきました。任天堂のお二人は京都から、リモートでの取材に応じていただきました。 Nintendo SwitchではWeb技術が大活躍！ 白石 簡単に自己紹介をお願いで
【全訳】JSだけじゃない！AirbnbのCSS/SCSSスタイルガイド - リクルート住まいカンパニー Tech Blog
こんにちは！2016年に新卒で入社した、SUUMOのフロント開発グループでエンジニアをしているやなぎさわです。 入社早々SUUMOのCSSを再設計をする機会があり、CSS/SASSのスタイルガイドを研究していたのですが、JavaScriptのスタイルガイドで有名なAirbnbがCSSのスタイルガイドを公開しているのを見つけました。 一人で開発していたり、CSS/SASSを書く人が少人数である場合は意外とその重要性に気付きにくいのがこのCSS/SASSのコーディング規約です。CSSは単純な言語であり単にスタイリングを当てるだけであればわりと簡単にできてしまうのですが、大規模開発や修正が頻繁に必要となる運用フェーズになるとその単純さがゆえにバグを作り出しやすくなってしまいます。 特にCSSでは全てのセレクタのスコープがグローバルであり、気を抜くとすぐにクラス名などが被ってしまいます。BEMとO
Version 5.0.0 of Angular Now Available – Angular Blog
We are pleased to announce version 5.0.0 of Angular, pentagonal-donut. This is a major release containing new features and bugfixes. This release continues our focus on making Angular smaller, faster, and easier to use. Here’s a breakdown of some of the biggest changes in v5. For the full list, please see the changelog. Build OptimizerAs of 5.0.0, production builds created with the CLI will now ap
フロントエンドチェックリスト（日本語訳） - Qiita
GitHubで公開されているフロントエンドチェックリストというドキュメントが、網羅されている内容が幅広く便利そうだったので、日本語に翻訳しました。 日本語版は、以下のGitHubリポジトリにあります。GitHub側と自動的に連携するようにしておりますので、誤訳や誤りなどがあれば GitHub のプルリクエストまたは Issue で報告していただけると幸いです。 https://github.com/miya0001/Front-End-Checklist 日本語版への貢献方法 最終更新日時: 2017-11-19 03:50:47+09:00 (未翻訳) Front-End Checklist The Front-End Checklist is an exhaustive list of all elements you need to have / to test before lau
フロントエンド開発の概要について
ここでは、フロントエンド開発の概要について説明していきます。 ＊元記事はこちらです。(英語) この記事でカバーしているものについてSingle-page Apps (SPAs)New-age JavaScriptUser InterfaceState ManagementCoding with StyleTestingLinting JavaScriptLinting CSSTypesBuild SystemPackage ManagementContinuous IntegrationHostingDeploymentSingle-page Apps (SPAs)かつてはサーバーサイドレンダリングという、別のURLを開くごとにページをリフレッシュしてサーバーから新たなHTMLページを送る手法が主流でしたが、最近のSPAsではクライアントサイドレンダリングというものが主流になっています。
JavaScriptでファイルダウンロード処理を実現する - Qiita
はじめに モダンブラウザならJavaScriptでファイルダウンロード処理を実現することができます。SPA(シングルページアプリケーション)など、クライアント側にデータを持つようなアプリケーションであればサーバアクセスなしにメモリの内容からファイルを生成してダウンロードさせることができます。 実装方法 やり方は リンクのHTML5のdownload属性を使用してダウンロードファイル名を設定 File APIのBlobを使用してデータを作成 window.URL.createObjectURLでBlobからURLを生成しそれをリンク先に設定 とするだけです。これでChromeとFireFoxはいけます(download属性のブラウザ実装状況を見るとを見ると、試せていないですがEdgeとOperaもいけそう)。加えてIEをサポートする場合は、IE10/11であればwindow.navigato
Reactアハ体験 - Qiita
Ryan Florence氏のReact Rally talkはこの原則をより深くカバーしているのでオススメです。 2つのコンポーネントがstateを共有したい場合、stateを同期させるのではなくstateを持ち上げる必要があります。 コンポーネントベースのアーキテクチャでは、stateの共有は自ずと困難になります。2つのコンポーネントが同じstateに依存する場合、そのstateはどこにあるべきでしょうか？これは最終的にReduxで決着した解決策のエコシステム全体を活性化するような人気のある質問でした。Reduxの解決策は「store」と呼ばれる別の場所にstateを集約することです。コンポーネントはstoreを必要な部分だけ購読でき、storeを更新するための「actions」をdispatchすることもできます。Reactの解決策は2つのコンポーネントの最も近い親を探し、そこで共有
HTML5 Conference 2017の資料・スライド・動画まとめ
最終更新 2017/09/25 10:43 2017年9月24日（日）に東京電機大学 千住キャンパス（東京都足立区千住旭町5番）で開催されたWeb技術者の祭典「HTML5 Conference 2017」。HTML5に関連する技術について語られたセッション内容とスライド資料をまとめました。最新Web技術のトレンドが知りたい方はぜひチェックしてみてください。 「HTML5 Conference」が今年も開催されました！この記事では、「HTML5 Conference 2017」の講演スライドをまとめています。スライドが公開され次第随時更新していきますので、イベントに参加したエンジニアもできなかったエンジニアも、ぜひチェックしてみてください。 基調講演/村井 純(慶應義塾大学) 及川 卓也 吉川 徹(html5j) https://youtu.be/c_uy7UdUosU 最近の Web パフ
Addressing common misconceptions about the Payment Request API
The Payment Request API was first made available in a production browser on Chrome for Android in July 2016. It’s the very first open web feature solely focused on “payment” and is expected to evolve the entire web platform and its ecosystem in the coming years. In this article I’ll call out some common misconceptions about the API and try to address them as comprehensively as possible. If you hav
Choosing the JavaScript Framework for Gutenberg (~WordPress) · Issue #2733 · WordPress/gutenberg
I am starting this issue in light of the recent announcement of dropping ReactJS support by Matt. Since I believe the community is moving in the right direction here — this issue is where one could share their thoughts about different JavaScript Frameworks for Gutenberg (that goes into the WordPress Core). 🛳 JavaScript Frameworks! IMHO there are two prominent contenders here. VueJS Preact Other o
CoffeeScript
CoffeeScript is a little language that compiles into JavaScript. Underneath that awkward Java-esque patina, JavaScript has always had a gorgeous heart. CoffeeScript is an attempt to expose the good parts of JavaScript in a simple way. The golden rule of CoffeeScript is: “It’s just JavaScript.” The code compiles one-to-one into the equivalent JS, and there is no interpretation at runtime. You can u
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
なぜ dev.to がこんなにも速く、こんなにも自分にとって感動的なのか
Making dev.to insanely fast
“モダン”ウェブアプリケーション 〜アメブロ5ヶ年計画〜
SPAをパフォーマンス・チューニングした話
Vue.js Extend with Compiler
