Firing multiple api calls at once - reactjs

Question

I'm struggling to find the right words to convey what I'm looking for in my research, so I thought I would ask the stackoverflow community. I am looking for best practices to create records in different tables at once.
An example would be, user registration. Say you need to create 6 records for that user when they sign up, which need to connect. By connect I mean in the sense that if a user and team were created on user registration, the userID would need to be included in the team's members array. So the records need to fire in order so the relationship is properly recorded. So user would need to be created first, then the team record so I can add the userID to the team's members. Also note that the user record would need to be updated later on (after the team's record is created) with the teamID under the user's teams.
So as you can see it feels a bit all over the place. Currently I have multiple API calls being fired on user submit. While I have this working using redux, firebase and react — I foresee a lot of potential errors happening and feel as if I am not doing this in the most efficient way. I want to do this correctly and happy to do the research, I'm just not exactly sure what I am looking for. I was hoping for some guides, information, search terms, etc — basically anything to help me understand this concept more throughly if that makes sense.

Answer 1

This is a perfect candidate for GraphQL and a backend that handles it properly. Take KeystoneJS for example. You could do a single create user and handle it all internally via the hooks system. You can also do nested creates / connects all in one mutation and KeystoneJS will take care of all of it for you if there are nested operations. For example you can create object A, then create object B in one mutation. It'll create B, then A, then connect A to B... with no extra work on your end. I just give this as a single example of a tool you can use. Here is an example mutation that Keystone just handles:
mutation CreateUser {
createUser(data: {
username: "test"
organization: {create: {
title: "test"
}}
})
}
Notice organization is created inside of the user mutation.
Yes, I think the best practice is to have your back end, whatever it is, do the work. It will fail if it bumps into an issue and clean itself up. Otherwise, it produces a positive response. I hope this is helpful...
For alternatives, since this is a pretty open ended question... I've also created a nestJS back end. That works great too, but it's a lot less opinionated with fewer built in solutions, so you do a lot more work (but it's more flexible). Any CMS should give you control over this (Strapi seems to be taking off... I just ran into too many bugs with it).