Job Pulse

React
PostgreSQL
Supabase
Next.js

Job Pulse is a streamlined job application tracker that allows users to keep track of their job applications. Users can add, edit, and delete job applications, as well as view their application history. The application is built with Next.js and Supabase.

Source Code & Demo

Key Features

  • Add, edit, and delete job applications
  • View application history
  • Simple and intuitive interface

Code Highlights & Design Choices

Initially, I wrote my navbar as a server component because it used a server action to sign in a user. But because this component would be rendered on each page as part of layout.tsx, I had to refactor it to become a client component to stop each page from becoming a dynamic route.

Process & Workflow

My motivation for this project was to familiarize myself with Next.js and working with PostgreSQL, as I haven't worked with either up until this point. As such, I worked methodically from the ground up, first going through the Next.js documentation and tutorial, and then using Prisma to interact with my PostgreSQL database on Supabase. Other than that, I found that my previous experience working with React and Firebase helped me to get up to speed quickly.

Challenges & Solutions

Understanding the concept of server components and client components

I found that the best way to understand the difference between them was to build something and eventually hit that road block. Next.js's documentation was very helpful in this regard, but it was only after building a few components that I understood the differences. Server components are rendered on the server and are not interactive, while client components are rendered on the client and are interactive.

What I Learned

Working on this project allowed me to familiarize myself with Next.js and PostgreSQL. While I didn't directly write queries, (I used prisma) planning out my schema and model relations gave me a better grasp on working with SQL databases. While working on this project, I tried my best to keep the conventions of folder structure and modularity, which allowed me to scale the project easily. I also learned a lot about how authentication works with auth.js, so I would say that this project has taught me quite a lot.