Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Issue when using react #20

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Issue when using react #20

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
e3c14b9
Update ReadMe for code example if using React
mrshawnhum Jul 1, 2020
684e9a5
Add import
mrshawnhum Jul 1, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
30 changes: 30 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,21 @@ pf.animal.search()
});
```

Another way if you have issues with the above code snippet and using React
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This snippet better fits under the TypeScript/ES6 Module section. Do you want to replace that snippet with this one and then update the title to include React?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Or we could also create a new Usage (React) section and add this and the jsx under that.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I personally would just completely replace the snippet with React example, but if you want to make a separate section for React that would be fine too.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

React is different than browser, so I would keep it separate

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

sounds good!


```js
import { Client } from "@petfinder/petfinder-js";

const pf = new Client({
apiKey: "my-api-key",
secret: "my-api-secret",
});

const results = await pf.animal.search()
console.log(results.data.animals)
};
```

## Usage (Node/CommonJS)

```js
Expand Down Expand Up @@ -70,6 +85,21 @@ client.animal.search()
});
```

## If using primary_photo_cropped, some dogs or cats won't have images. I recommend adding a placeholder like below example if using React
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is wordy for a title

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

was just putting a disclaimer but you can adjust how you see fit

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Perhaps italicized would be better? _disclaimer text_

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

that or bold. Either way it would be better than just making it a title


```jsx

<img
src={
animal.primary_photo_cropped
? animal.primary_photo_cropped.small
: "https://source.unsplash.com/1600x900/?pets"
}
alt=""
/>

```

## Documentation

See [docs directory](docs/) for more detailed documentation.