タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。
Fragment をコンポーネントのトップに置くな「Fragment をコンポーネントにトップに置く」というのは下のようなコンポーネントを作成することを指します。 export const MyComponent = () => { return ( <> <h1>This is a sample code.</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Dui
GraphQLのFragment活用テクニック: colocationとmasking こんにちは。N 予備校 Webフロントエンド開発チームの中村です。 現在開発中のZEN CompassではGraphQLを採用しました。我々のチームでは（そして私個人としても）GraphQLを採用したのは初めてだったのですが、実際に設計を進めていくうちに色々と知見を得ることができました。今回はその中でも特に重要だと思った、GraphQLのFragmentという仕様を活用したコンポーネント設計のテクニックについてお話ししようと思います。GraphQLを使用したWebアプリケーションに興味がある方にとって何か参考になりましたら幸いです。 【ZEN Compass】 学習者を導く先生方などが利用するコーチング支援Webサービスです。 LMS(Learning Management System)として学習状況
About me - id: @Quramy (GitHub, X) - ৬छ: Web ϑϩϯτΤϯυΤϯδχΞ - Quramy ͱ GraphQL: - GraphQL Tokyo ͱ͍͏ Meet up Λෆఆظ։࠵͍ͯ͠·͢ - ͜͜5 ~ 6Կ͔͠Βͷ GraphQL ͳҊ݅Λ͍ͬͯ·͢ (ຊۀ/෭ۀ) Client Side: @apollo/client + React or Vue Server Side: @apollo/server or graphql-ruby + Rails - ts-graphql-plugin ͱ͍͏ϑϩϯτΤϯυ͚ͷπʔϧΛϝϯςφϯε͍ͯ͠·͢ https://github.com/Quramy/ts-graphql-plugin
この記事は Money Forward Engineering 1 Advent Calendar 2022 11 日目の投稿です 🎄 昨日 10 日目は cabossoldir さんによる 『コードレビューのとき、私は何をレビューしているのか？』 でした。 🙈 TL;DR Fragment Colocation とは、コンポーネントが必要とするデータを Fragment にまとめてコンポーネントと同じ場所に配置 (co-locate) すること Fragment Colocation を導入することで、「Query や Mutation を実行するコンポーネント」と、「それらの結果を必要とするコンポーネント」との関心の分離ができる Query, Mutation, Fragment はそれを実行するあるいは必要とするコンポーネントと同じファイル内に宣言すると依存関係が見やすく、変更が
デベロッパーのNIHIL INANE STUDIOは8月30日、『LOST FRAGMENT – 失われた欠片』を発表した。開発にはUnreal Engine 5が採用されており、公開された動画を見たX（旧Twitter）ユーザーを中心に注目を集めているようだ。 『LOST FRAGMENT – 失われた欠片』は、サバイバルホラーゲームだ。公開された動画は荒廃した病院が舞台となっており、「ナースステーション」といった表記から日本の病院と見られる。動画は拳銃を片手に病院の内部を散策する主人公の視点で描かれている。動画の前半では日が差し込んでいた風景も、後半では一変。突如として闇が包み込み、不穏な物音が周囲から聞こえるようになる。動揺する主人公が音を発していた物体の正体を突き止めようとするところで、動画は終わっている。 本動画は、公開後すぐさまXユーザーからの注目を集めているようだ。ユーザーの
最近用語集のようなページを作る機会があった。それぞれの用語の名前と説明がバーっと並んでて、説明部分は <details> 要素で隠されている。用語の名前をクリックすると <details> が展開されて、説明部分が読める、といった感じ。 用語集ページの例 他のページから特定の用語の説明に飛べるように、用語を表す要素それぞれに id 属性が振ってある。例えば https://glossary.example.com/#javascript という URL でアクセスすると、「JavaScript」の用語がある位置にスクロールした状態で、用語集ページを開ける。 ただ (一部ブラウザで) https://glossary.example.com/#javascript でアクセスしても、JavaScript の説明の欄が閉じたままで困っていた。その用語の説明が見たいがためにしてきているので、最初
TL;DR 考え方 コンポーネントとセットで、そのコンポーネントが必要なデータを Fragment で宣言する、React の宣言的 UI に合わせた宣言的データ取得（declarative data-fetching）という考え方 Component Scopedに取得データを宣言することで「そのコンポーネントで必要なデータはなにか」を管理しやすくなることで、under-fetching / over-fetching が抑制でき、変更にも強くなる お悩みポイント Fragment-scoped な変数を定義するための標準機構がない Relay は directive を利用した独自の機構を持つ 便利そうなライブラリ graphql-anywhere クエリ結果を Fragment の形に整形する not actively support apollo-link-fragment-arg
Fragment-based in silico創薬とは？Fragment-based 創薬（フラグメントベースの薬剤開発（FBDD）)とは、コンピュータを使って新しい薬剤を設計・開発する手法の一つです。この手法では、小さな分子の断片（フラグメント）もしくは既存のリガンドの断片を使用して、断片を伸ばしたりして、薬剤の設計や最適化を行います。このようなフラグメントベースのアプローチは、複雑な分子間相互作用を解析し、既知の薬剤からさらに活性のある新しい薬剤の設計を効率的かつ費用対効果の高い方法で行うことができます。また、実験的なスクリーニングや化学合成の手間や費用を削減することができるため、創薬のスピードや効率を向上させるのに役立ちます。 ACFIS2.0とは？ACFIS（Auto Core Fragment in silico Screening）サーバーは、FBDDにおいて潜在的な薬剤リー
はじめに この記事では GraphQL の Fragment Colocation という考え方を紹介します。 REST を使用していた頃から不満に感じていたものの、解決が難しいと感じていた課題が Fragment Colocation で見事に解決されたため GraphQL を使用している場合必ず知っておいた方が良い概念だなと思います。 また、前提としてこの記事では Apollo（もしくは Urql 等のデータフェッチライブラリ）を使用していることを想定しており、サンプルコードは React で記述しています。 Relay を使用している場合フェッチデータの宣言をデータを使用するコンポーネントで記述することが強制されるため、自然と Fragment Colocation を使用した実装になります。 この記事で書くこと Fragment Colocation の紹介・基本概念の説明 この記
こんにちは。@KeithYokoma です。今回はこれまでの投稿からは少し話題を変え、AndroidX Fragment ライブラリに関する問題の発見と解決にまつわることを解説しようと思います。 画面の状態を保存する時に TransactionTooLargeException が多発し始める 以前の記事でも紹介しましたが、ギフトモールアプリでは次のような構成で画面を実装しています。この構成で Unidirectional なデータフローを作ることが第一の目的ですが、SavedStateHandle を組み合わせることによって ViewModel の状態の保存と復帰も実現しています。ギフトモールアプリでは ViewState で ViewModel の状態を表現しているため、ViewState の保存と復帰を共通化しています。 // 共通のベースとなるインタフェースと ViewModel
This article introduces the in silico drug discovery technique called Fragment-based Drug Design (FBDD). It explains how to use the FBDD software ACFIS 2.0 to discover drugs for Parkinson’s disease on your own computer and also provides specific compounds as examples. By learning about it, you can understand the latest drug discovery technology, ACFIS 2.0, and experience drug discovery on your own
はじめまして、NewsPicks Web Product Unitのじゆんきち(@junkisai)です。 弊チームでは、ここ1年間くらいWeb 版のNewsPicksを新しい基盤に置き換えるプロジェクト（以降、リアーキプロジェクト）を進めています。 新 Web 基盤のフロントエンドはReact (Next.js)+TypeScriptを採用しており、バックエンドとの通信にはGraphQL(Apollo) を採用しています。 今回はFragment Colocationという考え方を導入したら、これまで抱えていた技術的な課題が解消され、開発スピードが向上したお話をしようと思います。 導入前の課題 課題1. BFFとの通信回数が多い 課題2. クエリを書く際に必要な項目が漏れていたり、不要な項目が残ったままになる 課題3. ドメイン知識をもったコンポーネントの振り分けルールが曖昧 そこでFr
FragmentManager.popBackStack()で、ひとつ前の画面へ戻すことができますが、いくつか飛ばして、最初の画面に戻したいことがあります。 結論から言うと以下の対応で可能です。 //ルート画面に戻る val rootEntry = parentFragmentManager.getBackStackEntryAt(0) parentFragmentManager.popBackStack( rootEntry.id, FragmentManager.POP_BACK_STACK_INCLUSIVE ) なお、それまでの画面遷移の際には、以下のようにBackStackに追加している前提です。 parentFragmentManager.commit { addToBackStack(null) replace(R.id.container, nextFragment) }
はじめに Streamlit は UI 操作の度にコードの再実行が走ることを特徴としています。これによりセッション状態の管理などが大幅に軽減されるのですが、重い処理がある場合に UX の低下を招きかねません。 実際私も下図のように、重い処理を含む際のセレクトボックス操作でよく重たい印象を与える処理を記述してしまいがちです。 上図の Playground そこで Streamlit は、キャッシュやセッション状態管理、フォーム、特定の関数のみの再実行など多様な機能を提供しています。 というわけで個人的に長年の悩みだったので、いくつかのパターンで検証してみます。 結論 個人的には比較的新しい機能であり特定の関数のみ再実行できる st.fragment が実装も簡単で、理解もしやすかったです。 上図の Playground 検証 検証コード（ベース）😑 それでは最初に示した重い実装からみていき
2023年10月から2024年3月まで開講された 「藤原ヒロシの特殊講義 非言語マーケティング」の内容を 再編集した講義録がついに完成。 90年代に「裏原宿」というカルチャーを築いた後は ファッションの枠を超えて支持され、 ナイキ、ポケモン、スターバックス、ルイ・ヴィトンといった 世界的な企業から常に求められ続けている HF流のアイデアの作り方や育て方、 コラボレーションに対する姿勢やコミュニケーションのスタイルを分析。 歩んできた歴史や数々の仕事の事例を抽出しながら学術的に体系化した、 すべてのビジネスパーソン必読の一冊です。 『FRAGMENT UNIVERSITY 藤原ヒロシの特殊講義 非言語マーケティング』 藤原ヒロシ著 ／ ¥2,200（税込）／ 2025年2月26日（水）発売 DAY1 文化人類学 ―遊学史― DAY2 社会学 ―メディア論― DAY3 情報学 ―交友研究― D
フェンダー、藤原ヒロシ主宰のfragment designとのコラボモデル“fragment Telecaster”を発売 2024-11-21 フェンダーより、ファッションならびに音楽プロデューサーの藤原ヒロシが率いる「fragment design」とのコラボレーション・ギター“fragment Telecaster”が発売される。 発売日は2024年12月6日（金）で、Fender Flagship Tokyoでは先行して11月6日（水）より予約販売が開始されている。価格は385,000円（税込）。 特別なローズウッドがあしらわれたテレキャスター 60年代のテレキャスターをベースに、藤原ヒロシのこだわりを随所に反映した“fragment Telecaster®”。 ヘッドとボディトップにはローズウッドがあしらわれ、指板もドットポジションのないローズウッド指板だ。ボディはこのモデルのた
Photo by krakenimages on UnsplashA solid understanding of how Fragment works is essential when one working with Android Development. However, Fragment is still a complicated subject, and one can commonly miss out on something. Mistake makes when working in Fragment sometimes are hard to debug, as it is not always replicable due to its complicated lifecycle event. However, some of those issues coul
Fragment filmu wrzuconego przez ruskich. Czy tylko mi się wydaje, że ten operator kamery jest wyjątkowo odważny i i… https://t.co/Bw9hSfbYFB
viewLifecycleOwnerLiveData を使って Fragment の onDestroyView() で自動で null がセットされる ViewBinding 用の property delegates を作る
viewLifecycleOwnerLiveData を使って Fragment の onDestroyView() で自動で null がセットされる ViewBinding 用の property delegates を作る ViewBinding のドキュメントでは Fragment で使う時の実装はこのようになっています。 class LoginFragment : Fragment() { private var _binding: FragmentLoginBinding? = null private val binding: FragmentLoginBinding get() = _binding!! override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInsta
普段 GraphQL を使ったフロントエンド開発をしています。最近 GraphQL Code Generator の設定を見直しており、いくつかの plugin や preset を採用したり削除したのですが、その中でも gql-tag-operations-preset がとても良かったので、もともとの構成と gql-tag-operations-preset を導入した後の構成を比較して記事に残しておきます。 また、 gql-tag-operations-preset を導入することで、 Relay 以外の GraphQL Client でも Fragment Colocation が扱いやすくなります。 私は Apollo ユーザーなので Relay の Fragment Colocation を原則とした開発体験を羨ましく思っていたのですが、 Apollo でも少し近づいた開発体験
Anker Prime Wall Charger (100W, 3 ports, GaN) FRAGMENT Edition プロが選ぶ、充電器。 藤原ヒロシ氏が率いる「fragment design」と Ankerが初のコラボレーション。 fragmentとの特別なコラボモデルとして、 外出先でノートPCを使用するクリエイターや、 洗練されたビジネスマンに最適なセレクト。 ブラックを基調としたカラーリングに、 fragmentとのコラボロゴと、 稲妻デザインを施した数量限定モデルです。 藤原ヒロシ氏コメント 僕はどこにでもMacBookを持ち運んで 好きな時に仕事をしたいタイプなので、充電が減ると心配になる。 Anker製品は以前から使っていて、 初めて使った時はその充電の速さに驚きました。 コンパクトだし今はどこにでも持ち運んでいます。 でも、急速充電の良さってあまり知られていないよう
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
Good components are reusable. And reusable components don't make assumptions about where they will be used. This means a few things: 1. Components should not have an effect outside of their boundaries. This is well explained in “Margins and Composability in CSS” by @giuseppegurgone and “Margins considered harmful” by @mxstbr. 2. Components should not implicitly rely on their context. Recently, dur
<fragment> と FragmentContainerView では Fragment のライフサイクルメソッドの呼ばれるタイミングが違う
<fragment> と FragmentContainerView では Fragment のライフサイクルメソッドの呼ばれるタイミングが違う 動作確認は androidx.fragment:fragment-ktx:1.2.5 でしています。今後のバージョンで動作が変わる可能性があります。 fragment-ktx:1.2.5 で <fragment> を使うと FragmentContainerView を使うようにメッセージがでます。 このメッセージに従って FragmentContainerView に変えたとして、大体は問題ないと思いますが、問題が起こる場合もあります。 <fragment> と FragmentContainerView で Fragment のライフサイクルメソッドの呼ばれる順番を確認してみます。 class MainActivity : AppCompat
株式会社セブンシーズ・パスタは、8mmフィルム風の懐かしい映像を再現するデジタルトイカメラ「Fragment8」を発売した。 Fragment8は、60年代の8mmフィルムの特徴と現代のデジタル写真技術が組み合わさったデジタルトイカメラです。 カメラの数字「8」は、1932年にコダック社が開発し、映画に広く使われた「8ミリフィルム」を表しています。 8ミリフィルムの独特の色や不完全さが、見る人に懐かしさを感じさせます。 Fragment8最大の特徴は、GIFとMOVIE(最大120秒の動画撮影)の撮影が可能な点。ボタン一つで撮影モードが切り替わります。他、9FPS/24FPSの切り替えでテイストの異なる写真を撮影することもできます。
課題 Activity/FragmentでFlowを使う時、受け取り方がいくつかあるっぽいので整理。 具体的にはMVVMでイベント・状態を受け取る時、今までRxやLiveDataでやっていた部分はどう置き換えられるのか。 実装 launchを使う 一般的にFlowを受け取る時に使うlaunch/collectを使う方法で、DESTROYED になった時は lifecycleScope により自動でキャンセルされる。 リソースを考慮してSTARTED で収集し STOPPED でcollectをキャンセルする場合、つまりバックグラウンドに行った時はFlow出力を処理しない場合には自前で実装する必要がある。 override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) lifecy
barato HGH Fragment 176-191 2 mg - http://url-qr.tk/HGH Fragment 176-191 2 mg - aonde comprar HGH Fragment 176-191 2 mg - Calidad y dosificación farmacéutica. - Productos 100% legales. barato HGH Fragment 176-191 2 mg - Entrega rápida garantizada. - Diferentes métodos de pago: MasterCard / Visa / AMEX / PayPal / BitCoin aonde comprar HGH Fragment 176-191 2 mg ______________________________________
はじめに ReactやVueが世の中を席巻している昨今、Webアプリケーションの世界ではコンポネント分割、宣言的UIが当たり前のように取り扱われるようになりました。 これまでのRailsのような一般的なMVCフレームワークの世界では、Viewは一つの大きなページを指し示していることが大半でしたが、現在ではいわゆる「見た目」は、小さなパーツに分割した状態で管理されることが大半です。 Webサイトの改善活動も、ページ単位での価値評価からコンポネント単位での評価へシフトしています。 Styled ComponentやCustom Hooksなど、「どのようなデザインであるか」、「どのような挙動をするか」などの情報をコンポネントに閉じ込め、そのコンポネントにまつわる興味関心が外にもれないようにする手法が多くあります。 ところで、これらの点に関してはどうでしょうか？ コンポネントがどんなデータを欲す
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
