JobFinder is a job board application built with React, allowing employers to post jobs and job seekers to browse and apply for opportunities. The project features a modern UI, job CRUD operations, and uses Tailwind CSS for styling.
- Browse all available jobs
- View detailed job information
- Add new job listings (for employers)
- Edit and delete existing jobs
- Responsive design with Tailwind CSS
- Toast notifications for user feedback
- Loading spinners for async actions
- Modular and reusable React components
- React
- React Router
- Tailwind CSS
- Vite
- React Icons
- Sonner (toast notifications)
- React Spinners
- Node.js (v18 or higher recommended)
- npm
- Clone the repository:
git clone https://github.com/your-username/jobfinder-react.git cd jobfinder-react - Install dependencies:
npm install
- Start the development server:
npm run dev
- Open your browser:
Navigate to
http://localhost:5173to view the application.
This project expects a REST API at http://localhost:3000/jobs. For local development, you can use json-server:
npm install -g json-server
json-server --watch src/jobs.json --port 3000src/
App.jsx
main.jsx
jobs.json
tailwind.css
components/
Hero.jsx
Homecards.jsx
JobListing.jsx
JobListings.jsx
Navbar.jsx
hooks/
useFetch.jsx
layouts/
MainLayout.jsx
pages/
AddJobPage.jsx
EditJobPage.jsx
Homepage.jsx
JobPage.jsx
JobsPage.jsx
assets/
react.svg
public/
vite.svg
- components/: Reusable UI components.
- pages/: Route-based page components.
- hooks/: Custom React hooks for data fetching and API actions.
- layouts/: Layout components for consistent structure.
- jobs.json: Sample job data for development with json-server.
npm run dev– Start the development servernpm run build– Build for productionnpm run preview– Preview the production buildnpm run lint– Run ESLint
Contributions are welcome! Please open an issue or submit a pull request.
Feel free to reach out for any questions or suggestions.