Integre GraphQL com React usando Apollo Client: automatize consultas, mutações e cache de dados no frontend. Exemplo: useQuery para acessar dados em poucas linhas. #react #graphql #apolloclient #webdev #frontend

4. Apollo iOS Most popular GraphQL library for iOS. Features: - Type-safe Swift models - Query generation - Code generation - Async/Await support - WebSocket subscriptions - Cache management Installation Swift Package Manager File → Add Package Dependency Package: github.com/apollographql/apo… 5. Apollo Architecture iOS App ↓ Apollo Client ↓ GraphQL Server ↓ Database Apollo Client handles: Queries Mutations Subscriptions Caching Network layer 6. Apollo Setup Network Layer import Apollo final class Network { static let shared = Network() private(set) lazy var apollo = ApolloClient( url: URL(string: "api.example.com/graphql")! ) } 7. Writing GraphQL Queries Create: query GetUsers { users { id name email } } Apollo generates: GetUsersQuery Automatically. This is a huge advantage because: - No manual Codable models - Compile-time type safety #iOS #Swift #GraphQL #ApolloIOS #SwiftUI #UIKit #MobileDevelopment #iOSDeveloper #SoftwareEngineering #Programming #Tech #Apple #AsyncAwait #API #Develop

I built the Search Module to find specific variants without spamming the API. Used a custom debounce hook and handled the tricky logic of resetting the infinite scroll cache whenever the query changes. #ReactJS #GraphQL #BuildInPublic #ApolloClient

I refactored the fetch logic to move from page by page rendering to an infinite scroll. Used the Intersection Observer API Apollo Client’s fetchMore to keep the characters coming as you scroll. #RickAndMorty #ApolloClient #InfiniteScroll #ReactJS

Today, I set up Apollo Client for fast data caching and centralized my GraphQL queries to keep things lean. By defining strict TypeScript interfaces, I’m catching "undefined" errors before they can even happen. #ReactJS #TypeScript #GraphQL #ApolloClient #BuildInPublic

Oh gotcha that makes sense. In that case, those preload query refs would auto dispose after 30s (the default) so if your UI didn't mount in those 30s, they would get automatically disposed and cleaned up. So you would only really need to be concerned with refetchQueries within that 30s window. If you need to shorten this (generally not recommended), you can set it with the `autoDisposeTimeoutMs` option: new ApolloClient({ defaultOptions: { react: { suspense: { autoDisposeTimeoutMs: 10_000 } } } }); Just be aware this is set for all suspense-related hooks, so if you lower this value it could mean it suspends more if the query doesn't finish within that time window.

React依存を`@apollo/client/react`に分離しコアをフレームワーク非依存化、`ApolloClient`で`link`必須化/`uri`等のショートカット削除など。 エラーハンドリング刷新し`ApolloError`廃止しエラーごとに用意したクラスへ変更、Linkは関数からクラス化、RxJSを標準Observable実装に採用。

ApolloClientフル依存、メリットを考えると普通にアリなんだよな #ca_aab

🚀 Tired of REST? It’s time to level up with GraphQL! 🧑‍💻 Just published a blog post, Using GraphQL with React Native We’re talking seamless state management, fewer endpoints and making mobile apps blazing fast ⚡️ ☕️ Grab some coffee, click the link medium.com/@mkilincaslan/usi… #ReactNative #GraphQL #ApolloClient

new ApolloClient({ dataMasking: true }) npm i @‍apollo/client@next

Curious about why GraphQL is becoming essential for full stack developers? Check out my latest article on why mastering GraphQL can give you a competitive edge in API development. Read it here: medium.com/@jishnughosh2023/… #GraphQL #API #ApolloClient

graphqlの宣言型との相性の良さに感動している 意図してたのかはわからないけど、スキーマ定義とApolloClientの正規化キャッシュが体験良すぎる 加えてfragmentがあるのでさらにコンポーネントの凝縮度が上がり神すぎる

Hi there, Apollo Client maintainer here :) There is one thing in the article that needs a correction - when using `registerApolloClient`, you should use the `ApolloClient` and `InMemoryCache` classes that are exported from `"@apollo/experimental-nextjs-app-support"`, not from `"@apollo/client"` - and you don't need the `ssrMode` option. See github.com/apollographql/apo…

偉すぎる “Fragment Colocation with ApolloClient” by ta1m1kam techblog.shippio.io/fragment…

To setup the ApolloClient in your project, you can create an instance of it as shown below - Here we've created a new instance of Apollo client with your GraphQl backend's uri and cache - Also, we've exported the client instance.

Renamed exports In the past, the `@apollo/experimental-nextjs-app-support` package had two entry points, `/rsc` and `/ssr`. This has caused a lot of confusion, and both entry points have been moved together into the base entry point, `@apollo/experimental-nextjs-app-support`. On top of that, the Apollo Client React hooks (`useQuery`, `useSuspenseQuery`, etc.) no longer need to be imported from `@apollo/experimental-nextjs-app-support`, but they can be imported directly from `@apollo/client` now, while still being streaming-compatible. Also, a few exports have been renamed: - `NextSSRApolloClient` -> `ApolloClient` - `NextSSRInMemoryCache` -> `InMemoryCache` - `resetNextSSRApolloSingletons` -> `resetApolloClientSingletons` The old entry points with the old exports still exist and each of them has a `@.deprecated` docblock explaining the new import to use.

apollo clientでqueryとmutationできたのでsubscriptionを組み合わせてリアルタイムにしていこう。 ApolloClient良いな、queryとかそのまま書くだけで良い。

🚀 Mastering Apollo Client's cache is crucial for efficient data management and updates. Learn how to ensure successful cache updates and avoid unnecessary refetches. Thanks to bhanu prasad for the insightful guide! #ApolloClient #DataManagement #Efficie… ift.tt/tIR2a6B

graphql-codegen(またはApolloClient) の useFragment 使ってるコードのテストをちょっと考えているのだけど、mizdra さんの mizdra.net/entry/2023/09/28/… で紹介されてる graphql-codegen-typescript-fabbrica つかえば、fragment 用の factory も簡単に用意できそうだな