https://github.com/akhil07-ctrl/jobby-app
Jobby App is a React-based job search platform that allows users to browse, search, and filter job listings. The application features user authentication, detailed job views with company information and skill requirements, and the ability to filter jobs by employment type, salary range, and location. It also provides a responsive interface.
https://github.com/akhil07-ctrl/jobby-app
js-cookie protected-routes react-icons react-router-dom usenavigate-hook
Last synced: 8 months ago
JSON representation
Jobby App is a React-based job search platform that allows users to browse, search, and filter job listings. The application features user authentication, detailed job views with company information and skill requirements, and the ability to filter jobs by employment type, salary range, and location. It also provides a responsive interface.
- Host: GitHub
- URL: https://github.com/akhil07-ctrl/jobby-app
- Owner: Akhil07-ctrl
- Created: 2025-05-02T04:39:13.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-05-11T15:45:39.000Z (about 1 year ago)
- Last Synced: 2025-05-21T03:16:29.691Z (about 1 year ago)
- Topics: js-cookie, protected-routes, react-icons, react-router-dom, usenavigate-hook
- Language: JavaScript
- Homepage: https://jobby-app-silk.vercel.app/login
- Size: 5.4 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Jobby App
A modern job search application built with React that helps users find jobs that fit their skills and career goals.
## 🚀 Live Demo
Check out the live demo: [Jobby App](https://jobby-app-silk.vercel.app/)
## ✨ Features
- **User Authentication**: Secure login system with protected routes
- **Job Search**: Browse and search through available job listings
- **Job Filtering**: Filter jobs by various criteria (employment type, salary range, etc.)
- **Job Details**: View detailed information about specific job positions
- **Responsive Design**: Optimized for both desktop and mobile devices
- **User Profile**: View and manage user profile information
## 🛠️ Tech Stack
- **Frontend**: React 18.2.0
- **Routing**: React Router DOM 6.20.0
- **Icons**: React Icons 4.12.0
- **Styling**: CSS3
- **State Management**: React Hooks
- **Authentication**: Cookie-based authentication with js-cookie
- **Testing**: React Testing Library & Jest
## 📋 Prerequisites
Before running this application, make sure you have:
- Node.js (>= 20.0.0)
- npm (>= 8.0.0)
## 🔧 Installation
1. Clone the repository:
```bash
git clone
cd "Jobby App/client"
```
2. Install dependencies:
```bash
npm install
```
## 🚀 Available Scripts
### `npm start`
Runs the app in development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
The page will reload when you make changes.\
You may also see any lint errors in the console.
### `npm test`
Launches the test runner in interactive watch mode.\
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
### `npm run build`
Builds the app for production to the `build` folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
### `npm run deploy`
Deploys the application to GitHub Pages after building it.
## 📁 Project Structure
```
client/
├── public/
│ ├── index.html
│ ├── manifest.json
│ └── robots.txt
├── src/
│ ├── components/
│ │ ├── FiltersGroup/
│ │ ├── Header/
│ │ ├── Home/
│ │ ├── JobCard/
│ │ ├── JobItemDetails/
│ │ ├── Jobs/
│ │ ├── Login/
│ │ ├── NotFound/
│ │ ├── ProfileDetails/
│ │ ├── ProtectedRoute/
│ │ ├── SimilarJobCard/
│ │ └── SkillsCard/
│ ├── App.js
│ ├── App.css
│ ├── index.js
│ └── index.css
├── package.json
└── README.md
```
## 🔐 Authentication
The application uses a protected route system where:
- Users must log in to access job listings and details
- Authentication state is managed using cookies
- Unauthenticated users are redirected to the login page
## 🎯 Usage
1. **Login**: Start by logging into the application
2. **Home Page**: View the welcome page with a call-to-action to find jobs
3. **Jobs Page**: Browse through available job listings with filtering options
4. **Job Details**: Click on any job to view detailed information
5. **Profile**: Access your profile information through the header
## 🌐 Deployment
The application is configured for deployment on GitHub Pages. Use the following command to deploy:
```bash
npm run deploy
```
## 🧪 Testing
Run the test suite with:
```bash
npm test
```
The project includes comprehensive testing with React Testing Library and Jest.
## 📱 Browser Support
- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)
## 🤝 Contributing
1. Fork the repository
2. Create your feature branch (`git checkout -b feature/AmazingFeature`)
3. Commit your changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request
## 🧑💻 Author
- **Kundena Akhil** - [Portfolio](https://portfolio-nine-flax-29.vercel.app/) - [GitHub](https://github.com/Akhil07-ctrl) - [LinkedIn](https://www.linkedin.com/in/kundena-akhil-4b7073170/)
## 📄 License
This project is licensed under the MIT License.
## 🔗 Learn More
- [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started)
- [React documentation](https://reactjs.org/)
- [React Router documentation](https://reactrouter.com/)