Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/seanoliver/react-jobly
Jobly is a demo job search engine built in React with an Express JS backend.
https://github.com/seanoliver/react-jobly
react
Last synced: 18 days ago
JSON representation
Jobly is a demo job search engine built in React with an Express JS backend.
- Host: GitHub
- URL: https://github.com/seanoliver/react-jobly
- Owner: seanoliver
- License: mit
- Created: 2023-04-25T22:51:06.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-07-22T18:16:46.000Z (over 1 year ago)
- Last Synced: 2024-12-06T16:57:34.409Z (about 1 month ago)
- Topics: react
- Language: JavaScript
- Homepage: https://jobly.seanoliver.dev/
- Size: 13.1 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Jobly
Because job searching should be more fun than your last job.
View Demo
·
Backend Repo
·
Report Bug
·
Request Feature
Table of Contents
## About The Project
Jobly is a job search app that allows users to browse companies and jobs. Users can sign up, log in, and apply for jobs. Users can also edit their profile, follow companies, and view their application history. It was originally built in 2023 as a project for the [Rithm School](https://www.rithmschool.com/) curriculum.
This repo contains the front-end code for the app. The back-end code can be found [here](https://github.com/seanoliver/jobly-backend).
The front-end is built in React and uses React Router for routing, React Bootstrap for styling, [Axios](https://axios-http.com/) for making API calls, and is hosted on [Vercel](https://vercel.com/). The back-end is written in Express and uses PostgreSQL for the database. It is hosted on [Render](https://render.com/) and the database is hosted on [ElephantSQL](https://www.elephantsql.com/).
Taking the frontend and backend together, this project is a great way to learn more about:
- Building RESTful APIs and consuming them via Axios
- Separating concerns between frontend and backend
- React components and state management
- React Router
- Database design and modeling
- User authentication and authorization
- User sessions and cookies
- Encryption and password hashing
I'm excited to keep building on this project and add more features. Feel free to contribute!
You can log into the [demo site](https://jobly.seanoliver.dev/) with the following credentials:
- Username: `guest`
- Password: `password`
### Key Features
### Built With
This project was built in 2023 using the following technologies.
- ![React][React]
- ![React Router][React Router]
- ![React Bootstrap][React Bootstrap]
- ![Axios][Axios]
- ![Express][Express]
- ![PostgreSQL][PostgreSQL]
- ![ElephantSQL][ElephantSQL]
- ![Node.js][Node.js]
- ![Midjourney][Midjourney]
- ![Vercel][Vercel]
- ![Render][Render]
See [requirements.txt](https://github.com/seanoliver/react-jobly/blob/master/requirements.txt) for a full list of dependencies.
## Getting Started
To get a local copy up and running follow these simple steps.
1. Clone the frontend and backend repos
```bash
git clone https://github.com/seanoliver/react-jobly
git clone https://github.com/seanoliver/jobly-backend
```
2. Create and seed the database
```bash
createdb jobly
cd jobly-backend
psql jobly.sql
```
3. Install dependencies and run the backend server (Defaults to port `3001`)
```bash
cd jobly-backend
npm install
npm run start
```
4. In a new terminal, install dependencies and run the frontend server (defaults to port `3000`)
```bash
cd react-jobly
npm install
npm run start
```
7. Go to localhost:5000 to view the app
## Roadmap
- [ ] Loading spinner for sign-up/sign-in views
- [ ] Guest credentials helper text
- [ ] Add a "forgot password" feature
- [ ] Add a "delete account" feature
- [ ] Bring in shadcn-ui components
- [ ] Standardize layout outs and spacing
- [ ] Reseed DB with more users, companies, jobs
## Contributing
This is a great project for learning React Router, React Bootstrap, and consuming RESTful APIs. It's also a great project for learning about database design and modeling, user authentication and authorization, and user sessions and cookies. If you're interested in contributing, please feel free to open a pull request or fork the project and make it your own!
1. Fork the Project
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
## License
Distributed under the MIT License. See [LICENSE](https://github.com/seanoliver/react-jobly/LICENSE) for more information.
## Contact
Your Name - [@SeanOliver](https://twitter.com/SeanOliver) - [email protected]
Project Link (Frontend): [https://github.com/seanoliver/react-jobly](https://github.com/seanoliver/react-jobly)
Project Link (Backend): [https://github.com/seanoliver/jobly-backend](https://github.com/seanoliver/jobly-backend)
Live Demo: [https://react-jobly.seanoliver.dev/](https://jobly.seanoliver.dev/)
## Acknowledgments
This was a project I completed as part of the [Rithm School](https://www.rithmschool.com/) curriculum. I would like to thank the entire Rithm team for their great curriculum and support.
- [Rithm School](https://www.rithmschool.com/)
- [Best-README-Template](https://github.com/othneildrew/Best-README-Template)
- [Img Shields](https://shields.io)
[React]: https://img.shields.io/badge/React-61DAFB?logo=react&logoColor=white
[React Router]: https://img.shields.io/badge/React_Router-CA4245?logo=react-router&logoColor=white
[React Bootstrap]: https://img.shields.io/badge/React_Bootstrap-563D7C?logo=bootstrap&logoColor=white
[Axios]: https://img.shields.io/badge/Axios-5A2D81?logo=axios&logoColor=white
[Express]: https://img.shields.io/badge/Express-000000?logo=express&logoColor=white
[Node.js]: https://img.shields.io/badge/Node.js-339933?logo=node.js&logoColor=white
[PostgreSQL]: https://img.shields.io/badge/PostgreSQL-4169E1?logo=postgresql&logoColor=white
[ElephantSQL]: https://img.shields.io/badge/ElephantSQL-2D9CDB?logo=elephantsql&logoColor=white
[Midjourney]: https://img.shields.io/badge/Midjourney-FF5700?logo=midjourney&logoColor=white
[Vercel]: https://img.shields.io/badge/Vercel-000000?logo=vercel&logoColor=white
[Render]: https://img.shields.io/badge/Render-000000?logo=render&logoColor=white