Mini Job Board

A full-stack web application built with Next.js and Supabase that allows companies to post and manage their job openings and users to browse and filter them.

✅ Features Implemented

• User Authentication: Secure sign-up, login, logout, and forgot password functionality handled by Supabase Auth.
• Post Jobs: Authenticated users can create new job postings through a protected route.
• Browse & Filter Jobs: A public-facing homepage displays all job listings. Users can:
  • Search by keywords in the job title, company name, or description.
  • Filter by a specific location from a dynamically populated dropdown.
  • Filter by job type.
• Job Detail Page: Users can view the full details of any job by navigating to its dedicated page.
• User Dashboard & Ownership:
  • The main page automatically becomes a "My Posted Jobs" dashboard when a user is logged in, showing only the jobs they have created.
  • Users can edit their own job postings.
  • Users can delete their own job postings.
  • Ownership is enforced on the backend using Supabase's Row Level Security (RLS) policies, preventing users from editing or deleting jobs they don't own.

🛠️ Tech Stack

• Frontend: Next.js 14
• Backend & Database: Supabase
• Styling: Tailwind
• Deployment: Vercel
• Icons: React Icons

🚀 Running the Project Locally

To set up and run this project on your local machine, follow these steps:

1. Clone the Repository & Install Dependencies:

git clone https://github.com/alfin06/mini-job-board.git
cd mini-job-board
npm install

2. Set Up Supabase:

• Create a new project on Supabase.
• In the SQL Editor, run the schema script found below to create the tbl_jobs table.
• Set up Row Level Security (RLS) policies for select, insert, update, and delete access.

Supabase Schema (tbl_jobs)

-- Create the jobs table
CREATE TABLE public.tbl_jobs (
  id uuid NOT NULL DEFAULT uuid_generate_v4(),
  created_at timestamp with time zone NOT NULL DEFAULT now(),
  title text NOT NULL,
  company_name text NOT NULL,
  description text NOT NULL,
  location text NOT NULL,
  job_type text NOT NULL,
  user_id uuid NOT NULL,
  updated_at timestamp with time zone NOT NULL DEFAULT now(),
  CONSTRAINT jobs_pkey PRIMARY KEY (id),
  CONSTRAINT jobs_user_id_fkey FOREIGN KEY (user_id) REFERENCES auth.users(id) ON DELETE CASCADE
);

-- RLS Policies
-- Enable RLS
ALTER TABLE public.tbl_jobs ENABLE ROW LEVEL SECURITY;

-- Allow public read access
CREATE POLICY "Allow public read access to jobs" ON public.tbl_jobs FOR SELECT USING (true);

-- Allow users to insert their own jobs
CREATE POLICY "Enable insert for authenticated users only" ON public.tbl_jobs FOR INSERT TO authenticated WITH CHECK (auth.uid() = user_id);

-- Allow users to update their own jobs
CREATE POLICY "Enable update for users based on user_id" ON public.tbl_jobs FOR UPDATE TO authenticated USING (auth.uid() = user_id) WITH CHECK (auth.uid() = user_id);

-- Allow users to delete their own jobs
CREATE POLICY "Enable delete for users based on user_id" ON public.tbl_jobs FOR DELETE TO authenticated USING (auth.uid() = user_id);

3. Set Up Environment Variables:

• In the root of your project, create a new file named .env.local.
• Go to your Supabase project's Settings > API.
• Copy your Project URL and the anon public key into the .env.local file:

NEXT_PUBLIC_SUPABASE_URL=YOUR_SUPABASE_URL
NEXT_PUBLIC_SUPABASE_ANON_KEY=YOUR_SUPABASE_ANON_KEY

4. Run the Development Server:

npm run dev

Open http://localhost:3000 in your browser to see the application.

🏗️ Architecture Overview

This application is built using the Next.js App Router, which leverages modern React features like Server Components, and deployed on Vercel.

• Frontend (Vercel & Next.js): The Mini Job Board application is deployed on Vercel, which provides the serverless infrastructure for running Next.js application.. User requests are handled by Server Components, which fetch data directly. Interactive UI are handled by Client Components.

• Backend: Supabase serves as the all-in-one backend, providing:

  • Database: A PostgreSQL database to store job and user data.
  • Authentication: Supabase Auth for secure user sign-up, login, logout, forgot password, and session management.
  • Security layer: Row Level Security (RLS) policies that act as a secure backend, ensuring users can only access or modify the data they own.

🌟 What I Would Improve

Given more time, I would focus on the following enhancements, categorized by area:

Job Seeker Features

• Apply for Jobs: Create a feature for users to apply directly through the platform.

• Save/Bookmark Jobs: Allow logged-in users to save jobs they are interested in to a personal "Saved Jobs" list for later viewing.

Employer & Job Management Features

• Company Profiles: Allow authenticated employers to create a dedicated company page that lists all their open positions.

• Image Uploads: Add the ability for companies to upload logos for their job postings.

• Show/Hide Job Posts: Add the ability for employers to show/hide a post.

General Platform Enhancements

• Single Sign-On (SSO): Integrate third-party login providers (e.g., Google or Microsoft) for improved ease-of-use during signup and login.

• AI-Powered Assistance (LLM): Integrate a Large Language Model to assist employers in generating professional job descriptions or to help job seekers draft tailored application materials.

• Notifications: Implement an email notification system to alert job seekers about new relevant jobs or to notify employers about new applications.

• UI/UX Improvement:

  • Implement a toast notification system for better user feedback on actions like "Job Posted" or "Update Successful."

• Testing: Write unit and integration tests for components and Server Actions using a framework like Jest and React Testing Library to ensure long-term stability and reliability.