/Chatly

Primary LanguageTypeScript

Chatly 🎃

1

About the project! 🎨

Mobile chating app built with React Native, Apollo, GraphQL, GraphQL PubSub . Main goal was to try out doing mobile dev with RN. Turned out pretty fun!🤗

Things that were new for me:

  • React Native
  • Expo
  • GraphQL PubSub
  • Didn't have much experiance with Apollo before

Main Screen

On the main screen there are 2 main things:

  • List of user's available rooms
  • Bottom Tab which gives info about logged in user + let's log out

When we join one of the room, and then leave we will still get notification about upcoming messages. It happens like that cuz even when we leave the room, we're still subscribed to the last chat.

mainscreen mainscreen-Not

Chat Room Screen 👀

It simply uses Gifted Chat ( https://github.com/FaridSafi/react-native-gifted-chat ) for UI. Consumes the messages + typing subscriptions. So it is visible when someone is typing in the chat. New messages are shown instantly.

1 2

Login/Register Screen 🔑

Used Formik + UI Kitten for inputs/buttons. The token after loggin in is stored in Async Storage + In the memory ( Context API ).

login register registered loginin

Stack

  • Expo

  • UI Kitten

  • React Native

  • React Hooks API

  • Context API

  • Phoenix Socket

  • Async-storage

  • GraphQL

Todo ⛏

  • Make themes

  • Refactor auth page