Team Members

Technologies Used

We have also used many packages from pub.dev, have a look at dependencies in pubspec.yaml

Why we used Appwrite

• Free and Open source - Great Community and Support

• Function API is free - Usually, Functions are a paid feature in BaaS platforms

• Great cloud platform - Helps visualize how your app interacts with the database

• Built-in User Management - Appwrite provides built-in user management and authentication features, including user registration, login, email verification, password management, and OAuth support

Features:

Add Posts ➕

This feature is the main purpose of building this app in the first place. You can create posts on your own and also check out what other people are posting. To create a post, you need to select an image and also select the GitHub repository you are talking about in your post's caption.

The post looks like this. You can swipe right to reveal the attached image.

Upvote 🔼 and Share Posts 📤

Show some love! If you enjoyed a post, you can upvote and share posts on all of your favorite social media and messaging apps like WhatsApp, Instagram, Twitter, etc.

Repository Search 🔍

If you wish to share an interesting repository you've come across, you can easily search for it within the app while creating a new post! Just click on the desired repository, and GitSafari will automatically retrieve its GitHub link and preview the image for you!

We utilized the search endpoint of the GitHub API to gather all pertinent information about a GitHub Repository.

You can read the relevant documentation here.

Opengraph Repository Previews🖼️

For generating the Repository Preview images, we talk to a special endpoint: GitHub Opengraph. This enables us to display updated information about a GitHub Repository on the fly.

Caching for Posts 💾

Just like numerous other social media platforms that cache images to minimize network requests, we utilized the cached_network_image package to cache images. This enhancement significantly improved both the app's performance and network usage.

Dynamic Language Icons 🔣

As you can see, the app displays the icon representing the tech stack of the repository in the top right corner. It's quite impressive, as we have added an icon for every possible tech stack.

Resources for contributing to the repository 📚

Let's say you find a repo on GitSafari and you want to contribute to it but do not know the technology it was built in, so you can tap on the roadmaps button next to the upvote and share button on the posts and you can get custom resources to learn that tech stack.

Stories 📰

Whether it is a bug that you resolved or a feature that you have added, you can share your small successes and failures by posting a story just like you do on Instagram. This place will also be a goldmine for Programming Memes and some geeky humor. 😉

These stories disappear 24 hours after being posted, just like on Instagram. This functionality is enabled by the Functions API, which records the time a story is created and deletes it if it surpasses the 24-hour mark. This function runs every hour.

Sign In with GitHub 🔐

Users can log in or sign up directly through GitHub OAuth, eliminating the need to create an account on GitSafari and enter all their details. We utilized the Account API to establish the OAuth session.

Add your custom bio ✍🏻

Describe yourself in a few words! This is made possible by the User Preferences feature where you can assign a set of key-value pair to every user.

Isar Database for local data persistence 📂

We store essential information such as name, username, and email in a local persistent database to enhance performance and reduce the number of network calls. We intend to expand this by storing even more information offline as part of our offline-first approach.

Usage of Appwrite

1. Account API 🔑

   Used to authenticate users and also login via third parties like GitHub

2. Database API 🗃️

   We have 2 databases, Posts and Stories

3. Storage API 💾

   We have 2 buckets, one for storing Post images and the other for storing story images

4. Functions API 🔧

   Used to vanish stories after 24 hours of creation. The function we used is scheduled to run every hour (Scheduled using cron syntax 0****). It checks all the stories every hour if they are older than 24 hours, if yes, then it deletes them.

Future<void> start(final req, final res) async {
  final client = Client();
  final database = Databases(client);

  if (req.variables['APPWRITE_FUNCTION_ENDPOINT'] == null ||
      req.variables['APPWRITE_FUNCTION_API_KEY'] == null) {
    print(
        "Environment variables are not set. Function cannot use Appwrite SDK.");
  } else {
    client
        .setEndpoint(req.variables['APPWRITE_FUNCTION_ENDPOINT'])
        .setProject(req.variables['APPWRITE_FUNCTION_PROJECT_ID'])
        .setKey(req.variables['APPWRITE_FUNCTION_API_KEY'])
        .setSelfSigned(status: true);

    Future result = database.listDocuments(
        databaseId: STORY_DATABASE_ID,
        collectionId: STORY_COLLECTION_ID);

    result.then((response) {
      List docs = response.documents;
      DateTime nowtime = DateTime.now();
      String temp = "";
      DateTime fetch;

      for (int i = 0; i < docs.length; ++i) {
        temp = docs[i].data['createdAt'];
        fetch = DateTime.parse(temp);

        if ((nowtime.difference(fetch)).inHours > 24) {
          database.deleteDocument(
              databaseId: STORY_DATABASE_ID,
              collectionId: COLLECTION_ID,
              documentId: docs[i].data['\$id']);
        }
      }
    });
  }

  res.json({
    'areDevelopersAwesome': true,
  });
}

1. Avatar API 🖼️

   Used to dynamically generate profile pictures for users. In the future, we are planning to integrate Avatar API with more third-party services like Gravatar to fetch user profiles.

File Structure

.
├── android # android files
├── assets # assets (images)
├── ios # ios files
└── lib
    ├── api # Logic for handling Appwrite and GitHub APIs
    ├── models # Custom Models
    ├── screens
    │   └── home_tabs # Tabs for home screen
    ├── utils # Api info and Local DB Logic
    └── widgets # Custom widgets

Challenges We Faced

We often use features like these on social media apps, and it's actually a pretty tough job to create them from scratch (but it's also a lot of fun! 😄).

One of the first challenges we faced was figuring out the entire project structure and keeping the code as readable as possible. Our goal was to make it super easy for future contributors to join in and help out with the project 🤝. So, we made sure to keep a neat and tidy folder structure 📁.

Honestly, we have gained a whole new level of appreciation for developers who've worked on similar applications 🙌.

Future Work

• Recommendation Algorithms for users' feed, according to the users' preferences

• GitSafari for Recruiters - GitSafari will become a LinkedIn but for open source and remote work

• Add Section for Frequently Occurring Errors - A section to discuss and resolve any issues encountered by new contributors while setting up contributing to a new project.

Code

GitSafari: GitHub Repo

We would love for you to find issues and even contribute to this repository. See you there!

Conclusion

In conclusion, GitSafari is a social networking platform designed specifically for open-source developers, enabling users to discover and share projects, contribute to repositories, and connect with like-minded individuals. Leveraging Appwrite's API and other technologies, GitSafari aims to create a seamless experience for developers and foster a community centered around open-source collaboration. Future enhancements include recommendation algorithms, a platform for recruiters, and a section for discussing frequently occurring errors. Lastly, Thank you for reading our post! ✨We hope you found GitSafari interesting and useful. Please feel free to share your comments 💬 or feedback with us. We'd love to hear your thoughts! 😊