Skip to content

Instantly share code, notes, and snippets.

@khacanh
Created May 18, 2020 14:53
Show Gist options
  • Save khacanh/c64917c54dc3ecd33fdc3b0a39c59e3e to your computer and use it in GitHub Desktop.
Save khacanh/c64917c54dc3ecd33fdc3b0a39c59e3e to your computer and use it in GitHub Desktop.

App description

Create a simple ReactJS app that fetches and displays a list of Rails GitHub issues. For each item display the id and the title. Use ul and li for this list.

GitHub API supports pagination, at the beginning load the first page with 5 issues. At the bottom there is a button Next that loads the next 5 issues.

Clicking on an issue item will highlight it. Click on it again will toggle the highlight. Only 1 item is highlighted at a time.

Feel free to implement the UI in your own way. However the code should be neat.

API

This is the endpoint to fetch issues, it's publicly available, no need to authenticate.

https://api.github.com/repos/rails/rails/issues?page=1&per_page=5

This is the fetch method to use for the API call.

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

ReactJS resources

Follow the instruction here https://facebook.github.io/react/docs/installation.html . Starting a new react project is as simple as:

npm install -g create-react-app
create-react-app hello-world
cd hello-world
npm start

ReactJS state and life cycle can be found here https://facebook.github.io/react/docs/state-and-lifecycle.html

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment