ChirpBoard

MongoDB Technologies used
Home screen of the platform
Questionnaire to be filled before joining the platform
Status of the approval by admins
Admin approval dashboard
Platform notification on joining application status update
Home screen of the Platform
MongoDB Atlas Search results
Profile page of an user
MongoDB Search Dashboard Page
MongoDB Functions Page

🌈 Inspiration

ChirpBoard is a platform intended solely for LGBTQ+ individuals, providing them with a venue to express themselves through posts. The website invites users to discuss their thoughts, experiences, and opinions openly, establishing a friendly and accepting community. While the major emphasis is on creating meaningful conversations and interactions, ChirpBoard is devoted to introducing safeguards that promote user safety and well-being. By offering a dedicated platform for LGBTQ+ individuals to share their stories and engage with others, "ChirpBoard'' strives to build a sense of community, belonging, and empowerment

✨ What it does

ChirpBoard is a social networking tool intended particularly for LGBTQ+ folks. It allows users to publish posts and share their views, ideas, and stories with the community. Users can connect with others, engage in conversations, and explore content geared to LGBTQ+ interests. ChirpBoard seeks to foster a pleasant environment where users may celebrate their identities, seek help, and build meaningful connections within the LGBTQ+ community.

🔨 How we built it

We went all-in with the latest tech stack! We used Nuxt 3 and Vue 3 for the front end, bringing in that new and strong awesomeness. To keep things neat and streamlined, we adopted Unocss for our styling needs. For the database, we largely relied on the formidable MongoDB Atlas and its real-time capabilities. We even integrated Firebase for additional functionality and a seamless user experience. MongoDB Atlas was our trustworthy friend throughout the development process, delivering smooth data storage and retrieval. Together, these technologies formed the backbone of our strong and scalable ChirpBoard platform. 💻🚀

MongoDB

🔍 Search

MongoDB Atlas provides a fast (and a black-magic) way to search through the database.
We used MongoDB Atlas's Search offering to index our posts, which made us search through all the user posts in less than a second.
In our opinion, it is one of the most important UX enhancements of the platform.

🔐 Authentication (MongoDB Atlas Realm)

MongoDB Atlas Realm supports custom JWT authentication, which made it possible to log in using Firebase, and then we could just ship the JWT token from Firebase to MongoDB Atlas Realm Authentication to log the user in.

🛳️ Functions (MongoDB Atlas)

Functions are a great service provided by MongoDB Atlas, they run the code in the same region (and same data center) where the database is located, which means we are able to run queries and get results many times faster than we could on regular queries.
We rely on Functions entirely for critical operations, we have the following functions:
We even execute our search index aggregation on the functions, that's the reason we were able to achieve even more speed while searching for posts.
We have custom triggers, for example on user creation, which make sure our initial user document is added to the collection, storing all the metadata received from the JWT token during authentication.

🛡️ Data Access Rules

We store a lot of data in the database, including semi-sensitive data such as notification tokens, all of these are protected using MongoDB Atlas Realm's Data Access Rules.
This helped us quickly set rules into place so that even by any malicious query to the database, no one would be able to access the data except the user themselves.

🌐 Web SDK

Just having a database isn't enough, plus security is also a main concern when interacting with the database directly from the client.
We tackled this by using the web SDK that MongoDB Atlas provides, making it easy for us to directly mutate the data from the client, in a secure way.
This combined with the Data Access rules and by using Realm Authentication, the data was safeguarded from any malicious attacks.

📊 Data API

The Web SDK provided a tool to communicate with MongoDB Atlas, but for some features such as indexed data, we were able to leverage the Data API, which is used internally by realm to fetch out the information from the database.

🔼 Triggers

Since we use Firebase for first-party authentication, we need a way to sync the information to realm authentication.
- So, after we log in the user from Firebase, we directly log in the user to MongoDB Atlas Realm using the custom JWT token from Firebase.
After the user is created, we use the trigger on create user to create the user's initial document for the application in the database.

📈 Charts

We have used the Charts service to display various statistics about the platform.
Statistics are important for having the overall insight of the platform, using such data, we can find out if the platform is lacking somewhere is there are any decline in the user rate, or sudden jump to manage the infra.
Instead of implementing our own custom dashboard, we decided to use the MongoDB Atlas Charts offering, which is very powerful in itself. Using it, we monitor the total number of:
- Registered Users
- Pending Users to Register
- Total Posts on platform
- Post-creation timeline chart
- Total unique hashtags in use

Challenges we ran into

Custom metadata not being sent into the context of MongoDB triggers, such as Firebase user ID firebase-admin latest version throws an error in MongoDB Functions
- Error: Error while making request: lookup metadata.google.internal on 172.20.0.10:53: no such host metadata.google.internal:80. Error code: undefined\"."}')
Firebase push notification service sometimes doesn’t register itself inside MongoDB Functions, need to pre-initialize firebase-admin library
Took some time to get familiar with the values dashboard, and how to integrate them into functions

🔐 Authentication

The Authentication function trigger was hard to figure out as there was very limited information on what argument has been passed, and what the structure of the data passed, took us quite a lot of time to figure out the auth event.
- As there was no option to have in-function data logged or stored anywhere, we ended up posting the data to a Pastebin-like service, and understanding how actually the authEvent object was.

🔔 Notifications

While sending out notifications, the notifications were taking some time, took some time to solve, but was a configuration issue on our side, should’ve thought before playing with buttons, not an “Actual” issue per se, but the team struggled to find the root cause.
It had been a long time since anyone from the team had used Firebase FCM, the notifications which were being sent from MongoDB Atlas Trigger Functions were not triggering any web-based notification. Later we figured that when the website is open, Firebase FCM doesn’t send any notifications when the tab is open, fortunately, FCM provides a function to get notifications when the tab is open.

🔨 Building

We love to use PNPM, but unfortunately there seemed to be a bug with CF pages for the use of a custom PNPM version environment variable, so we reported it to the CF pages team and the guys were quick to fix it and gave us a workaround.
This week, we again tried to work with CF Pages, which had constant build failures, but this week we tried to get to the base of the issue and fixed it, so maybe next time, we can use CF pages for our deployments.

Accomplishments that we're proud of

We're proud of offering a safe area with rigorous user verification and privacy measures. The easy and user-friendly design makes it accessible to everyone. Real-time updates have created engaging conversations within the community. We've come a long way! 🎈

What we learned

Developing ChirpBoard taught us the value of inclusivity and user safety. We got insights into the challenges LGBTQ+ individuals face online and the significance of offering a supportive environment. We also honed our skills in making scalable web applications and managing user-generated content.

What's next for ChirpBoard

We have amazing plans ahead! Based on user feedback, we'll develop the platform by introducing private chat, event planning, and community groups. We'll also partner with LGBTQ+ organizations to provide essential resources and support. Our mission is to make ChirpBoard the ultimate LGBTQ+ social networking platform, encouraging the community to be their real selves. Let's fly higher! 🌟 .