Hello Everyone 👋

TalentBolt is a user-friendly web app designed to help both individuals and businesses to make the hiring process smooth, you're looking for your dream job or seeking talented individuals to join your team so TalentBolt is for you!

Team Details

• Aman Janwani

Description of Project

Tech Stack

• Next.js

• Vercel

• Tailwind CSS

• Appwrite Cloud

  • Authentication

  • Database

Challenges I Faced

Current User

So, Due to the easy authentication provided by Appwrite, it was very easy for me to add the Google login feature to my app, But the problem that occurred for me was getting the current login user (I know there is a function but I didn't have any idea before) I tried too many things and failed as I was using the Appwrite for the first time so it was a struggle for me it almost too 2-3 days to figure it out (I even have a playlist on yt about whole process live will share at end of blog). At last, I took help from the Discord community which was so much helpful. Appwrite made getting current user so much easy Here is an example function:

const [currentUser, setCurrentUser] = useState(null);

 const getSession = async () => {
    try {
      const res = await account.get();
      setCurrentUser(res);
    } catch (error) {
      console.log(error);
    }
  };

Array Of Objects

So, After the problem of Currentuser, I faced only more problems of storing an array of objects I wanna store some data like this:

"projects" : [
    {
        "title" : "String",
        "Duration" : "String",
        "url" : "String",
        ...
    },
    {
        "title" : "String",
        "Duration" : "String",
        "url" : "String",
        ...
    },
    ...
]

In each document of users collection, this is very easy to do in Appwrite Local because it has the latest update of "Relation" which help us to link (create a relation) from one document to another in a various way like one-to-one, one-to-many, many-to-many, etc. but as I said it is not available in the cloud version to we need to use something else, I tried many ways but none worked so I again gone to the Discord community and the many people helped me there. So, what I did was first created an array of projects using useState(), then I converted that list in the string using JSON.stringify(projects) and saved that to the projects attribute in the user document, here is an example of me doing that:

const [projects, setProjects] = useState(JSON.parse(userData.projects).projects);

const handleSubmit = async (e) => {
    e.preventDefault();
    const res = await database
      .updateDocument(
        "DatabaseID",
        "CollectionID",
        "DocumentID",
        {
          projects: JSON.stringify({ projects: projects }),
        }
      )
      .then((res) => {
       console.log(res);
      })
      .catch((err) => {
        console.log(err);
      });
  };

Realtime

The biggest problem I faced was getting real-time data, to research over docs and even In discord but didn't find the right answer that I was looking for. the answer I found was:

import { Client } from "appwrite";

const client = new Client()
    .setEndpoint('https://cloud.appwrite.io/v1')
    .setProject('[PROJECT_ID]');

// Subscribe to files channel
client.subscribe('files', response => {
    if(response.events.includes('buckets.*.files.*.create')) {
        // Log when a new file is uploaded
        console.log(response.payload);
    }
});

But this wasn't working for me. So, I used some other methods for specific tasks to make it real-time, which I have shared in the playlist.

Public Code Repo

GitHub

Demo Link

Live Link

Demo Video

Figma Link

Figma

The Process

Okay So, first of all, A Big Thankyou to Team Hashnode & Team Appwrite for hosting this Hackathon, this not only helped me to learn new things in the coding world like Appwrite, Backend, Databases, and Next.js 13. I even took this as an opportunity to start content creation using my coding skills I recorded it the whole time when I was working on the Project and published that on my youtube channel also I got many ideas to work on and share on Youtube.f

So, Here is the Channel Link and the playlist:

Channel Link (I'm talking in the Hindi language.)

Playlist:

Thank You!