junedomingo/movieapp

Discover Movies and TV shows - React Native

movieapp

Discover Movies and TV shows

Download APK file

• Download from Google Drive - v2.2.1

What's included

Name	Description
React Native	Build Native Mobile Apps using JavaScript and React.
React Native Navigation	App-wide support for 100% native navigation with an easy cross-platform interface.
Redux	Predictable state container for JavaScript apps.
Redux Thunk	Thunk middleware for Redux
ESLint	The pluggable linting utility for JavaScript and JSX

Requirements

• Node >= 5.0.0
• npm >= 3

Installation

Clone this repo

$ git clone [email protected]:JuneDomingo/movieapp.git
$ cd movieapp
$ yarn install or npm install

Create .env file in your root directory and add the following

TMDB_URL=https://api.themoviedb.org/3
TMDB_IMG_URL=https://image.tmdb.org/t/p
TMDB_API_KEY=your_tmdb_api_key_here

YOUTUBE_URL=https://www.googleapis.com/youtube/v3/videos
YOUTUBE_API_KEY=your_youtube_api_key_here

Get api key - TMDB - Youtube

How to start

$ react-native run-android
$ react-native run-ios

Exponent/ex-navigation version

Brent Vatne did awesome work to make this run on exponent, checkout his repo

• Open this app in exponent

How to rename react native app?

react-native-rename - Rename react-native app with just one command

movieapp's Issues

iOS: DeviceInfo native module is not installed correctly

I'm trying to run this project on iOS simulator, but I'm getting the following error: ExceptionsManager.js:71 Unhandled JS Exception: DeviceInfo native module is not installed correctly

Tab's design issue in movie.js file

when i click on casts and trailers tab then it shows too much extra space between content and tabs.

How do you register the application?

Hello,

Thanks for the work and example, kind of trying to replicate this with RNN v2, but I cannot make my repository to work.

I cannot find where you call
AppRegistry.registerComponent("movieapp", () => ...)
or equivalent anywhere.
So my version get the

Application [name] has not been registered. error

Could you please elaborate ? I did a few hypothesis, but none worked.

Thanks!

Android - drawer navigations not really working

this is a really great example project - thank you for this effort.

I wanted to extend the drawer and perform some navigation between a bunch of screens but it seems to not work. I've been struggling with this for hours now.

this.props.navigator.popToRoot is not doing anything. Can you please extend the app and demonstrate how to navigate to a different Screen (not in Modal mode like you did for the search screen)

new Promise.all()

const iconsLoaded = new Promise((resolve, reject) => {
	new Promise.all(
		Object.keys(icons).map(iconName =>
		// IconName--suffix--other-suffix is just the mapping name in iconsMap
		Ionicons.getImageSource(
		iconName.replace(replaceSuffixPattern, ''),
		icons[iconName][0],
		icons[iconName][1]
		))
	).then(sources => {
		Object.keys(icons)
		.forEach((iconName, idx) => (iconsMap[iconName] = sources[idx]));

		// Call resolve (and we are done)
		resolve(true);
	});
});

who can help me understand why following code working:
new Promise.all().then() ... i test this code in jsfiddle tell me an TypeError:
Promise.all is not a constructor

What's the purpose of making an `App` class a subclass of a `Component`

First of all thank you for the great bootstrap example!

Have few questions:

1. What's the purpose of making an App class a subclass of a Component i.e. class App extends Component?
2. And also why do you assign new App(); to a const const app = new App();?

Adding Tabs to Android App - Freezes the app in release mode

Thanks for the lovely app.

I have tried to make a small change to your app by adding tabs for Andorid and noticed that while the app works perfectly in DEV mode, the app freezes when built and run on a device in release mode.

I am not sure where the defect is.
i.e. The code that I added or the react-native-navigation library that was used for the tabs etc. So I thought I will start with this project and then make a request to react-native-navigation in case you feel the issue is not related to this project.

Here is what I have done to reproduce the issue:

1. Clone MovieApp project
2. Comment out startSingleScreenApp and Add code to start as tabs app: (as Follows)

/*
Navigation.startSingleScreenApp({
screen: {
screen: 'movieapp.Movies',
title: 'Movies',
navigatorStyle
},
drawer: {
left: {
screen: 'movieapp.Drawer'
}
}
});
*/

const createTabs = () => {
let tabs = [
{
label: 'Movies',
screen: 'movieapp.Movies',
icon: require('./img/movies.png'),
title: 'Movies'
},
{
label: 'TV Shows',
screen: 'movieapp.Movies',
icon: require('./img/tvshow.png'),
title: 'TV Shows',

}

];

return tabs;
};
// this will start our app
Navigation.startTabBasedApp({
tabs: createTabs(),
appStyle: {
tabBarBackgroundColor: '#0f2362',
tabBarButtonColor: '#ffffff',
tabBarSelectedButtonColor: '#63d7cc'
}

3. Build in release mode and deploy to device.

Whats strange is that if you build in dev and run it on the simulator, I dont experience an issue.

note: in case you need to see what I have done, I have forked your project and made the changes here:
https://github.com/dhammikab/movieapp

Splash screen with app icon ?

Hello,

Why after the blank splash screen the background icon appear just before the first screen ?

Thanks.

App crashes with callTimers error

When I clone this repo and do yarn install and then react-native run-ios, the app launches with an error: Module JSTimerExecution is not a registered callable module (calling callTimers)

App not launching on Android or iOS

I have tried to compile and launch the app using the latest source, but I don't get anything in Genymotion.

With the iOS emulator, I get a "basic" (aka the default RN screen white background / just saying MobileApp).

Could this be due to an incompatibility with a new version of RN ?

unexpected url: undefined/movie/now_playing?api_key=un...

This issue on IOS too.

:/

Unable to build on iOS

I am having the same issue of #7. I have tried multiple times to build for ios but with no luck.

I have tried with both yarn and npm.

From the CLI:

Signing Identity:     "-"

    /usr/bin/codesign --force --sign - --timestamp=none /***/movieapp/ios/build/Build/Products/Debug-iphonesimulator/movieapp.app/PlugIns/movieappTests.xctest



** BUILD SUCCEEDED **



The following commands produced analyzer issues:
        Analyze Views/RCTMapManager.m
        Analyze Modules/RCTRedBox.m
(2 commands with analyzer issues)

Installing build/Build/Products/Debug-iphonesimulator/movieapp.app
Launching org.reactjs.native.example.movieapp
org.reactjs.native.example.movieapp: 15496

Simulator:

I have also tried building from xcode but same result
Do you have any idea of what could be the issue? Thanks!

undefined const on constants/api.js

Hy june..

i have tried to run this source for learning, but i got some problem on react-native-config
on constants/api.js all line got error undefined, i see in react-native-config documentation it need .env on root directory, like

API_URL=https://myapi.com
GOOGLE_MAPS_API_KEY=abcdefgh

but i don't see it in your source
Thanks for helping btw..

undefined is not object(evaluating 'p.PropTypes.object')

When i run the app this error coming:
undefined is not object(evaluating 'p.PropTypes.object')

Unable to build under Windows 10 / MacOS

Hi, I tried to build this project in both platforms but no luck.

npm install returns quite some dependencies error like whatwg-fetch is now required by jest which leads to needing react 15.4.1, etc.

After fixing all those errors, react-native run-android returns error:
:app:generateDebugBuildConfig FAILED

FAILURE: Build failed with an exception.

• What went wrong:
  Execution failed for task ':app:generateDebugBuildConfig'.

Failed to create C:\rn\movieapp\android\app\build\generated\source\buildConfig\debug\com\movieapp

I am doing this under windows cmd, administrator mode already.

Really want to try this project out. Kindly help if you can spare some. Thank you!

Search error

Why happen this error when I write word in search?

RCCManager.h file not found

i am trying to build on ios and it's give me this error: RCCManager.h file not found

Icon issue on navBar

error in packager

Error

React packager ready.

Loading dependency graph...jest-haste-map: @providesModule naming collision:
  Duplicate module name: fb-watchman
  Paths: C:\Users\mirko\Downloads\movieapp\node_modules\react-native\node_modules\jest-haste-map\node_modules\sane\node_modules\fb-watchman\package.json collides with C:\Users\mirko\Downloads\movieapp\node_modules\react-native\node_modules\fb-watchman\package.json

This warning is caused by a @providesModule declaration with the same name across two different files.
Loading dependency graph, done.
Bundling `index.android.js`  100.0% (656/656), done.

Steps:

• git clone from master
• yarn install
• react-native start

com.facebook.react.common.javascriptexception{}

how to fix it.. thanks.

network errors from TMDB

Getting network errors from TMDB

movies.actions.js:60 Now Playing Error: Network Error
    at createError (createError.js:16)
    at XMLHttpRequest.handleError (xhr.js:87)
    at XMLHttpRequest.dispatchEvent (event-target.js:172)
    at XMLHttpRequest.setReadyState (XMLHttpRequest.js:546)
    at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:381)
    at XMLHttpRequest.js:485
    at RCTDeviceEventEmitter.emit (EventEmitter.js:181)
    at MessageQueue.__callFunction (MessageQueue.js:250)
    at MessageQueue.js:101
    at MessageQueue.__guard (MessageQueue.js:218)

movies.actions.js:40 Popular Error: Network Error
    at createError (createError.js:16)
    at XMLHttpRequest.handleError (xhr.js:87)
    at XMLHttpRequest.dispatchEvent (event-target.js:172)
    at XMLHttpRequest.setReadyState (XMLHttpRequest.js:546)
    at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:381)
    at XMLHttpRequest.js:485
    at RCTDeviceEventEmitter.emit (EventEmitter.js:181)
    at MessageQueue.__callFunction (MessageQueue.js:250)
    at MessageQueue.js:101
    at MessageQueue.__guard (MessageQueue.js:218)


movies.actions.js:60 Now Playing Error: Network Error
    at createError (createError.js:16)
    at XMLHttpRequest.handleError (xhr.js:87)
    at XMLHttpRequest.dispatchEvent (event-target.js:172)
    at XMLHttpRequest.setReadyState (XMLHttpRequest.js:546)
    at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:381)
    at XMLHttpRequest.js:485
    at RCTDeviceEventEmitter.emit (EventEmitter.js:181)
    at MessageQueue.__callFunction (MessageQueue.js:250)
    at MessageQueue.js:101
    at MessageQueue.__guard (MessageQueue.js:218)


movies.actions.js:40 Popular Error: Network Error
    at createError (createError.js:16)
    at XMLHttpRequest.handleError (xhr.js:87)
    at XMLHttpRequest.dispatchEvent (event-target.js:172)
    at XMLHttpRequest.setReadyState (XMLHttpRequest.js:546)
    at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:381)
    at XMLHttpRequest.js:485
    at RCTDeviceEventEmitter.emit (EventEmitter.js:181)
    at MessageQueue.__callFunction (MessageQueue.js:250)
    at MessageQueue.js:101
    at MessageQueue.__guard (MessageQueue.js:218)

I got issues when tried to build your app.

The issues was in app.js file, this line:
export const TMDB_URL = Config.TMDB_URL;

I can't find the .env file that will be read from react-native-config. It returned an error: "null is not an object (evaluating '_reactnativeConfig2.default.TMDB_URL')

Please help...

Application movieapp has not been registered.This is either due to a require() error during intialization or failure to call

hello

when i run react-native run-ios got this error

i try to use this way but not wok(http://stackoverflow.com/a/35457165/7702167)

Hamburger menu icon

Can you let me know how you are drawing the hamburger menu icon. I have tried and cannot seem to figure it out.

Android problem

Hello, I'm an android developer, has recently been looking for some more react - native - navigation + react - story related to the demo.When see the demo, in the heart very happy.Download and then, I will run it, and found that there is no question of android compilation, is in after successful compilation, mobile device is blank, what also have no.Under normal circumstances should appear red this time error, prompt without even a node on the server, but this only a white screen.Can you take time to help me analysis?

error on first build: Could not get unknown property 'MYAPP_RELEASE_STORE_FILE

Hi all,

When trying to run this app I get the following error (on windows 7 running android)

Could not get unknown property 'MYAPP_RELEASE_STORE_FILE' for SigningConfig_De
corated{name=release, storeFile=null, storePassword=null, keyAlias=null, keyPass
word=null, storeType=null, v1SigningEnabled=true, v2SigningEnabled=true} of type
com.android.build.gradle.internal.dsl.SigningConfig.

App runs after removing below lines from build.gradle
storeFile file(MYAPP_RELEASE_STORE_FILE) storePassword MYAPP_RELEASE_STORE_PASSWORD keyAlias MYAPP_RELEASE_KEY_ALIAS keyPassword MYAPP_RELEASE_KEY_PASSWORD

However, when running the app I get the following

Anyone else running on windows or know how to solve this? Thnx

Add this app to fdroid

Crashes consistently when scrolling through movies

All vertical scrolling in the app causes it to crash on Android. Great job so far though.