Antigravity Agent
9148c358d0
Topic_Agent/Topic_Blog/Topics/Topics_Biz/Topics_Meeting/Topics_Rag의 마크다운 지식 문서를 Topic_General/Topic_Programming/Topic_Graphic/Topic_Business 4개 카테고리로 재분류. - 중복 제거: frontmatter의 status:duplicate/merged + duplicate_of/redirect_to 필드로 자기 자신을 중복으로 선언한 리다이렉트 stub 1032개 제거, 완전 동일 내용 파일 472개 제거, 동일 파일명·다른 내용 충돌 시 더 큰(완전한) 버전만 유지(162개 제거) — 총 1639개 중복 제거. - 분류: 폴더 단위로 명확한 항목(AI_and_ML/Coding/Architecture 등 → Programming, Comfyui/Visual_Effects → Graphic, Topics_Biz/Topics_Meeting/사업 등 → Business, Poetic_Blog_Writing/창의성/Game_Design 등 → General)은 폴더 우선순위로, 나머지 혼재 폴더(Topic_Agent/Topic_Blog/Topics 루트/Thinking & Reasoning/Other/UI_UX_Assets)는 title/tags 키워드 스코어링으로 파일 단위 분류(불명확한 경우 General로 폴백). 원본 폴더명은 "From_*" 서브폴더로 보존해 추적 가능성 유지. - 최종 배치: Programming 2784 / General 1608 / Graphic 285 / Business 249 = 4926개 문서. - 에이전트 운영 상태(.astra/.agent/.obsidian/sessions/memory/_company/docs/lessons/_shared/src)는 지식 콘텐츠가 아니므로 재분류 대상에서 제외하고 원위치 유지. - Topics/Topic_email(상위 보호 폴더 Topic_email과 파일명 100% 중복) 삭제 — 보호 폴더 자체는 미변경. - 완전히 비게 된 Topic_Agent/Topic_Blog/Topics_Biz/Topics_Rag 폴더 제거.
3.4 KiB
3.4 KiB
id, title, category, status, source_trust_level, verification_status, created_at, updated_at, tags, tech_stack, applied_in, aliases
| id | title | category | status | source_trust_level | verification_status | created_at | updated_at | tags | tech_stack | applied_in | aliases | ||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| web-graphql-client-patterns | GraphQL Client — Apollo / urql / Relay 비교 | Coding | draft | B | conceptual | 2026-05-09 | 2026-05-09 |
|
|
|
GraphQL Client
3대 클라이언트 — Apollo (가장 널리), urql (가벼움), Relay (Meta, 강력하지만 학습곡선). 공통: codegen 으로 타입 자동 + cache 정책 명시 + fragment co-location.
📖 핵심 개념
- Codegen: schema → TS 타입 + hook 자동.
- Normalized cache: id 기반 객체 dedup.
- Fragment: 컴포넌트가 자기 데이터 spec.
💻 코드 패턴
Apollo Client + codegen
// schema.graphql + queries.graphql 작성 후
// codegen.yml
schema: 'schema.graphql'
documents: 'src/**/*.graphql'
generates:
src/__generated__/types.ts:
plugins:
- typescript
- typescript-operations
- typescript-react-apollo
config:
withHooks: true
// query.graphql
query GetUser($id: ID!) {
user(id: $id) { id email name }
}
// 사용
import { useGetUserQuery } from './__generated__/types';
function Profile({ id }: { id: string }) {
const { data, loading, error } = useGetUserQuery({ variables: { id } });
if (loading) return <Spinner />;
if (error) return <Error msg={error.message} />;
return <h1>{data?.user.name}</h1>;
}
Cache 정책
const client = new ApolloClient({
cache: new InMemoryCache({
typePolicies: {
Query: {
fields: {
orders: { merge(existing = [], incoming) { return [...existing, ...incoming]; } }, // pagination
},
},
Order: {
keyFields: ['id'],
fields: { items: { merge: false } }, // 항상 replace
},
},
}),
});
Mutation + cache update
const [createPost] = useCreatePostMutation({
update(cache, { data }) {
cache.modify({
fields: {
posts(existing = []) {
return [...existing, cache.writeFragment({
data: data?.createPost,
fragment: gql`fragment NewPost on Post { id title }`,
})];
},
},
});
},
});
urql — 가벼운 대안
import { useQuery } from 'urql';
const [{ data, fetching, error }] = useQuery({
query: GetUserDocument,
variables: { id },
});
🤔 의사결정 기준
| 상황 | 클라이언트 |
|---|---|
| 큰 앱 + 복잡 cache | Apollo |
| 가벼운 / Vue / Svelte | urql |
| Meta 스타일 fragment co-location 강제 | Relay |
| Server Components / RSC | graphql-request 또는 fetch |
| Subscription 많이 | apollo-client + ws link |
| 단순 fetch | tanstack-query + graphql-request |
❌ 안티패턴
- codegen 안 쓰고 string query: 타입 안전 0.
- fragment 안 쓰고 컴포넌트마다 큰 query: over-fetch + 중복.
- cache 정책 미정의 → list mutation 후 stale: cache.modify / refetchQueries.
- subscription 무한 reconnect 없음: 연결 끊겨도 모름.
- 모든 GraphQL 호출 서버 SSR: client 만 가능한 건 nullable.
- N+1 쿼리 그대로 노출: server 측 DataLoader 필수.
🤖 LLM 활용 힌트
- 신규 = Apollo + codegen + fragment.
- cache 정책은 도메인별 명시.