Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/tinspham209/github-jobs
Show available Jobs from Github Jobs
https://github.com/tinspham209/github-jobs
axios bootstrap react react-bootstrap react-markdown usereducer-hooks
Last synced: about 8 hours ago
JSON representation
Show available Jobs from Github Jobs
- Host: GitHub
- URL: https://github.com/tinspham209/github-jobs
- Owner: tinspham209
- Created: 2020-08-29T14:31:56.000Z (about 4 years ago)
- Default Branch: master
- Last Pushed: 2023-12-15T05:31:51.000Z (11 months ago)
- Last Synced: 2023-12-15T06:41:15.466Z (11 months ago)
- Topics: axios, bootstrap, react, react-bootstrap, react-markdown, usereducer-hooks
- Language: JavaScript
- Homepage:
- Size: 371 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Mini Project: GitHub Jobs Application
## Date: 29 - Aug - 2020
### Functions
- Display available Jobs from Github Jobs
### Screenshot
### Tech-Stack
- React
- react-bootstrap: UI
- axios: fetch API
- useReducer : store state
- react-markdown : converting markdown on URL to string
### API Used
https://jobs.github.com/api
### Plan Of Action
- Initial Project
- Setup react, axios, react-bootstrap
- create useFetchJob function to Fetch API
- create Job component
- create Pagination
- create Search
- Filter Job with full-time
### After this project
I have improve my knowledge about
I have understand about
- use `useReducer` hooks to store state
- how to fix CORS error with `https://cors-anywhere.herokuapp.com/[your_url]`
- use `cancelToken` of axios to cancel get request when you typing every character.
- use react-bootstrap for style component without css file
- how to create pagination with react-bootstrap
- handle variable `hasNextPage` when fetchData to add Pagination nextPage
- create search form with bootstrap
- handle Params Change
Next Steps:
### Directory Structure
```
.
├── .gitignore
├── package.json
├── README.md
├── public
└── src
├── components
├── Job
├── Pagination
├── SearchForm
└── UI
└── Spinner
├── hooks
└── useFetchJob.js
├── App.js
├── App.css
├── index.css
└── index.js
```
### Set up
Use the cmd line to clone repo to your computer
```
git clone [github_repo_url]
```
Use the cmd line to install dependencies.
```
npm install
```
Run in cmd for start the dependencies server
```
npm start
```