Lecture Notes: ReactJs & GraphQL Relays

My lecture notes:

 REACT AND GRAPH QL RELAYS MEETING
   night of 10/10/2023
   at ReactJs Dallas monthly  (reactjsdallas.com)
   by Rigre Garciandia — React Relay - Unlocking GraphQL's Full Potential

   source code: https://github.com/rigrergl/react-relay-demo

---------------------------------------------------------

REACT RELAY:   
  Dev Kit at:   https://relay.dev/
  working example:  https://codesandbox.io/s/relay-sandbox-nxl7i?file=/src/TodoApp.tsx

  1) Server state management
  2) GraphQL partner
  3) Used at Scale

  Why Use?
    A) Locally
         a) co-locate
         b) component code
         c) encapsulation
    B) Globally
         a) static query generation
         b) "de-duplication"
         c) fragment flattening

  Pros: 1) GraphQL specific, 2) Optimized for scale, 3) Typed data
  Cons: 1) GraphQL specific, 2) Learning curve, 3) Verbose
  Use Case: 1) Working with GraphQL, 2) Large scale, 2) Performance is critical

---------------------------------------------------------

GRAPHQL:
  1) Used opposite of RestAPI
  2) one endpoint for all
  3) clear data dependencies
  4) avoids over fetching
  5) avoids under fetching
  6) really a "GET" of sorts

---------------------------------------------------------

typical Relay syntax:

const Account Page = (props: Props) => (
  const user = useFragment(graphq' fragment AccountPage_user on
                            user {login }; props.user);

---------------------------------------------------------

important files are: 1) schema.graphql  2) RelayEnvironment.ts 3) main.tsx

mutations (update, insert, delete):  useMutation(graphql' mutation   

avoids dependencies by masking