Vibe (GIF Chat App)

Vibe (GIF Chat App) Used AI

10 devlogs
10h 49m
Created by mattseq

### Pitch
V!be is a chat app where every message is a GIF — no text allowed. It turns conversations into a creative game of wit and timing, where picking the perfect animation is the key to getting your message across. Ready to speak a whole new language? V!be is your playground.

### Showcase
If you don't want to go to the trouble of installing this app or if you do not have an Android device, don't worry! You can still see the app in full in the latest devlog i posted, which includes a full video of almost every feature.

### AI Usage
AI was used for all READMEs, some frontend code, and a few times i got frustrated. Not vibe-coding (except maybe frontend), just snippets and help. I would classify it as 40% AI

Timeline

Ship 1

mattseq

3 days ago

mattseq Covers 10 devlogs and 10h 49m

Here's a picture or video for you so you can see how much effort and features went into this app! (This showcase does not include me selecting a profile picture by clicking on my pic on the profile page bc i do not want to show you my embarassing photo gallery)

Just released the apk on github. I'm calling it quits for now, gotta ship at some point and i dont think i can get any major update out so im going to stop wasting time on this (at least until after SoM).

commit message: fetch messages again when user sends their own message and cap the messages at 50, also used realtime to fetch chatrooms instead of fetching constantly at intervals. I think the Realtime problem might be on Appwrite's side. People have been complaining in their discord that the Realtime API is very unstable and constantly stops working. I might have to ship without it working. I'm going to move on to making push notifications (if i have the time before SoM ends)

Update attachment
Earned sticker

nvm it actually doesnt work :< it either doesnt connect or just doesnt get updates. i've tried everything, no luck. might need to switch back to using the web sdk.

Update attachment

FIXED REALTIME! heard on Discord that it was fixed but i had to do some other things first. Expo Go (the iOS app to test Expo apps) wouldnt work bc i needed to update my Expo to version 54, and then i switched from using the web SDK for Appwrite to the React Native SDK. there was something wrong with the way i was using expo constants for env vars. I'm not entirely sure how i fixed the Realtime, but i think it was bc of the switch from Appwrite to react-native-appwrite and also the fact that i made a React Native iOS platform on the Appwrite console for the project. im just happy its finally working after so long.

Update attachment
Earned sticker

upgraded expo, removed some unecessary or no longer used code and tried fixing Realtime (i thought it might have just been that i was using rows and columns when looking at the request when it was switched to tables and columns" a week ago with Appwrites new TablesDB but that wasnt it). also fixed something with the babel plugins

Update attachment

Added the profile pics to the messages and cleaned up the styles that i (and Copilot) had been writing within the components' HTML. Right now on my list is mostly under the hood stuff: upgrade expo, switch to the react native sdk for appwrite, fix Realtime and find out how it works for the react native sdk. Oh also I removed some code which fetches display names from the database by making it use already fetched data.

Update attachment

Started making places use the new profile pics. Started with the list of chatrooms, making the avatars be listed on each chatroom card instead of participant name. I did a similar thing inside the chatroom screen by replacing the list of participants in the header with the avatars. I also noticed that when I switched to Appwrite a while back I forgot to implement the email verification and password reset. I was working on another project using Appwrite and was going to implement it there and realized I didnt know how to and had never done it. So thats another thing on the todo list, along with fixing Realtime and switching to the react native sdk for appwrite

Update attachment

Added profile picture uploading. I was running into some errors earlier though about uploading the file. I got frustrated and ended up just asking Github Copilot. It made it manually POST to the appwrite REST API instead of using the SDK and formatted the image. It said the problem was that I was suing the web SDK instead of the react native SDK. I didn't want to switch to the react native SDK bc i would have to change how Appwrite Realtime works in my app.

Update attachment

So today I did something very important. I learned how to use cloud functions. I just made a basic one that replaces the KLIPY api call so the api key isnt built into the app. I also ran into a bug I saw earlier: ERROR [TypeError: Cannot read property 'getItem' of undefined]. I got really frustrated because it literally gives me no information so I asked Github Copilot which told me to switch from appwrite to react-native-appwrite but if i do that, appwrite's realtime doesnt work. It doesn't seem to actually affect anything in the app and it doesnt crash it either so I'm leaving it for now. I also added a nice README with a description, setup instructions and acknowledgements.

Update attachment
mattseq mattseq about 1 month ago
and i released the old Firebase version of the app on Github Releases: https://github.com/mattseq/vibe-react-native/releases/tag/v1.0.0

I spent all of yesterday switching the app from using Firebase to using Appwrite as its BaaS. I did this for three reasons: Appwrite is open-source and I can self-host it or put it on Nest; With Github Education, I can get the Appwrite Pro Plan for free; and Appwrite allows me free access to things like cloud functions, storage for files, push notifications and messaging, etc. It's a little lower level than Firebase and I had some problems with connecting it to the Appwrite Console and setting up Realtime for subscribing to new chat messages. I still haven't set up permissions (which is like Firebase's security rules) because it keeps giving errors and I don't know why. Also SoM was down yesterday so I couldn't make a devlog which is why this one's a little long.

Update attachment