DEV Community

Cover image for I built a chat app using React and GraphQL

I built a chat app using React and GraphQL

Abdou Ouahib on April 28, 2021

TLDR You can try the app here: chat.abdou.dev You can view the source code in this github repo Intro About 4 months ago, I ...
Collapse
 
rafarochas91 profile image
Rafael Rocha •

What's your thought of using Apollo Client as a state manager for this use case?
Since the entities would be cached this could probably improve overall performance of querying new changes and reduce complexity by not having to maintain a redux store.
Nice article!

Collapse
 
aouahib profile image
Abdou Ouahib •

I am using Apollo Client to make GraphQL operations, I just don't use its hooks for state management, so everything is still being cached.

I never tried to use ApolloClient as a state manager, but if I wanted to, I would use it in some pages of the app that don't have a complex state, for example, the search page, where you just send a query and display the results.

For more complex stuff like messaging, I don't see how Apollo Client alone can do the job, you'll definitely need something more powerful.

Collapse
 
rafarochas91 profile image
Rafael Rocha •

I find that apollo client with a normalized cache object to be more than enough for this cases global app state. But I also can see the point of approaching a more familiar tool like redux. It's not a bad approach by any means.
I've used apollo client in realtime production ready client applications and it has fit a lot of different use cases, some of them more complex than p2p chats, like small interactive cooperative data visualization apps.

Thread Thread
 
aouahib profile image
Abdou Ouahib •

That's actually interesting, I'll definitely do more research on this subject. Thanks for the insights.

Collapse
 
aithaddouch_achraf_74820 profile image
Ait haddouch Achraf •

Great job bro 🙏🏼❤️ I love the story and application easy and smooth to use.

Collapse
 
vanderleisp profile image
vanderleisp •

I tried to test the demo, but after creating my ID then I couldn't do anything, as I don't have friends and also no previous conversation, so got stuck and couldn't move forward :(

Collapse
 
aouahib profile image
Abdou Ouahib •

You can create another account with another Gmail, and add yourself as a a friend :D that's what I did for testing.
You can also ask someone else to make an account so you can test with him.

Collapse
 
navneet7716 profile image
Navneet Kumar Singh •

dude that's super sick!

Collapse
 
kreely profile image
Dave Creelman •

Nice work. You're doing exactly what I want to do, move into web stuff. I'll look over the code later on.

Collapse
 
anridev24 profile image
Andronik Nazaryan •

Interesting story, and great app aswell really cool 😎

Collapse
 
tbell511 profile image
Tyler Bell •

This is awesome! What are you using to run your tests? The UI looks very nice.

Collapse
 
aouahib profile image
Abdou Ouahib •

Thanks, I used jest, React Testing Library for component testing, and ts-mockito for mocking.