"Effortless API Integration: SDK Generation as Best Practise", Nikita Galkin

Many developers create a separate layer for working with APIs, but Nikita believes that this approach is inefficient — it is better to generate code from your API contract. The talk will cover the following topics: how does SDK differ from API, and why is SDK preferable for development? How can you automatically generate an SDK for Swagger and GraphQL? What should you do if you don’t have an API contract? And finally, why is it important for backend developers to understand React? The talk will help optimize development processes and simplify team interactions, making working with APIs more predictable and convenient.

2. FRACTIONAL

3. AGENDA

4. Agenda 0
1.API Integration Pain
2.SDK vs API
3.Code generation for GraphQL API
4.Code generation for REST API
5.No API specifications ??????
6.One more reason to know React

5. API
INTEGRATION
PAIN

6. The pain 1 Interview question

Can you walk me through the best practices for
fetching and handling API data in a React
application? Specifically, what steps would you
take to ensure the solution is efficient,
maintainable, and user-friendly?

7. The pain 1 Typical Steps
1.?????? Create API Client
2.?????? Define Types for Input and Output Payload
3.?????? Validate Input and Output Data (e.g., using Zod or Joi)
4.?????? Transform Data if Required
5.⚙ Create the Hook with State Management
and Error Handling
6.⏹ Use AbortController for Cleanup
7.?????? Add Retry Logic for Network Errors
8.⏳ Add Loading Skeletons for UX Improvement
9.?????? Manage Cache for Performance Optimization

8. The pain 1 Typical solution
1.Fetch API
2.Axios (Axios-Retry)
3.RTK Query (Redux Toolkit Query)
4.React Query (TanStack Query)
5.Apollo Client

9. SDK vs API

12. Write code for
integration
Use SDK

13. SDK vs API 2 Use SDK

import Stripe from 'stripe';

const stripeClient = new Stripe('sk_test_12345', {
apiVersion: '2024-09-30.acacia',
maxNetworkRetries: 5,
});

const customers = await stripeClient.customers.list({
limit: 10
});

14. SDK vs API 2 API contract
API Contract (e.g., OpenAPI, RAML, Postman
Collections, GraphQL Schemas) describes:
●Endpoints
●Request/response models
●Authentication methods

15. SDK vs API 2 API contract
Company API Specification
SDK Languages
AWS
Smithy, OpenAPI JavaScript, Python, Java, Go,
Ruby, .NET, etc.
Azure
OpenAPI, OData Python, JavaScript, .NET, Go,
Java, etc.
Google Cloud
Discovery Document,
Protobuf, OpenAPI
Python, JavaScript, Java, Go,
Ruby, etc.
Stripe
OpenAPI JavaScript, Python, PHP,
Ruby, Java, .NET, Go

17. SDK vs API 2 SDK generation
1.Parse API Contract: Extract endpoints, models, and
data types.
2.Generate Code: Create SDK with models and API
wrappers.
3.Add Utilities: Authentication, retries, error handling,
logging, etc.
4.Documentation: Include inline API docs (e.g.,
JSDoc).

18. SDK vs API 2 Main ideas

●The API should have a contract defined as a
specification.
●Client integration code should be generated
from that specification.
●Code generation provides clear boundary
between integration code and application
code.

19. Code
generation for
GraphQL API

20. GraphQL 3 Codegen

21. Code
generation for
REST API

22. REST 4 Codegen
1.Redux toolkit Code Generation
https://redux-toolkit.js.org/rtk-query/usage/code-generation#openapi
2.React Query
https://tanstack.com/query/latest/docs/framework/react/community/community-projects#o
penapi-codegen
a.OpenAPI React Query codegen
https://openapi-react-query-codegen.vercel.app/

23. No API
specifications
??????

24. No specification 5 API Design First
1.Design-first means defining the API contract before
implementation.
2.Focuses on collaboration between teams (frontend,
backend, and stakeholders).
3.API contract serves as the single source of truth.

25. No specification 5 API Design First
•Faster Development: Parallel work for frontend and backend
teams.
•Clear Expectations: Ensures all stakeholders agree on API
behavior early.
•Improved Quality: Reduces misunderstandings and
mismatched expectations.
•Easier Testing: Enables API mocking and automated testing.
•Better Documentation: The API contract generates
documentation automatically.

26. No specification 5 API Design First
•Faster Development: Parallel work for frontend and backend
teams.
•Clear Expectations: Ensures all stakeholders agree on API
behavior early.
•Improved Quality: Reduces misunderstandings and
mismatched expectations.
•Easier Testing: Enables API mocking and automated testing.
•Better Documentation: The API contract generates
documentation automatically.

28. No specification 5 TypeSpec

29. No specification 4 TypeSpec

30. One more
reason to know
React

31. Alloy 6 TypeSpec

32. SDK vs API 6 Main ideas

●The API should have a contract defined as a
specification.
●Client integration code should be generated
from that specification.
●Code generation provides clear boundary
between integration code and application
code.

33. Time for your
questions!