Job Diary Pro - Job Tracking Application

A full-stack MERN application that helps users track and manage their job applications effectively.

🌟 Live Demo

Job Diary Pro

📋 Overview

Job Diary Pro is a comprehensive job application tracking system that allows users to:

• Track job applications with detailed information

• Search and filter jobs by various criteria

• Visualize application statistics

• Manage their professional profile

• Store company information with automatic logo detection

This application streamlines the job search process by providing a centralized platform to monitor application status, upcoming interviews, and job search progress.

🚀 Features

User Authentication

• Secure registration and login system

• JWT-based authentication with HTTP-only cookies

• Role-based access control (admin/user)

• Demo account for testing features

Job Management

• Create, edit, and delete job applications

• Automatic company information retrieval from URL

• Track application status (pending, interview, declined)

• Categorize by job type (full-time, part-time, internship)

• Record work model (remote, hybrid, onsite)

Search and Filter

• Advanced search functionality for jobs

• Filter by status, type, and work model

• Sort by various criteria (newest, oldest, alphabetical)

• Pagination for better user experience

Analytics

• Visual statistics dashboard

• Distribution of application statuses

• Job application trends

User Profile

• Personalized user profiles

• Profile image upload via Amazon S3

• Dark/light mode toggle

• Responsive design for all devices

🛠️ Technology Stack

Frontend

• React 19 with TypeScript

• Styled Components for styling

• React Router v7 for routing and data actions

• TanStack Query (React Query) for data fetching and caching

• Recharts for data visualization

• React Icons for UI elements

• Context API for global state management

• Axios for HTTP requests

• Vite for build tooling

Backend

• Express.js for REST API development

• MongoDB with Mongoose for database

• JWT for authentication

• bcryptjs for password hashing

• Express Validator for data validation

• Multer for file upload handling

• AWS SDK for S3 integration

• TypeScript for type safety

Deployment

• Vercel for hosting frontend and serverless functions

⚙️ Setup and Installation

Prerequisites

• Node.js (v16+)

• pnpm

• MongoDB

Installation

1. Clone the repository

2. Install dependencies

3. Environment variables

   Create .env files in both server and client directories:

   Server .env

   Client .env

4. Start development servers

🔒 Security Features

• HTTP-only cookies for JWT storage

• Password hashing with bcrypt

• Input validation and sanitization

• Protected routes with role-based access

• CORS configuration

• Rate limiting to prevent abuse

📱 Responsive Design

The application is fully responsive and optimized for:

• Desktop browsers

• Tablets

• Mobile devices

🔍 Key Learning Outcomes

• Building a full-stack TypeScript application

• Implementing secure authentication flows

• Working with MongoDB and Mongoose

• Creating reusable React components

• Managing application state with Context API

• Using React Router data actions for server state

• Integrating with cloud services (AWS S3)

• Deploying a MERN application on Vercel

🔮 Future Enhancements

• Email notifications for application status changes

• Calendar integration for interview scheduling

• Document storage for resumes and cover letters

• Networking contact management

• Job application insights and recommendations

• Social sharing functionality

📝 License

MIT

👨‍💻 Author

Halil Ibrahim Celik

Feel free to reach out with any questions or feedback!