yjb94 / react-store-badges Goto Github PK

react store badges for apple app store and google play store. supports localization

License: MIT License

JavaScript 100.00%

react reactjs google-play-store badge badge-generator appstore react-store-badges apple google

react-store-badges's Introduction

react-store-badges

react-store-badges is a React.js component displaying badges for App Store and Google Play Store. react-store-badge serves locale(localization) setting for each country.

react-store-badge uses SVG files, (optimized by svgo) so no worries about image going wrong.

Getting started

  npm install --save react-store-badges

Usage

  import React, {Component} from 'react'

  import ReactStoreBadges from 'react-store-badges'

  class App extends Component {
    render() {
      return <div>
        <ReactStoreBadges
          platform={'ios'}
          url={'YOUR_APP_STORE_URL'}
          locale={'en-us'}
        />

        <ReactStoreBadges
          platform={'android'}
          url={'YOUR_PLAY_STORE_URL'}
          locale={'ko-kr'}
        />
      </div>
    }
  }

props

Name	Type	Default	Description
url	`string`	`required`	url of App Store and Play Store
platform	`'ios'\|'android'`	`required`	url of App Store and Play Store
defaultLocale	`string`	'en-us'	default locale code
locale	`string`	'en-us'	locale name
width	`number`	135	width for badge size
height	`number`	40	height for badge size
target	`'_self'\|'_blank'\|'_parent'\|'_top'`	'_self'	target for url to be opened

Localization

Supported locales

Apple locales list

Google locales list

Localization tip

iOS uses full code of their locale. (ex. en-us) and google uses short code of their locale(ex. en). So if you want your badge in only one store, you can customize it anyway.

Badge Guidelines

please note that you have to follow the guidelines below

Apple Badge Guidelines

Google Badge Guidelines

react-store-badges's People

Contributors

Stargazers

Forkers

arnaud-cortisse gvillenave bitte-tecnologia pedromoritz jimmi-joensson

react-store-badges's Issues

Url on new window

Hey ! :)

First : very cool package, thank's !

It would be interesting to add this feature :

props for open in a new window
For something like this :

<ReactStoreBadges platform={'ios'} url={'YOUR_APP_STORE_URL'} locale={'en-us'} newWindow={true} />

The automated release is failing 🚨

🚨 The automated release from the `master` branch failed. 🚨

I recommend you give this issue a high priority, so other packages depending on you could benefit from your bug fixes and new features.

You can find below the list of errors reported by semantic-release. Each one of them has to be resolved in order to automatically publish your package. I’m sure you can resolve this 💪.

Errors are usually caused by a misconfiguration or an authentication problem. With each error reported below you will find explanation and guidance to help you to resolve it.

Once all the errors are resolved, semantic-release will release your package the next time you push a commit to the master branch. You can also manually restart the failed CI job that runs semantic-release.

If you are not sure how to resolve this, here is some links that can help you:

If those don’t help, or if this issue is reporting something you think isn’t right, you can always ask the humans behind semantic-release.

Invalid npm token.

The npm token configured in the NPM_TOKEN environment variable must be a valid token allowing to publish to the registry https://registry.npmjs.org/.

If you are using Two-Factor Authentication, make configure the auth-only level is supported. semantic-release cannot publish with the default auth-and-writes level.

Please make sure to set the NPM_TOKEN environment variable in your CI with the exact value of the npm token.

Good luck with your project ✨

Your semantic-release bot 📦🚀

Publish TypeScript declarations

Hi, I can see that you have a TypeScript declaration file, but it is not included in the npm release. It would be helpful to include it in the release, or release it separately on @types. Ref: https://www.typescriptlang.org/docs/handbook/declaration-files/publishing.html

Usage section contains wrong code

Hello,

Thanks for the package!

I noticed a typo in the 'Usage' section;

<ReactStoreBadges platfrom={'ios'} url={'YOUR_APP_STORE_URL'} locale={'en-us'} />

it should be 'platform' instead of 'platfrom'.

iOS-link broken

Getting 404 error - https://linkmaker.itunes.apple.com/images/badges/en-us/badge_appstore-lrg.svg