A full-stack web application that helps job seekers organize and manage their job applications from a single platform.
LockedIn is designed to simplify the job application process by providing a centralized place to manage applications. Instead of tracking applications across spreadsheets, emails, or multiple job portals, users can securely store and manage all their job application details in one application.
The application supports secure user authentication, allowing every user to maintain their own collection of job applications. Users can create, edit, update, and delete applications while tracking information such as company name, job role, application status, application link, and personal notes.
This project was developed to strengthen my understanding of modern frontend development with React while integrating a real backend using Appwrite. Throughout development, I gained hands-on experience with authentication, CRUD operations, global state management, routing, and form validation.
- Secure user authentication using Appwrite
- User sign up and login
- Create new job applications
- View all saved applications
- Update existing applications
- Delete applications
- Track:
- Company Name
- Job Role
- Application Status
- Job Link
- Personal Notes
- Protected routes for authenticated users
- Form validation using React Hook Form
- Global authentication state using Redux Toolkit
- React
- Tailwind CSS
- DaisyUI
- Appwrite Authentication
- Appwrite Database
- Redux Toolkit
- React Hook Form
- React Router DOM
git clone https://github.com/Anusha614/Job-Tracker.gitcd Job-Trackernpm installCreate a .env file in the project root and add your Appwrite credentials.
VITE_APPWRITE_URL=
VITE_APPWRITE_PROJECT_ID=
VITE_APPWRITE_DATABASE_ID=
VITE_APPWRITE_COLLECTION_ID=npm run devI chose Appwrite as a Backend-as-a-Service (BaaS) because it provides authentication and database services out of the box. This allowed me to focus on frontend development while still integrating a production-style backend for secure authentication and persistent data storage.
Redux Toolkit is used to manage the application's global authentication state. It ensures that authentication information is accessible across the application, making protected routes and conditional rendering easier to implement.
React Hook Form simplifies form handling by reducing boilerplate code compared to managing each input using multiple useState hooks. It also provides built-in validation, making forms cleaner and easier to maintain.
One of the biggest challenges during development was managing user authentication.
Initially, refreshing the application caused the Redux authentication state to reset even though the Appwrite session remained active. As a result, the application incorrectly treated authenticated users as logged out.
I solved this by checking the authenticated user when the application loads and synchronizing the Redux store with the existing Appwrite session. Debugging this issue significantly improved my understanding of authentication flow, global state management, and React's component lifecycle.
Through building LockedIn, I strengthened my understanding of:
- React component architecture
- CRUD application development
- Authentication using Appwrite
- Global state management with Redux Toolkit
- Form handling and validation using React Hook Form
- Client-side routing with React Router
- Authentication state synchronization
- Debugging real-world frontend applications
Anusha Deshpande
GitHub: https://github.com/Anusha614