Generate Strongly Typed React Components With GraphQL
When developing in React, using a type system (like Typescript or Flow) can be a great help. You can be sure that your props and state are what you expect at build-time and code your components to match. But what happens when you’re calling to an API to fetch some data and the shape of that data is what really matters? Maybe the data get passed as props to a child component? You can create types for this, sure, but are they correct? Probably not! Or at least, probably not for long! Things change. Wouldn’t it be great if your types changed too?
The thing is, there is already a great way to get data that is based on type definitions. It’s called GraphQL, and it’s awesome (if you’re new to this, check out an introduction). Your schema holds the types, and your queries return data in a set shape defined by the client — not arbitrarily from the server. This is a pretty nice benefit. Maybe we could use the schema and queries to properly generate types that we can use in our client. That would be pretty sick. https://goo.gl/BScdfp
It’s Hard to Go API Define First
#ICYDK: Last year, I started saying API define first, instead of API design first. In response to many of the conversations out there about designing, then mocking, and eventually deploying your APIs into a production environment. I agree that you should design and iterate before writing code, but I feel like we should be defining our APIs even before we get to the API design phase. Without the proper definitions on the table, our design phase is going to be a lot more deficient in standards, common patterns, goals, and objectives, making it important to invest some energy in defining what is happening first, then iterate on the API definitions throughout the API lifecycle, not just design.
I prefer to have a handful of API definitions drafted before I move onto to the API design phase: https://goo.gl/EmEFAU
