Split Showcase and add mini-Showcase to homepage

Summary:
We're revamping the Showcase, and in this first PR we're focusing on two things:

1. We're splitting the list of featured apps. Those in the "pinned" list will be fairly static and PRs that add/remove apps from this list will be discouraged. Apps in the "featured" list will be held to the same standards established this past summer (funded startup or public company + engineering blog post on RN / news article from established company).

2. We're displaying the pinned apps in a small showcase at the bottom of the homepage.

Note that pinned and featured apps are displayed together in the main showcase without any separation. Pinned apps will appear first in an arbitrary order, followed by featured apps in alphabetical order. Future PRs may address how apps are displayed in the main Showcase itself.

We want to also make sure people understand some of these apps are not built entirely using React Native. Some apps are native apps with individual RN views added in.

Full Showcase with pinned apps + fea
Closes https://github.com/facebook/react-native/pull/10243

Differential Revision: D3978374

Pulled By: hramos

fbshipit-source-id: 368f4a9650ca1f1583d2cc4b364e77cde0478c89
This commit is contained in:
Héctor Ramos 2016-10-07 11:43:42 -07:00 committed by Facebook Github Bot
parent dd6d297c55
commit b99343bdad
4 changed files with 640 additions and 386 deletions

View File

@ -1338,6 +1338,30 @@ div[data-twttr-id] iframe {
display: none;
}
/** Showcase **/
.home-showcase-section {
max-width: 800px;
margin: 20px auto 40px auto;
text-align: center;
}
.home-showcase-section p {
max-width: 540px;
margin: 0 auto;
}
.footnote {
font-size: 12px;
color: rgba(0, 0, 0, 0.4);
}
.home-showcase-section .showcase img {
width: 110px;
border-radius: 20px;
}
.showcaseHeader {
padding-bottom: 15px;
padding-top: 15px;
@ -1345,7 +1369,7 @@ div[data-twttr-id] iframe {
}
.showcase {
margin: 30px auto 10px auto;
margin: 30px auto 30px auto;
width: 100%;
display: inline-block;
text-align: center;
@ -1393,6 +1417,11 @@ div[data-twttr-id] iframe {
border-radius: 20px;
}
.pinned img {
width: 150px;
border-radius: 20px;
}
table.versions {
width: 60%;
}

View File

@ -11,6 +11,56 @@ var Prism = require('Prism');
var React = require('React');
var Site = require('Site');
var apps = require('./showcaseData').pinned;
var AppList = React.createClass({
render: function() {
return (
<div>
{this.props.apps.map(this._renderApp)}
</div>
);
},
_renderApp: function(app, i) {
var inner = (
<div>
{this._renderIcon(app)}
</div>
);
return (
<div className="showcase" key={i}>
{inner}
</div>
);
},
_renderIcon: function(app) {
var icon = (
<img src={app.icon} alt={app.name} />
);
return (
<a href={app.defaultLink}>
{icon}
</a>
);
},
_renderTitle: function(app) {
var title = (
<h3>{app.name}</h3>
);
return (
<a href={app.defaultLink}>
{title}
</a>
);
},
});
var index = React.createClass({
render: function() {
return (
@ -32,12 +82,12 @@ var index = React.createClass({
<div style={{margin: '40px auto', maxWidth: 800}}>
<h2>Build Native Mobile Apps using JavaScript and React</h2>
<p>
React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components.
</p>
<h2>Build Native Mobile Apps using JavaScript and React</h2>
<p>
React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components.
</p>
<Prism>
<Prism>
{`import React, { Component } from 'react';
import { Text, View } from 'react-native';
@ -57,14 +107,14 @@ class WhyReactNativeIsSoGreat extends Component {
);
}
}`}
</Prism>
</Prism>
<h2>A React Native App is a Real Mobile App</h2>
<p>
With React Native, you don't build a “mobile web app”, an “HTML5 app”, or a “hybrid app”. You build a real mobile app that's indistinguishable from an app built using Objective-C or Java. React Native uses the same fundamental UI building blocks as regular iOS and Android apps. You just put those building blocks together using JavaScript and React.
</p>
<h2>A React Native App is a Real Mobile App</h2>
<p>
With React Native, you don't build a “mobile web app”, an “HTML5 app”, or a “hybrid app”. You build a real mobile app that's indistinguishable from an app built using Objective-C or Java. React Native uses the same fundamental UI building blocks as regular iOS and Android apps. You just put those building blocks together using JavaScript and React.
</p>
<Prism>
<Prism>
{`import React, { Component } from 'react';
import { Image, ScrollView, Text } from 'react-native';
@ -87,21 +137,21 @@ class AwkwardScrollingImageWithText extends Component {
);
}
}`}
</Prism>
</Prism>
<h2>Don't Waste Time Recompiling</h2>
<p>
React Native lets you build your app faster. Instead of recompiling, you can reload your app instantly. With hot reloading, you can even run new code while retaining your application state. Give it a try - it's a magical experience.
</p>
<br />
<img src='https://media.giphy.com/media/13WZniThXy0hSE/giphy.gif' />
<h2>Don't Waste Time Recompiling</h2>
<p>
React Native lets you build your app faster. Instead of recompiling, you can reload your app instantly. With hot reloading, you can even run new code while retaining your application state. Give it a try - it's a magical experience.
</p>
<br />
<img src='https://media.giphy.com/media/13WZniThXy0hSE/giphy.gif' />
<h2>Use Native Code When You Need To</h2>
<p>
React Native combines smoothly with components written in Objective-C, Java, or Swift. It's simple to drop down to native code if you need to optimize a few aspects of your application. It's also easy to build part of your app in React Native, and part of your app using native code directly - that's how the Facebook app works.
</p>
<h2>Use Native Code When You Need To</h2>
<p>
React Native combines smoothly with components written in Objective-C, Java, or Swift. It's simple to drop down to native code if you need to optimize a few aspects of your application. It's also easy to build part of your app in React Native, and part of your app using native code directly - that's how the Facebook app works.
</p>
<Prism>
<Prism>
{`import React, { Component } from 'react';
import { Text, View } from 'react-native';
import { TheGreatestComponentInTheWorld } from './your-native-code';
@ -119,13 +169,28 @@ class SomethingFast extends Component {
);
}
}`}
</Prism>
</Prism>
</div>
<section className="home-bottom-section">
<div className="buttons-unit">
<a href="docs/getting-started.html#content" className="button">Get started with React Native</a>
</div>
</section>
<section className="home-showcase-section">
<h2>Who's using React Native?</h2>
<p>
Thousands of apps are using React Native, from established Fortune 500 companies to hot new startups. If you're curious to see what can be accomplished with React Native, check out these apps!
</p>
<AppList apps={apps} />
<p className="footnote">
Some of these are hybrid native/React Native apps.
</p>
<div className="buttons-unit">
<a href="showcase.html" className="button">More React Native apps</a>
</div>
</section>
</section>
</Site>
);

View File

@ -7,365 +7,16 @@
* of patent rights can be found in the PATENTS file in the same directory.
*/
/*
Thousands of applications use React Native, so we can't list all of them
in our showcase. To be useful to someone looking through the showcase,
either the app must be something that most readers would recognize, or the makers of the application must have
posted useful technical content about the making of the app. It also must be useful considering that the majority
of readers only speak English. So, each app in the showcase should link to either:
1/ An English-language news article discussing the app, built either by a funded startup or for a public company
2/ An English-language technical post on a funded startup or public company blog discussing React Native
For each app in the showcase, use infoLink and infoTitle to reference this content.
*/
var React = require('React');
var Site = require('Site');
var featured = [
{
name: 'Facebook',
icon: 'https://lh3.googleusercontent.com/ZZPdzvlpK9r_Df9C3M7j1rNRi7hhHRvPhlklJ3lfi5jk86Jd1s0Y5wcQ1QgbVaAP5Q=w300',
linkAppStore: 'https://itunes.apple.com/app/facebook/id284882215',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.facebook.katana&hl=en',
infoLink: 'https://code.facebook.com/posts/895897210527114/dive-into-react-native-performance/',
infoTitle: 'Using React Native in the Facebook App',
},
{
name: 'Facebook Groups',
icon: 'http://is4.mzstatic.com/image/pf/us/r30/Purple69/v4/57/f8/4c/57f84c0c-793d-5f9a-95ee-c212d0369e37/mzl.ugjwfhzx.png',
linkAppStore: 'https://itunes.apple.com/us/app/facebook-groups/id931735837?mt=8',
infoLink: 'https://code.facebook.com/posts/1014532261909640/react-native-bringing-modern-web-techniques-to-mobile/',
infoTitle: 'React Native: Bringing Modern Web Techniques to Mobile',
},
{
name: 'Facebook Ads Manager',
icon: 'http://is5.mzstatic.com/image/pf/us/r30/Purple5/v4/9e/16/86/9e1686ef-cc55-805a-c977-538ddb5e6832/mzl.gqbhwitj.png',
linkAppStore: 'https://itunes.apple.com/us/app/facebook-ads-manager/id964397083?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.facebook.adsmanager',
infoLink: 'https://code.facebook.com/posts/1189117404435352/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/',
infoTitle: 'How We Built the First Cross-Platform React Native App',
},
{
name: 'F8',
icon: 'https://raw.githubusercontent.com/fbsamples/f8app/master/ios/F8v2/Images.xcassets/AppIcon.appiconset/AppIcon%402x.png',
linkAppStore: 'https://itunes.apple.com/us/app/f8/id853467066?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.facebook.f8',
infoLink: 'http://makeitopen.com/tutorials/building-the-f8-app/planning/',
infoTitle: 'Building the F8 App',
},
{
name: 'PlaceAVote',
icon: 'https://s12.postimg.org/nr79mplq5/pav_Icon.png',
linkAppStore: 'https://itunes.apple.com/us/app/placeavote/id1120628991?ls=1&mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.placeavote.androidapp&hl=en',
infoLink: 'https://techcrunch.com/2016/05/10/placeavote-wants-to-give-voters-a-say-in-congress/',
infoTitle: 'PlaceAVote wants to give voters a say in Congress',
},
{
name: 'Robin Rooms',
icon: 'http://robinpowered.s3.amazonaws.com/rooms/appicon.png',
linkAppStore: 'https://itunes.apple.com/us/app/robin-rooms/id947566115',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.robinpowered.rooms',
infoLink: 'https://techcrunch.com/2016/05/31/robin-makes-the-office-smarter-with-7-million-in-new-funding/',
infoTitle: 'Robin Rooms manages and mounts outside your conference rooms'
},
{
name: 'FanVision Bolt',
icon: 'http://a4.mzstatic.com/us/r30/Purple18/v4/94/b4/6e/94b46ee5-80e3-ff6e-513d-16da926b03a3/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/fanvision-bolt/id1081891275',
infoLink: 'https://www.youtube.com/watch?v=oWOcAXyDf0w',
infoTitle: 'FanVision Bolt accessory + app provide live audio/video and stats at NASCAR events',
},
{
name: 'Gyroscope',
icon: 'https://media.gyrosco.pe/images/magneto/180x180.png',
linkAppStore: 'https://itunes.apple.com/app/apple-store/id1104085053?pt=117927205&ct=website&mt=8',
infoLink: 'https://blog.gyrosco.pe/building-the-app-1dac1a97d253',
infoTitle: '"Building a visualization experience with React Native."',
},
{
name: 'Discord',
icon: 'http://a5.mzstatic.com/us/r30/Purple5/v4/c1/2f/4c/c12f4cba-1d9a-f6bf-2240-04085d3470ec/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/discord-chat-for-gamers/id985746746?mt=8',
infoLink: 'https://discord.engineering/react-native-deep-dive-91fd5e949933#.5jnqftgof',
infoTitle: 'Using React Native: One Year Later',
},
{
name: 'Discovery VR',
icon: 'http://a2.mzstatic.com/us/r30/Purple6/v4/d1/d5/f4/d1d5f437-9f6b-b5aa-5fe7-47bd19f934bf/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/discovery-vr/id1030815031?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.discovery.DiscoveryVR',
infoLink: 'https://medium.com/ios-os-x-development/an-ios-developer-on-react-native-1f24786c29f0',
infoTitle: '"I may never write an iOS app in Objective-C or Swift again."',
},
{
name: 'Movie Trailers by MovieLaLa',
icon: 'https://lh3.googleusercontent.com/16aug4m_6tvJB7QZden9w1SOMqpZgNp7rHqDhltZNvofw1a4V_ojGGXUMPGiK0dDCqzL=w300',
linkAppStore: 'https://itunes.apple.com/us/app/movie-trailers-by-movielala/id1001416601?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.movielala.trailers',
infoLink: 'http://variety.com/2016/digital/news/movielala-1-4-million-seed-round-hollywood-angel-investors-1201678139/',
infoTitle: 'MovieLaLa Closes $1.4 Million Seed Round',
},
{
name: 'Myntra',
icon: 'http://a5.mzstatic.com/us/r30/Purple6/v4/9c/78/df/9c78dfa6-0061-1af2-5026-3e1d5a073c94/icon350x350.png',
linkAppStore: 'https://itunes.apple.com/in/app/myntra-fashion-shopping-app/id907394059',
infoLink: 'https://techcrunch.com/2014/05/22/flipkart-myntra-acqusition/',
infoTitle: 'Flipkart Buys Fashion E-tailer Myntra To Fight Amazon',
},
{
name: 'SoundCloud Pulse',
icon: 'https://i1.sndcdn.com/artworks-000149203716-k5je96-original.jpg',
linkAppStore: 'https://itunes.apple.com/us/app/soundcloud-pulse-for-creators/id1074278256?mt=8',
infoLink: 'https://blog.soundcloud.com/2016/02/23/soundcloud-pulse-now-on-iphone/',
infoTitle: 'SoundCloud Pulse: now on iPhone',
},
{
name: 'Start - medication manager for depression',
icon: 'http://a1.mzstatic.com/us/r30/Purple49/v4/de/9b/6f/de9b6fe8-84ea-7a12-ba2c-0a6d6c7b10b0/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/start-medication-manager-for/id1012099928?mt=8',
infoLink: 'http://www.nytimes.com/2014/09/24/technology/to-gather-drug-information-a-health-start-up-turns-to-consumers.html?_r=0',
infoTitle: 'NYT: A Health Startup Turns to Consumers',
},
{
name: 'Taxfyle - taxes filed on-demand via licensed CPA',
icon: 'https://s3.amazonaws.com/taxfyle-public/images/taxfyle-icon-1024px.png',
linkAppStore: 'https://itunes.apple.com/us/app/taxfyle/id1058033104?mt=8',
infoLink: 'http://www.techinsider.io/taxfyle-wants-to-be-the-uber-for-taxes-2016-4',
infoTitle: 'Taxfyle: the Uber for filing taxes',
},
{
name: 'This AM',
icon: 'http://s3.r29static.com//bin/public/efe/x/1542038/image.png',
linkAppStore: 'https://itunes.apple.com/us/app/refinery29-this-am-top-breaking/id988472315?mt=8',
infoLink: 'https://techcrunch.com/2016/02/01/refinery29-debuts-its-first-app-a-morning-news-round-up-called-refinery29-am/',
infoTitle: 'Refinery29 debuts its first app',
},
{
name: 'TRED - Sell your car for more',
icon: 'http://a1.mzstatic.com/us/r30/Purple20/v4/b0/0c/07/b00c07d2-a057-06bc-6044-9fdab97f370f/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/tred-sell-my-car-for-more!/id1070071394?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.tredmobile&hl=en',
infoLink: 'http://www.geekwire.com/2015/mobile-dealership-tred-raises-another-1m-to-help-used-car-owners-make-more-money/',
infoTitle: 'Sell your car for thousands more than Craigslist or the dealer with TRED',
},
{
name: 'Bitt Wallet',
icon: 'http://a4.mzstatic.com/us/r30/Purple69/v4/5b/00/34/5b003497-cc85-a0d0-0d3e-4fb3bc6f95cd/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/bitt-wallet/id1081954916?mt=8',
infoLink: 'https://bitcoinmagazine.com/articles/overstock-invests-in-bitt-to-launch-official-digital-currencies-in-the-caribbean-islands-1459961581',
infoTitle: 'Overstock invests in Bitt to launch digital currencies',
},
{
name: 'Calor - Field Pro',
icon: 'http://rnfdigital.com/wp-content/uploads/2016/04/FieldProIcon.png',
infoLink: 'http://rnfdigital.com/react-native-a-game-changer-for-enterprise-mobile-development/',
infoTitle: 'React Native: a game changer for Enterprise Mobile Development',
},
{
name: 'CBS Sports Franchise Football',
icon: 'http://a2.mzstatic.com/us/r30/Purple69/v4/7b/0c/a0/7b0ca007-885a-7cfc-9fa2-2ec4394c2ecc/icon175x175.png',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.cbssports.fantasy.franchisefootball2015',
infoLink: 'http://www.cbssports.com/fantasy/football/games/franchise/2015',
infoTitle: 'The award winning Fantasy Football league manager.',
},
{
name: 'Coiney窓口',
icon: 'http://a4.mzstatic.com/us/r30/Purple69/v4/c9/bc/3a/c9bc3a29-9c11-868f-b960-ca46d5fcd509/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/jp/app/coiney-chuang-kou/id1069271336?mt=8',
infoLink: 'https://www.techinasia.com/japan-startup-coiney-aims-for-ipo',
infoTitle: 'Japanese startup Coiney aims for IPO',
},
{
name: 'Convoy Driver',
icon: 'http://a1.mzstatic.com/us/r30/Purple30/v4/5a/74/56/5a74567d-4491-a298-65cd-722c8a7211ac/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/convoy-driver/id1045368390?mt=8',
infoLink: 'http://www.theverge.com/2015/10/27/9620352/convoy-uber-for-trucking',
infoTitle: 'Convoy, a Seattle-based "Uber for trucking"',
},
{
name: 'Fixt',
icon: 'http://a5.mzstatic.com/us/r30/Purple62/v4/7f/b3/66/7fb366c4-79fd-34e1-3037-ffc02d8a93f7/icon350x350.png',
linkAppStore: 'https://itunes.apple.com/us/app/dropbot-phone-replacement/id1000855694?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=co.fixt',
infoLink: 'http://www.phonearena.com/news/Fixt-is-an-app-that-promises-a-hassle-free-smartphone-repairy-service_id81069',
infoTitle: 'A hassle-free smartphone repair service',
},
{
name: 'Leanpub',
icon: 'http://a2.mzstatic.com/us/r30/Purple6/v4/9f/4a/6f/9f4a6f8c-8951-ed89-4083-74ace23df9ef/icon350x350.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/leanpub/id913517110?ls=1&mt=8',
infoLink: 'http://techland.time.com/2011/06/23/how-to-turn-your-blog-into-an-instant-e-book/',
infoTitle: 'Leanpub: How to Turn Your Blog into an Instant E-Book',
},
{
name: 'li.st',
icon: 'https://lh3.googleusercontent.com/tXt0HgJ7dCgOnuQ-lQr1P7E57mnOYfwXhRsV9lGcPwHPVvrDAN6YmpLVFgy88qKrkFI=w300',
linkPlayStore: 'https://play.google.com/store/apps/details?id=st.li.listapp',
infoLink: 'https://www.youtube.com/watch?v=cI9bDvDEsYE',
infoTitle: 'Building li.st for Android with React Native',
},
{
name: 'Lugg Your On-Demand Mover',
icon: 'https://lh3.googleusercontent.com/EV9z7kRRME2KPMBRNHnje7bBNEl_Why2CFq-MfKzBC88uSFJTYr1HO3-nPt-JuVJwKFb=w300',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.lugg',
infoLink: 'https://techcrunch.com/2015/08/26/lugg-an-app-for-on-demand-short-distance-moves-raises-3-8-million/',
infoTitle: 'Lugg, An App for Short-Distance Moves, Raises $3.8 Million',
},
{
name: 'Pimmr',
icon: 'http://a2.mzstatic.com/eu/r30/Purple69/v4/99/da/0e/99da0ee6-bc87-e1a6-1d95-7027c78f50e1/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/nl/app/pimmr/id1023343303?mt=8',
infoLink: 'https://www.crunchbase.com/organization/pimmr#/entity',
infoTitle: 'Pimmr helps you find the needle in the haystack',
},
{
name: 'Project September',
icon: 'http://a4.mzstatic.com/us/r30/Purple30/v4/95/51/b7/9551b72a-d80a-5b1c-5c6d-7fc77d745d31/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/project-september/id1074075331?ls=1&mt=8&_branch_match_id=273849075056044546',
infoLink: 'http://fortune.com/2016/04/14/project-september-alexis-maybank/',
infoTitle: 'Former Gilt CEO Launches New Mobile App',
},
{
name: 'QQ',
icon: 'http://pp.myapp.com/ma_icon/0/icon_6633_1461768893/96',
linkPlayStore: 'http://android.myapp.com/myapp/detail.htm?apkName=com.tencent.mobileqq',
infoLink: 'https://en.wikipedia.org/wiki/Tencent_QQ',
infoTitle: 'QQ is a Chinese messaging service with 829 million active accounts',
},
{
name: 'QQ空间',
icon: 'http://pp.myapp.com/ma_icon/0/icon_9959_1460036593/96',
linkPlayStore: 'http://android.myapp.com/myapp/detail.htm?apkName=com.qzone',
infoLink: 'https://en.wikipedia.org/wiki/Qzone',
infoTitle: 'Qzone is a Chinese social network with over 600 million users',
},
{
name: 'QQ音乐',
icon: 'http://pp.myapp.com/ma_icon/0/icon_6259_1462429453/96',
linkPlayStore: 'http://android.myapp.com/myapp/detail.htm?apkName=com.tencent.qqmusic',
infoLink: 'http://www.wsj.com/articles/tencent-customers-come-for-the-music-stay-for-the-perks-1433869369',
infoTitle: 'Internet giant tries to get people to pay for digital music',
},
{
name: 'Samanage',
icon: 'http://a3.mzstatic.com/us/r30/Purple69/v4/ed/e9/ff/ede9ff34-a9f6-5eb6-2a23-fcb014b326f2/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/samanage/id1033018362',
infoLink: 'https://techcrunch.com/2015/05/20/samanage-raises-16m-as-asset-management-business-grows/',
infoTitle: 'Samanage raises $16M as Asset Management Expands',
},
{
name: 'ShareWis',
icon: 'https://s3-ap-northeast-1.amazonaws.com/sw-misc/sharewis3_app.png',
linkAppStore: 'https://itunes.apple.com/jp/app/id585517208',
infoLink: 'https://www.crunchbase.com/organization/sharewis#/entity',
infoTitle: 'The concept is to turn learning into an adventure',
},
{
name: 'sneat',
icon: 'http://a3.mzstatic.com/eu/r30/Purple49/v4/71/71/df/7171df47-6e03-8619-19a8-07f52186b0ed/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/fr/app/sneat-reservez-les-meilleurs/id1062510079?l=en&mt=8',
infoLink: 'http://www.internetsansfrontieres.com/sneat-application-mobile-reserver-restaurant/',
infoTitle: 'Application mobile pour réserver un restaurant',
},
{
name: 'Ticketea',
icon: 'http://f.cl.ly/items/0n3g3x2t0W0a0d0b1F0C/tkt-icon.png',
linkAppStore: 'https://itunes.apple.com/es/app/entradas-teatro-y-conciertos/id1060067658?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.ticketea.geminis',
infoLink: 'https://techcrunch.com/2013/05/27/ticket-to-ride/',
infoTitle: 'Ticketea raises $4 Million to Beat Ticketmaster',
},
{
name: 'Townske',
icon: 'http://a3.mzstatic.com/us/r30/Purple69/v4/8b/42/20/8b4220af-5165-91fd-0f05-014332df73ef/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/townske-stunning-city-guides/id1018136179?ls=1&mt=8',
infoLink: 'https://hackernoon.com/townske-app-in-react-native-6ad557de7a7c',
infoTitle: '"I would recommend React Native in a heartbeat."',
},
{
name: 'uSwitch - Energy switching app',
icon: 'https://lh3.googleusercontent.com/NpkGlwFWdj7VsK2ueVwlgdrrBrNJ-yN-4TkEHjjSjDUu7NpMcfyAp10p97f0zci0CSFQ=w300',
linkAppStore: 'https://itunes.apple.com/gb/app/uswitch-compare-switch-save/id935325621?mt=8&ct=react',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.uswitchmobileapp',
infoLink: 'https://en.wikipedia.org/wiki/USwitch',
infoTitle: 'uSwitch: a UK-based price comparison service',
},
{
name: 'WEARVR',
icon: 'http://a2.mzstatic.com/eu/r30/Purple69/v4/4f/5a/28/4f5a2876-9530-ef83-e399-c5ef5b2dab80/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/gb/app/wearvr/id1066288171?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.wearvr.app',
infoLink: 'http://venturebeat.com/2015/04/07/virtual-reality-app-store-wear-vr-secures-1-5m-in-funding/',
infoTitle: 'Wear VR secures $1.5M in funding',
},
{
name: 'wego concerts',
icon: 'http://a5.mzstatic.com/us/r30/Purple69/v4/03/91/2d/03912daa-fae7-6a25-5f11-e6b19290b3f4/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/wego-concerts-follow-friends/id869478093?mt=8',
infoLink: 'http://www.nydailynews.com/life-style/wego-concerts-app-links-music-fans-article-1.2066776',
infoTitle: 'Wego Concerts: Like the love child of Tinder and StubHub',
},
{
name: 'Bdsdiet',
icon: 'http://s3.ap-northeast-2.amazonaws.com/bdsdiet-bucket/media/store-icon.png',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.bdsdiet_app',
infoLink: 'https://www.crunchbase.com/organization/bds-diet#/entity',
infoTitle: 'Bdsdiet provides real estate brokerage services through web and live agents in Korea.',
},
{
name: '蜂鸟众包',
icon: 'http://img.wdjimg.com/mms/icon/v1/e/6e/687b129606504cd52632a8cc4ca816ee_256_256.png',
linkPlayStore: 'http://www.wandoujia.com/apps/me.ele.crowdsource',
linkAppStore: 'https://itunes.apple.com/cn/app/feng-niao-zhong-bao-jian-zhi/id1061034377?mt=8',
infoLink: 'https://elelogistics.github.io/about/Crowdsource-App-Write-In-React-Native.html',
infoTitle: '"Fengniao Crowdsource app" is a mobile app, developed by Eleme, Inc, for Fengniao Crowdsource, the largest crowdsourced logistics platform in China.',
},
{
name: '昨日热推',
icon: 'https://frontbin.com/images/apple-touch-icon.png',
linkAppStore: 'https://itunes.apple.com/cn/app/zuo-ri-re-tui/id1137163693?l=en&mt=8',
infoLink: 'https://www.zfanw.com/blog/developing-react-native-image-viewer-library.html',
infoTitle: 'Developing the react-native-image-viewer library',
},
{
name: 'Artsy Collect and Bid on Fine Art & Design',
icon: 'https://raw.githubusercontent.com/artsy/eigen/master/Artsy/Resources/Images.xcassets/AppIcon.appiconset/AppIcon167.png',
linkAppStore: 'https://itunes.apple.com/us/app/artsy-collect-bid-on-fine/id703796080?mt=8',
infoLink: 'https://artsy.github.io/series/react-native-at-artsy/',
infoTitle: 'React Native at Artsy',
},
{
name: 'Huiseoul(惠首尔)',
icon: 'https://cdn.huiseoul.com/icon.png',
linkAppStore: 'https://itunes.apple.com/us/app/hui-shou-er-ni-si-ren-mei/id1127150360?ls=1&mt=8',
infoLink: 'https://engineering.huiseoul.com/building-a-conversational-e-commerce-app-in-6-weeks-with-react-native-c35d46637e07',
infoTitle: 'Building a conversational E-commerce app in 6 weeks with React Native',
},
{
name: 'Baidu(手机百度)',
icon: 'https://ss0.bdstatic.com/-0U0bnSm1A5BphGlnYG/tam-ogel/8b8eb88700776fe293f4f9a74a73aa18_121_121.jpg',
linkPlayStore: 'http://shouji.baidu.com/software/9896302.html',
linkAppStore: 'https://itunes.apple.com/en/app/shou-ji-bai-du-hai-liang-xin/id382201985?l=en&mt=8',
infoLink: 'http://baike.baidu.com/link?url=TW8YhcVN4tO_Jz5VqMclCjGhf12EEqMD_TeVC6efe2REZlx80r6T0dX96hdmNl36XogLyExXzrvFU9rFeqxg_K',
infoTitle: 'Baidu is a search engine that has 600 million users.',
},
{
name: 'Sleeperbot',
icon: 'https://blitzchat.net/uploads/c8425332190a4f4b852d7770ad32e602/original.png',
linkAppStore: 'https://itunes.apple.com/us/app/sleeperbot-fantasy-football/id987367543?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.sleeperbot&hl=en',
infoLink: 'https://medium.com/sleeperbot-hq/switching-to-react-native-in-production-on-ios-and-android-e6b675402712#.cug6h6qhn',
infoTitle: 'Switching to React Native in Production on iOS and Android',
}
];
var featured = require('./showcaseData').featured;
var pinned = require('./showcaseData').pinned;
featured.sort(function(a, b) {
return a.name.localeCompare(b.name);
});
var apps = pinned.concat(featured);
var AppList = React.createClass({
@ -380,9 +31,9 @@ var AppList = React.createClass({
_renderApp: function(app, i) {
var inner = (
<div>
<img src={app.icon} alt={app.name} />
<h3>{app.name}</h3>
{app.linkAppStore || app.linkPlayStore ? this._renderLinks(app) : null}
{this._renderIcon(app)}
{this._renderTitle(app)}
{this._renderLinks(app)}
{this._renderInfo(app)}
</div>
);
@ -391,14 +42,47 @@ var AppList = React.createClass({
return (<div className="showcase" key={i}>{inner}</div>);
}
var className = "showcase";
if (app.pinned) {
// className = "showcase pinned";
}
return (
<div className="showcase" key={i}>
<div className={className} key={i}>
{inner}
</div>
);
},
_renderIcon: function(app) {
var icon = (
<img src={app.icon} alt={app.name} />
);
return (
{icon}
);
},
_renderTitle: function(app) {
// if (app.pinned) {
// return;
// }
var title = (
<h3>{app.name}</h3>
);
return (
{title}
);
},
_renderInfo: function(app) {
// if (app.pinned) {
// return;
// }
if (!app.infoLink) {
return;
}
@ -409,6 +93,14 @@ var AppList = React.createClass({
},
_renderLinks: function(app) {
if (app.pinned) {
return;
}
if (!app.linkAppStore && !app.linkPlayStore) {
return;
}
var linkAppStore = app.linkAppStore ? <a href={app.linkAppStore} target="_blank">iOS</a> : '';
var linkPlayStore = app.linkPlayStore ? <a href={app.linkPlayStore} target="_blank">Android</a> : '';
@ -428,17 +120,22 @@ var showcase = React.createClass({
<Site section="showcase" title="Showcase">
<section className="content wrap documentationContent nosidebar showcaseSection">
<div className="inner-content showcaseHeader">
<h1 style={{textAlign: 'center'}}>The React Native Showcase</h1>
<h1 style={{textAlign: 'center'}}>Who's using React Native?</h1>
<div className="subHeader"></div>
<p>Thousands of apps are using React Native in production, from established Fortune 500 companies to hot new startups. If you're curious to see what can be accomplished with React Native, check out these apps!</p>
<p>Thousands of apps are using React Native, from established Fortune 500 companies to hot new startups. If you're curious to see what can be accomplished with React Native, check out these apps!</p>
<div className="inner-content">
<AppList apps={featured} />
<AppList apps={apps} />
</div>
<div className="inner-content showcaseHeader">
<p>If you built a popular application using React Native, we'd love to have your app on this showcase. Check out the <a href="https://github.com/facebook/react-native/blob/master/website/src/react-native/showcase.js">guidelines on GitHub</a> to update this page.</p>
<p className="footnote">
Some of these are hybrid native/React Native apps.
</p>
<div className="inner-content">
<p>If you built a popular application using React Native, we'd love to have your app on this showcase. Check out the <a href="https://github.com/facebook/react-native/blob/master/website/src/react-native/showcaseData.js">guidelines on GitHub</a> to update this page.</p>
</div>
</div>
</section>

463
website/src/react-native/showcaseData.js vendored Normal file
View File

@ -0,0 +1,463 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
/*
Thousands of applications use React Native, so we can't list all of them
in our showcase. To be useful to someone looking through the showcase,
either the app must be something that most readers would recognize, or the
makers of the application must have posted useful technical content about the
making of the app. It also must be useful considering that the majority of
readers only speak English. So, each app in the showcase should link to either:
1/ An English-language news article discussing the app, built either by a funded startup or for a public company
2/ An English-language technical post on a funded startup or public company blog discussing React Native
For each app in the showcase, use infoLink and infoTitle to reference this
content.
*/
var featured = [
{
name: 'QQ空间',
icon: 'http://pp.myapp.com/ma_icon/0/icon_9959_1460036593/96',
linkPlayStore: 'http://android.myapp.com/myapp/detail.htm?apkName=com.qzone',
infoLink: 'https://en.wikipedia.org/wiki/Qzone',
infoTitle: 'Qzone is a Chinese social network with over 600 million users',
pinned: false,
},
{
name: 'QQ音乐',
icon: 'http://pp.myapp.com/ma_icon/0/icon_6259_1462429453/96',
linkPlayStore: 'http://android.myapp.com/myapp/detail.htm?apkName=com.tencent.qqmusic',
infoLink: 'http://www.wsj.com/articles/tencent-customers-come-for-the-music-stay-for-the-perks-1433869369',
infoTitle: 'Internet giant tries to get people to pay for digital music',
pinned: false,
},
{
name: 'FanVision Bolt',
icon: 'http://a4.mzstatic.com/us/r30/Purple18/v4/94/b4/6e/94b46ee5-80e3-ff6e-513d-16da926b03a3/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/fanvision-bolt/id1081891275',
infoLink: 'https://www.youtube.com/watch?v=oWOcAXyDf0w',
infoTitle: 'FanVision Bolt accessory + app provide live audio/video and stats at NASCAR events',
pinned: false,
},
{
name: 'F8',
icon: 'https://raw.githubusercontent.com/fbsamples/f8app/master/ios/F8v2/Images.xcassets/AppIcon.appiconset/AppIcon%402x.png',
linkAppStore: 'https://itunes.apple.com/us/app/f8/id853467066?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.facebook.f8',
infoLink: 'http://makeitopen.com/tutorials/building-the-f8-app/planning/',
infoTitle: 'Building the F8 App',
pinned: false,
},
{
name: 'Discovery VR',
icon: 'http://a2.mzstatic.com/us/r30/Purple6/v4/d1/d5/f4/d1d5f437-9f6b-b5aa-5fe7-47bd19f934bf/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/discovery-vr/id1030815031?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.discovery.DiscoveryVR',
infoLink: 'https://medium.com/ios-os-x-development/an-ios-developer-on-react-native-1f24786c29f0',
infoTitle: '"I may never write an iOS app in Objective-C or Swift again."',
pinned: false,
},
{
name: 'Movie Trailers by MovieLaLa',
icon: 'https://lh3.googleusercontent.com/16aug4m_6tvJB7QZden9w1SOMqpZgNp7rHqDhltZNvofw1a4V_ojGGXUMPGiK0dDCqzL=w300',
linkAppStore: 'https://itunes.apple.com/us/app/movie-trailers-by-movielala/id1001416601?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.movielala.trailers',
infoLink: 'http://variety.com/2016/digital/news/movielala-1-4-million-seed-round-hollywood-angel-investors-1201678139/',
infoTitle: 'MovieLaLa Closes $1.4 Million Seed Round',
pinned: false,
},
{
name: 'Myntra',
icon: 'http://a5.mzstatic.com/us/r30/Purple6/v4/9c/78/df/9c78dfa6-0061-1af2-5026-3e1d5a073c94/icon350x350.png',
linkAppStore: 'https://itunes.apple.com/in/app/myntra-fashion-shopping-app/id907394059',
infoLink: 'https://techcrunch.com/2014/05/22/flipkart-myntra-acqusition/',
infoTitle: 'Flipkart Buys Fashion E-tailer Myntra To Fight Amazon',
pinned: false,
},
{
name: 'SoundCloud Pulse',
icon: 'https://i1.sndcdn.com/artworks-000149203716-k5je96-original.jpg',
linkAppStore: 'https://itunes.apple.com/us/app/soundcloud-pulse-for-creators/id1074278256?mt=8',
infoLink: 'https://blog.soundcloud.com/2016/02/23/soundcloud-pulse-now-on-iphone/',
infoTitle: 'SoundCloud Pulse: now on iPhone',
pinned: false,
},
{
name: 'Start - medication manager for depression',
icon: 'http://a1.mzstatic.com/us/r30/Purple49/v4/de/9b/6f/de9b6fe8-84ea-7a12-ba2c-0a6d6c7b10b0/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/start-medication-manager-for/id1012099928?mt=8',
infoLink: 'http://www.nytimes.com/2014/09/24/technology/to-gather-drug-information-a-health-start-up-turns-to-consumers.html?_r=0',
infoTitle: 'NYT: A Health Startup Turns to Consumers',
pinned: false,
},
{
name: 'Taxfyle - taxes filed on-demand via licensed CPA',
icon: 'https://s3.amazonaws.com/taxfyle-public/images/taxfyle-icon-1024px.png',
linkAppStore: 'https://itunes.apple.com/us/app/taxfyle/id1058033104?mt=8',
infoLink: 'http://www.techinsider.io/taxfyle-wants-to-be-the-uber-for-taxes-2016-4',
infoTitle: 'Taxfyle: the Uber for filing taxes',
pinned: false,
},
{
name: 'This AM',
icon: 'http://s3.r29static.com//bin/public/efe/x/1542038/image.png',
linkAppStore: 'https://itunes.apple.com/us/app/refinery29-this-am-top-breaking/id988472315?mt=8',
infoLink: 'https://techcrunch.com/2016/02/01/refinery29-debuts-its-first-app-a-morning-news-round-up-called-refinery29-am/',
infoTitle: 'Refinery29 debuts its first app',
pinned: false,
},
{
name: 'TRED - Sell your car for more',
icon: 'http://a1.mzstatic.com/us/r30/Purple20/v4/b0/0c/07/b00c07d2-a057-06bc-6044-9fdab97f370f/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/tred-sell-my-car-for-more!/id1070071394?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.tredmobile&hl=en',
infoLink: 'http://www.geekwire.com/2015/mobile-dealership-tred-raises-another-1m-to-help-used-car-owners-make-more-money/',
infoTitle: 'Sell your car for thousands more than Craigslist or the dealer with TRED',
pinned: false,
},
{
name: 'Bitt Wallet',
icon: 'http://a4.mzstatic.com/us/r30/Purple69/v4/5b/00/34/5b003497-cc85-a0d0-0d3e-4fb3bc6f95cd/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/bitt-wallet/id1081954916?mt=8',
infoLink: 'https://bitcoinmagazine.com/articles/overstock-invests-in-bitt-to-launch-official-digital-currencies-in-the-caribbean-islands-1459961581',
infoTitle: 'Overstock invests in Bitt to launch digital currencies',
pinned: false,
},
{
name: 'Calor - Field Pro',
icon: 'http://rnfdigital.com/wp-content/uploads/2016/04/FieldProIcon.png',
infoLink: 'http://rnfdigital.com/react-native-a-game-changer-for-enterprise-mobile-development/',
infoTitle: 'React Native: a game changer for Enterprise Mobile Development',
pinned: false,
},
{
name: 'CBS Sports Franchise Football',
icon: 'http://a2.mzstatic.com/us/r30/Purple69/v4/7b/0c/a0/7b0ca007-885a-7cfc-9fa2-2ec4394c2ecc/icon175x175.png',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.cbssports.fantasy.franchisefootball2015',
infoLink: 'http://www.cbssports.com/fantasy/football/games/franchise/2015',
infoTitle: 'The award winning Fantasy Football league manager.',
pinned: false,
},
{
name: 'Coiney窓口',
icon: 'http://a4.mzstatic.com/us/r30/Purple69/v4/c9/bc/3a/c9bc3a29-9c11-868f-b960-ca46d5fcd509/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/jp/app/coiney-chuang-kou/id1069271336?mt=8',
infoLink: 'https://www.techinasia.com/japan-startup-coiney-aims-for-ipo',
infoTitle: 'Japanese startup Coiney aims for IPO',
pinned: false,
},
{
name: 'Convoy Driver',
icon: 'http://a1.mzstatic.com/us/r30/Purple30/v4/5a/74/56/5a74567d-4491-a298-65cd-722c8a7211ac/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/convoy-driver/id1045368390?mt=8',
infoLink: 'http://www.theverge.com/2015/10/27/9620352/convoy-uber-for-trucking',
infoTitle: 'Convoy, a Seattle-based "Uber for trucking"',
pinned: false,
},
{
name: 'Fixt',
icon: 'http://a5.mzstatic.com/us/r30/Purple62/v4/7f/b3/66/7fb366c4-79fd-34e1-3037-ffc02d8a93f7/icon350x350.png',
linkAppStore: 'https://itunes.apple.com/us/app/dropbot-phone-replacement/id1000855694?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=co.fixt',
infoLink: 'http://www.phonearena.com/news/Fixt-is-an-app-that-promises-a-hassle-free-smartphone-repairy-service_id81069',
infoTitle: 'A hassle-free smartphone repair service',
pinned: false,
},
{
name: 'Leanpub',
icon: 'http://a2.mzstatic.com/us/r30/Purple6/v4/9f/4a/6f/9f4a6f8c-8951-ed89-4083-74ace23df9ef/icon350x350.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/leanpub/id913517110?ls=1&mt=8',
infoLink: 'http://techland.time.com/2011/06/23/how-to-turn-your-blog-into-an-instant-e-book/',
infoTitle: 'Leanpub: How to Turn Your Blog into an Instant E-Book',
pinned: false,
},
{
name: 'Lugg Your On-Demand Mover',
icon: 'https://lh3.googleusercontent.com/EV9z7kRRME2KPMBRNHnje7bBNEl_Why2CFq-MfKzBC88uSFJTYr1HO3-nPt-JuVJwKFb=w300',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.lugg',
infoLink: 'https://techcrunch.com/2015/08/26/lugg-an-app-for-on-demand-short-distance-moves-raises-3-8-million/',
infoTitle: 'Lugg, An App for Short-Distance Moves, Raises $3.8 Million',
pinned: false,
},
{
name: 'Pimmr',
icon: 'http://a2.mzstatic.com/eu/r30/Purple69/v4/99/da/0e/99da0ee6-bc87-e1a6-1d95-7027c78f50e1/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/nl/app/pimmr/id1023343303?mt=8',
infoLink: 'https://www.crunchbase.com/organization/pimmr#/entity',
infoTitle: 'Pimmr helps you find the needle in the haystack',
pinned: false,
},
{
name: 'Project September',
icon: 'http://a4.mzstatic.com/us/r30/Purple30/v4/95/51/b7/9551b72a-d80a-5b1c-5c6d-7fc77d745d31/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/project-september/id1074075331?ls=1&mt=8&_branch_match_id=273849075056044546',
infoLink: 'http://fortune.com/2016/04/14/project-september-alexis-maybank/',
infoTitle: 'Former Gilt CEO Launches New Mobile App',
pinned: false,
},
{
name: 'Samanage',
icon: 'http://a3.mzstatic.com/us/r30/Purple69/v4/ed/e9/ff/ede9ff34-a9f6-5eb6-2a23-fcb014b326f2/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/samanage/id1033018362',
infoLink: 'https://techcrunch.com/2015/05/20/samanage-raises-16m-as-asset-management-business-grows/',
infoTitle: 'Samanage raises $16M as Asset Management Expands',
pinned: false,
},
{
name: 'ShareWis',
icon: 'https://s3-ap-northeast-1.amazonaws.com/sw-misc/sharewis3_app.png',
linkAppStore: 'https://itunes.apple.com/jp/app/id585517208',
infoLink: 'https://www.crunchbase.com/organization/sharewis#/entity',
infoTitle: 'The concept is to turn learning into an adventure',
pinned: false,
},
{
name: 'sneat',
icon: 'http://a3.mzstatic.com/eu/r30/Purple49/v4/71/71/df/7171df47-6e03-8619-19a8-07f52186b0ed/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/fr/app/sneat-reservez-les-meilleurs/id1062510079?l=en&mt=8',
infoLink: 'http://www.internetsansfrontieres.com/sneat-application-mobile-reserver-restaurant/',
infoTitle: 'Application mobile pour réserver un restaurant',
pinned: false,
},
{
name: 'Ticketea',
icon: 'http://f.cl.ly/items/0n3g3x2t0W0a0d0b1F0C/tkt-icon.png',
linkAppStore: 'https://itunes.apple.com/es/app/entradas-teatro-y-conciertos/id1060067658?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.ticketea.geminis',
infoLink: 'https://techcrunch.com/2013/05/27/ticket-to-ride/',
infoTitle: 'Ticketea raises $4 Million to Beat Ticketmaster',
pinned: false,
},
{
name: 'uSwitch - Energy switching app',
icon: 'https://lh3.googleusercontent.com/NpkGlwFWdj7VsK2ueVwlgdrrBrNJ-yN-4TkEHjjSjDUu7NpMcfyAp10p97f0zci0CSFQ=w300',
linkAppStore: 'https://itunes.apple.com/gb/app/uswitch-compare-switch-save/id935325621?mt=8&ct=react',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.uswitchmobileapp',
infoLink: 'https://en.wikipedia.org/wiki/USwitch',
infoTitle: 'uSwitch: a UK-based price comparison service',
pinned: false,
},
{
name: 'WEARVR',
icon: 'http://a2.mzstatic.com/eu/r30/Purple69/v4/4f/5a/28/4f5a2876-9530-ef83-e399-c5ef5b2dab80/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/gb/app/wearvr/id1066288171?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.wearvr.app',
infoLink: 'http://venturebeat.com/2015/04/07/virtual-reality-app-store-wear-vr-secures-1-5m-in-funding/',
infoTitle: 'Wear VR secures $1.5M in funding',
pinned: false,
},
{
name: 'wego concerts',
icon: 'http://a5.mzstatic.com/us/r30/Purple69/v4/03/91/2d/03912daa-fae7-6a25-5f11-e6b19290b3f4/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/wego-concerts-follow-friends/id869478093?mt=8',
infoLink: 'http://www.nydailynews.com/life-style/wego-concerts-app-links-music-fans-article-1.2066776',
infoTitle: 'Wego Concerts: Like the love child of Tinder and StubHub',
pinned: false,
},
{
name: 'Bdsdiet',
icon: 'http://s3.ap-northeast-2.amazonaws.com/bdsdiet-bucket/media/store-icon.png',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.bdsdiet_app',
infoLink: 'https://www.crunchbase.com/organization/bds-diet#/entity',
infoTitle: 'Bdsdiet provides real estate brokerage services through web and live agents in Korea.',
pinned: false,
},
{
name: '蜂鸟众包',
icon: 'http://img.wdjimg.com/mms/icon/v1/e/6e/687b129606504cd52632a8cc4ca816ee_256_256.png',
linkPlayStore: 'http://www.wandoujia.com/apps/me.ele.crowdsource',
linkAppStore: 'https://itunes.apple.com/cn/app/feng-niao-zhong-bao-jian-zhi/id1061034377?mt=8',
infoLink: 'https://elelogistics.github.io/about/Crowdsource-App-Write-In-React-Native.html',
infoTitle: '"Fengniao Crowdsource app" is a mobile app, developed by Eleme, Inc, for Fengniao Crowdsource, the largest crowdsourced logistics platform in China.',
pinned: false,
},
{
name: '昨日热推',
icon: 'https://frontbin.com/images/apple-touch-icon.png',
linkAppStore: 'https://itunes.apple.com/cn/app/zuo-ri-re-tui/id1137163693?l=en&mt=8',
infoLink: 'https://www.zfanw.com/blog/developing-react-native-image-viewer-library.html',
infoTitle: 'Developing the react-native-image-viewer library',
pinned: false,
},
{
name: 'Artsy Collect and Bid on Fine Art & Design',
icon: 'https://raw.githubusercontent.com/artsy/eigen/master/Artsy/Resources/Images.xcassets/AppIcon.appiconset/AppIcon167.png',
linkAppStore: 'https://itunes.apple.com/us/app/artsy-collect-bid-on-fine/id703796080?mt=8',
infoLink: 'https://artsy.github.io/series/react-native-at-artsy/',
infoTitle: 'React Native at Artsy',
pinned: false,
},
{
name: 'Huiseoul(惠首尔)',
icon: 'https://cdn.huiseoul.com/icon.png',
linkAppStore: 'https://itunes.apple.com/us/app/hui-shou-er-ni-si-ren-mei/id1127150360?ls=1&mt=8',
infoLink: 'https://engineering.huiseoul.com/building-a-conversational-e-commerce-app-in-6-weeks-with-react-native-c35d46637e07',
infoTitle: 'Building a conversational E-commerce app in 6 weeks with React Native',
pinned: false,
},
{
name: 'PlaceAVote',
icon: 'https://s12.postimg.org/nr79mplq5/pav_Icon.png',
linkAppStore: 'https://itunes.apple.com/us/app/placeavote/id1120628991?ls=1&mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.placeavote.androidapp&hl=en',
infoLink: 'https://techcrunch.com/2016/05/10/placeavote-wants-to-give-voters-a-say-in-congress/',
infoTitle: 'PlaceAVote wants to give voters a say in Congress',
pinned: false,
},
{
name: 'Robin Rooms',
icon: 'http://robinpowered.s3.amazonaws.com/rooms/appicon.png',
linkAppStore: 'https://itunes.apple.com/us/app/robin-rooms/id947566115',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.robinpowered.rooms',
infoLink: 'https://techcrunch.com/2016/05/31/robin-makes-the-office-smarter-with-7-million-in-new-funding/',
infoTitle: 'Robin Rooms manages and mounts outside your conference rooms'
},
{
name: 'Sleeperbot',
icon: 'https://blitzchat.net/uploads/c8425332190a4f4b852d7770ad32e602/original.png',
linkAppStore: 'https://itunes.apple.com/us/app/sleeperbot-fantasy-football/id987367543?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.sleeperbot&hl=en',
infoLink: 'https://medium.com/sleeperbot-hq/switching-to-react-native-in-production-on-ios-and-android-e6b675402712#.cug6h6qhn',
infoTitle: 'Switching to React Native in Production on iOS and Android',
}
];
/*
If you want your app to be featured in the showcase, add them to the featured
hash above this line. The pinned list is reserved for a small list of hand-picked apps.
*/
var pinned = [
{
name: 'Facebook',
icon: 'https://lh3.googleusercontent.com/ZZPdzvlpK9r_Df9C3M7j1rNRi7hhHRvPhlklJ3lfi5jk86Jd1s0Y5wcQ1QgbVaAP5Q=w300',
linkAppStore: 'https://itunes.apple.com/app/facebook/id284882215',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.facebook.katana&hl=en',
infoLink: 'https://code.facebook.com/posts/895897210527114/dive-into-react-native-performance/',
infoTitle: 'Using React Native in the Facebook App',
defaultLink: 'https://itunes.apple.com/app/facebook/id284882215',
pinned: true,
},
{
name: 'Facebook Ads Manager',
icon: 'http://is5.mzstatic.com/image/pf/us/r30/Purple5/v4/9e/16/86/9e1686ef-cc55-805a-c977-538ddb5e6832/mzl.gqbhwitj.png',
linkAppStore: 'https://itunes.apple.com/us/app/facebook-ads-manager/id964397083?mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.facebook.adsmanager',
infoLink: 'https://code.facebook.com/posts/1189117404435352/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/',
infoTitle: 'How We Built the First Cross-Platform React Native App',
defaultLink: 'https://itunes.apple.com/us/app/facebook-ads-manager/id964397083?mt=8',
pinned: true,
},
{
name: 'Facebook Groups',
icon: 'http://is4.mzstatic.com/image/pf/us/r30/Purple69/v4/57/f8/4c/57f84c0c-793d-5f9a-95ee-c212d0369e37/mzl.ugjwfhzx.png',
linkAppStore: 'https://itunes.apple.com/us/app/facebook-groups/id931735837?mt=8',
infoLink: 'https://code.facebook.com/posts/1014532261909640/react-native-bringing-modern-web-techniques-to-mobile/',
infoTitle: 'React Native: Bringing Modern Web Techniques to Mobile',
defaultLink: 'https://itunes.apple.com/us/app/facebook-groups/id931735837?mt=8',
pinned: true,
},
{
name: 'Instagram',
icon: 'http://a4.mzstatic.com/us/r30/Purple62/v4/1f/8d/f9/1f8df910-8ec7-3b8e-0104-d44e869f4d65/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/app/instagram/id389801252?pt=428156&ct=igweb.unifiedHome.badge&mt=8',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.instagram.android&referrer=utm_source%3Dinstagramweb%26utm_campaign%3DunifiedHome%26utm_medium%3Dbadge',
infoLink: '',
infoTitle: '',
defaultLink: 'https://www.instagram.com/',
pinned: true,
},
{
name: 'Airbnb',
icon: 'https://a2.muscache.com/airbnb/static/icons/apple-touch-icon-180x180-bcbe0e3960cd084eb8eaf1353cf3c730.png',
linkAppStore: 'https://itunes.apple.com/us/app/airbnb/id401626263?mt=8&bev=1472279725_4ITWKWGX6KrmU6pT&utm_medium=web&utm_source=airbnb&_branch_match_id=307510898795870823',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.airbnb.android&hl=en&referrer=bev%3D1472279725_4ITWKWGX6KrmU6pT%26utm_medium%3Dweb%26utm_source%3Dairbnb',
infoLink: 'https://www.youtube.com/watch?v=tUfgQtmG3R0',
infoTitle: 'Tech Talk: Hybrid React Native Apps at Airbnb',
defaultLink: 'https://www.airbnb.com/mobile',
pinned: true,
},
{
name: 'Airbnb',
icon: 'https://a2.muscache.com/airbnb/static/icons/apple-touch-icon-180x180-bcbe0e3960cd084eb8eaf1353cf3c730.png',
linkAppStore: 'https://itunes.apple.com/us/app/airbnb/id401626263?mt=8&bev=1472279725_4ITWKWGX6KrmU6pT&utm_medium=web&utm_source=airbnb&_branch_match_id=307510898795870823',
linkPlayStore: 'https://play.google.com/store/apps/details?id=com.airbnb.android&hl=en&referrer=bev%3D1472279725_4ITWKWGX6KrmU6pT%26utm_medium%3Dweb%26utm_source%3Dairbnb',
infoLink: 'https://www.youtube.com/watch?v=tUfgQtmG3R0',
infoTitle: 'Tech Talk: Hybrid React Native Apps at Airbnb',
defaultLink: 'https://www.airbnb.com/mobile',
pinned: true,
},
{
name: 'Baidu(手机百度)',
icon: 'http://a3.mzstatic.com/us/r30/Purple62/v4/90/7c/9b/907c9b4e-556d-1a45-45d4-0ea801719abd/icon175x175.png',
linkPlayStore: 'http://shouji.baidu.com/software/9896302.html',
linkAppStore: 'https://itunes.apple.com/en/app/shou-ji-bai-du-hai-liang-xin/id382201985?l=en&mt=8',
infoLink: 'http://baike.baidu.com/link?url=TW8YhcVN4tO_Jz5VqMclCjGhf12EEqMD_TeVC6efe2REZlx80r6T0dX96hdmNl36XogLyExXzrvFU9rFeqxg_K',
infoTitle: 'Baidu is a search engine that has 600 million users.',
defaultLink: 'http://baike.baidu.com/link?url=TW8YhcVN4tO_Jz5VqMclCjGhf12EEqMD_TeVC6efe2REZlx80r6T0dX96hdmNl36XogLyExXzrvFU9rFeqxg_K',
pinned: true,
},
{
name: 'Discord',
icon: 'http://a5.mzstatic.com/us/r30/Purple5/v4/c1/2f/4c/c12f4cba-1d9a-f6bf-2240-04085d3470ec/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/us/app/discord-chat-for-gamers/id985746746?mt=8',
infoLink: 'https://discord.engineering/react-native-deep-dive-91fd5e949933#.5jnqftgof',
infoTitle: 'Using React Native: One Year Later',
defaultLink: 'https://itunes.apple.com/us/app/discord-chat-for-gamers/id985746746?mt=8',
pinned: true,
},
{
name: 'Gyroscope',
icon: 'https://media.gyrosco.pe/images/magneto/180x180.png',
linkAppStore: 'https://itunes.apple.com/app/apple-store/id1104085053?pt=117927205&ct=website&mt=8',
infoLink: 'https://blog.gyrosco.pe/building-the-app-1dac1a97d253',
infoTitle: '"Building a visualization experience with React Native."',
defaultLink: 'https://itunes.apple.com/app/apple-store/id1104085053?pt=117927205&ct=website&mt=8',
pinned: true,
},
{
name: 'li.st',
icon: 'https://lh3.googleusercontent.com/tXt0HgJ7dCgOnuQ-lQr1P7E57mnOYfwXhRsV9lGcPwHPVvrDAN6YmpLVFgy88qKrkFI=w300',
linkPlayStore: 'https://play.google.com/store/apps/details?id=st.li.listapp',
infoLink: 'https://www.youtube.com/watch?v=cI9bDvDEsYE',
infoTitle: 'Building li.st for Android with React Native',
defaultLink: 'https://play.google.com/store/apps/details?id=st.li.listapp',
pinned: true,
},
{
name: 'QQ',
icon: 'http://pp.myapp.com/ma_icon/0/icon_6633_1461768893/96',
linkPlayStore: 'http://android.myapp.com/myapp/detail.htm?apkName=com.tencent.mobileqq',
infoLink: 'https://en.wikipedia.org/wiki/Tencent_QQ',
infoTitle: 'QQ is a Chinese messaging service with 829 million active accounts',
defaultLink: 'http://android.myapp.com/myapp/detail.htm?apkName=com.tencent.mobileqq',
pinned: true,
},
{
name: 'Townske',
icon: 'http://a3.mzstatic.com/us/r30/Purple69/v4/8b/42/20/8b4220af-5165-91fd-0f05-014332df73ef/icon175x175.png',
linkAppStore: 'https://itunes.apple.com/us/app/townske-stunning-city-guides/id1018136179?ls=1&mt=8',
infoLink: 'https://hackernoon.com/townske-app-in-react-native-6ad557de7a7c',
infoTitle: '"I would recommend React Native in a heartbeat."',
defaultLink: 'https://itunes.apple.com/us/app/townske-stunning-city-guides/id1018136179?ls=1&mt=8',
pinned: true,
},
{
name: 'Vogue',
icon: 'http://a2.mzstatic.com/us/r30/Purple30/v4/06/24/92/0624927f-a389-746c-27f9-e2466d59e55b/icon175x175.jpeg',
linkAppStore: 'https://itunes.apple.com/app/apple-store/id1087973225?pt=45076&ct=site-promo&mt=8',
infoLink: 'http://www.vogue.com/app',
infoTitle: '',
defaultLink: 'https://itunes.apple.com/app/apple-store/id1087973225?pt=45076&ct=site-promo&mt=8',
pinned: true,
}
];
module.exports = { featured, pinned };