State of SEO for SPA 2019 - Qiita
メタ この記事はNode学園2018にて話した内容を記事として編纂 +その後の変化を加筆修正したものです。 スライドはこちら。 https://speakerdeck.com/kazuyaseki/seo-for-spa-cfb3706f-ae1d-4c6f-a83f-96dc2452f32b 追記 2019/5/8 遂に Google bot が扱うレンダリングエンジンが Chrome 最新版(現時点では 74)相当となりました！ https://webmasters.googleblog.com/2019/05/the-new-evergreen-googlebot.html ただタイムアウトなどのリスクは依然存在するので、信頼性を求めるならやはり Dynamic Rendering や SSR が選択肢になるのかなと言う気はしますが、そこまで要求が強くない場合にはあまり頑張らなくてよ
ReduxでAPIの通信の状態を共通で扱うTips(feat. typescript-fsa) - Qiita
APIコールが発生する処理を行った時にローディング中かどうかを示す loading なり fetching なりのフラグを用意すること、結構あると思います。これを様々なActionごとに逐一準備するのだるいのでまとめて用意する方法と、それをtypescript-fsa使うと意識すること一つ減るよという小ネタです。 考え方はこちらのブログのアイデア完全にお借りしていて、typescript-fsa前提だとAction Typeが必ず特定のフォーマットになるので幸せになったという話。 https://medium.com/stashaway-engineering/react-redux-tips-better-way-to-handle-loading-flags-in-your-reducers-afda42a804c6 typescript-fsaの非同期アクション typescript
すばらしきポケモンエコシステム⚡️ - Qiita
タイトルだけだと何を言っているのか意味が分からないと思うのですが、最近ポケモン図鑑を作っていて、その過程で思いの外ポケモン関連のエコシステムが充実していたので、発見したものを紹介いたします。 ちなみに私はXYまでは全作プレイしてました。スプラトゥーン沼のせいで時間がなくなり卒業しました。(自慢ですがウデマエXです) データ系 まずは要となるポケモンデータを管理してくれているパッケージたちを紹介します。この分野は競合がたくさんいるのですが、私が見つけた中で一番筋が良さそうだったのはこちらです。 GitHub - fanzeyi/Pokemon-DB: A Pokemon database in JSON format. 次のそれぞれの要素に対してのJSONがあります。 ポケモン アイテム ワザ タイプ 例えば私はクチートが好きなのですが、クチートのデータはこんな感じ。 { "base": {
ThriftでPython3にコンパイルするまでの道のり - Qiita
Thriftがpython3に対応してなくね?と思ったので調べてみました。 https://issues.apache.org/jira/browse/THRIFT-1857 あれ? Issueは fixed, closed になっているがこれは…。 よくて見てみるとver 0.10.0では対応していますが、最新版のリリースが現状(2016/11/23現在)では0.9.3なので、python3にコンパイルできないと。 最新版をチェックアウトするしかなさそうですね…。 チェックアウト git clone https://github.com/apache/thrift.git git branch -a //存在するbranchの確認 git checkout -b 0.10.0 remotes/origin/0.10.0
ちゃんと理解するCode Splitting - Qiita
Code Splitting、サボってきたのですが、必要になりそうだったので真面目に調べてみました。 これからCode Splittingやりたい方の入口的な役割になれれば幸いです。 Code Splittingとはなにか Code Splittingはその名の通り「コードを分割すること」を指します。分割されたコードはユーザのアクションに応じて非同期に読み込まれます。 ちなみにWebpackでentry point分けることとかもCode Splittingと言えばそうなのですが、本記事では触れません。また、別にSPAでなくともCode Splittingはパフォーマンス向上に利用できますが、これ以降はSPAを前提に話します。 Code Splittingの目的 Code Splittingの目的は初期表示にかかる時間、及びユーザがインタラクションできるようになるまでの時間の削減です。 S
世のフロントエンドエンジニアにApollo Clientを布教したい - Qiita
こんにちは。いかがコーディングお過ごしでしょうか。 私は今更ながら最近GraphQLで遊び出し、そしてApollo Clientに出会いました。 ワクワクしました。「これは想像以上に既存のフロントエンドの設計・実装を変えるものだぞ！」と感じました。 「Apollo ClientってGraphQLクライアントでしょ？GraphQLエンドポイントない俺には関係ないな。」と思ったそこのあなた、それだけじゃないんですApollo Clientは！！！！！ 本記事では「Apollo Clientとはなんぞや」という話と「なぜ私がApollo Clientを布教したいのか」という点について語ります。実は最初は実装含めたチュートリアルを書いていたのですが長くなり過ぎたため記事を二つに分けました。この記事はどちらかと言うと概念系の話が多めで、片方にApollo Client + Reactのチュートリアル
Vue.jsにおけるRender PropとScoped Slotsについて - Qiita
こんにちは。転職によりReact畑からVue畑に乗り換えることになったフロントエンドエンジニアです。 Vueでも描画関数使ってればRender Propsも使えるじゃんと思ったところ、Vue.js 作者のEvan You曰く「Render PropパターンはVue.jsにおけるScoped Slotsと同じ」とのこと。 In case you are wondering what’s the equivalent pattern in Vue, it’s called scoped slots (and if using JSX it works the same as React) — Evan You (@youyuxi) 2017年9月25日 本当にそうなのか簡単な実装例を用意してみました。 まず、そもそものRender Propを使う目的としては 「コードの再利用性を高めるための実
フロントエンドのコンポーネント設計に立ち向かう - Qiita
ReactやVueなどコンポーネントベースで作っていくViewのライブラリが普及したことで、コンポーネント指向での開発が一般化してきた昨今のフロントエンドですが、このコンポーネントの設計に悩まれる方も多いのではないでしょうか。 コンポーネントをどの粒度、どんな状態で分割するのが良いのか、などなど、特にチームで開発する時に認識が揃っていないとカオスになりがちな部分であると思うので、自分なりの設計をする際の指針を言語化しようというのが本記事の目的です。同じように悩まれている方にも何らか示唆を提供することができたら嬉しいです。 想定読者 「コンポーネント設計？なにそれ？おいしいの？」という方 初めてコンポーネント設計でアプリ作ってみたけど、本当にこれでいいのか自信の無い方 はじめに: "コンポーネント"とは まず最初に"コンポーネント"という言葉についてですが、ここでは「GUIのパーツをモジュー
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
