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
 
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
 
navneet7716 profile image
Navneet Kumar Singh

dude that's super sick!

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.