“Hojin

add listview

import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';
import MainScreen from './Components/MainScreen';
import React, { Component } from "react";
import { StyleSheet, Text, View } from "react-native";
import { createAppContainer } from "react-navigation";
import { createStackNavigator } from "react-navigation-stack";
import MainScreen from "./Components/MainScreen";
// import MovieInfo from "./Components/MovieInfo";
const AppStackNavigator = createStackNavigator({
Main:{
Main: {
screen: MainScreen // MainScreen 컴포넌트를 네비게이터에 등록
}
});
......
......@@ -7,9 +7,7 @@ import {
SafeAreaView,
ScrollView,
Alert,
TouchableOpacity,
TouchableHighlight,
TouchableWithoutFeedback
TouchableOpacity
} from "react-native";
import { Icon } from "native-base";
import { AsyncStorage } from "react-native";
......@@ -42,7 +40,9 @@ export default class MovieRankingTab extends Component {
imgur6: [],
imgur7: [],
imgur8: [],
imgur9: []
imgur9: [],
overview0: [],
overview1: []
};
static navigationOptions = {
tabBarIcon: ({ tintColor }) => (
......@@ -55,8 +55,7 @@ export default class MovieRankingTab extends Component {
.get(
`http://www.kobis.or.kr/kobisopenapi/webservice/rest/boxoffice/searchDailyBoxOfficeList.json?key=${API_KEY}&targetDt=${date}`
)
.then(
response => {
.then(response => {
this.setState({
name0: response.data.boxOfficeResult.dailyBoxOfficeList[0].movieNm,
name1: response.data.boxOfficeResult.dailyBoxOfficeList[1].movieNm,
......@@ -72,174 +71,94 @@ export default class MovieRankingTab extends Component {
});
name = response.data.boxOfficeResult.dailyBoxOfficeList[0].movieNm;
fetch(
`https://openapi.naver.com/v1/search/movie.json?query='${name}'`,
{
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
}
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${name}&language=ko-KR&page=1`
)
.then(response => response.json())
.then(json => {
.then(response => {
this.setState({
imgurl0: json.items[0].image
imgurl0: response.data.results[0].poster_path,
overview0: response.data.results[0].overview
});
});
name = response.data.boxOfficeResult.dailyBoxOfficeList[1].movieNm;
fetch(
`https://openapi.naver.com/v1/search/movie.json?query='${name}'`,
{
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
}
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${name}&language=ko-KR&page=1`
)
.then(response => response.json())
.then(json => {
.then(response => {
this.setState({
imgurl1: json.items[0].image
imgurl1: response.data.results[0].poster_path,
overview1: response.data.results[0].overview
});
});
name = response.data.boxOfficeResult.dailyBoxOfficeList[2].movieNm;
fetch(
`https://openapi.naver.com/v1/search/movie.json?query='${name}'`,
{
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
}
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${name}&language=ko-KR&page=1`
)
.then(response => response.json())
.then(json => {
this.setState({
imgurl2: json.items[0].image
});
.then(response => {
this.setState({ imgurl2: response.data.results[0].poster_path });
});
name = response.data.boxOfficeResult.dailyBoxOfficeList[3].movieNm;
fetch(
`https://openapi.naver.com/v1/search/movie.json?query='${name}'`,
{
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
}
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${name}&language=ko-KR&page=1`
)
.then(response => response.json())
.then(json => {
this.setState({
imgurl3: json.items[0].image
});
.then(response => {
this.setState({ imgurl3: response.data.results[0].poster_path });
});
name = response.data.boxOfficeResult.dailyBoxOfficeList[4].movieNm;
fetch(
`https://openapi.naver.com/v1/search/movie.json?query='${name}'`,
{
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
}
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${name}&language=ko-KR&page=1`
)
.then(response => response.json())
.then(json => {
this.setState({
imgurl4: json.items[0].image
});
.then(response => {
this.setState({ imgurl4: response.data.results[0].poster_path });
});
name = response.data.boxOfficeResult.dailyBoxOfficeList[5].movieNm;
fetch(
`https://openapi.naver.com/v1/search/movie.json?query='${name}'`,
{
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
}
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${name}&language=ko-KR&page=1`
)
.then(response => response.json())
.then(json => {
this.setState({
imgurl5: json.items[0].image
});
.then(response => {
this.setState({ imgurl5: response.data.results[0].poster_path });
});
name = response.data.boxOfficeResult.dailyBoxOfficeList[6].movieNm;
fetch(
`https://openapi.naver.com/v1/search/movie.json?query='${name}'`,
{
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
}
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${name}&language=ko-KR&page=1`
)
.then(response => response.json())
.then(json => {
this.setState({
imgurl6: json.items[0].image
});
.then(response => {
this.setState({ imgurl6: response.data.results[0].poster_path });
});
name = response.data.boxOfficeResult.dailyBoxOfficeList[7].movieNm;
fetch(
`https://openapi.naver.com/v1/search/movie.json?query='${name}'`,
{
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
}
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${name}&language=ko-KR&page=1`
)
.then(response => response.json())
.then(json => {
this.setState({
imgurl7: json.items[0].image
});
.then(response => {
this.setState({ imgurl7: response.data.results[0].poster_path });
});
name = response.data.boxOfficeResult.dailyBoxOfficeList[8].movieNm;
fetch(
`https://openapi.naver.com/v1/search/movie.json?query='${name}'`,
{
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
}
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${name}&language=ko-KR&page=1`
)
.then(response => response.json())
.then(json => {
this.setState({
imgurl8: json.items[0].image
});
.then(response => {
this.setState({ imgurl8: response.data.results[0].poster_path });
});
name = response.data.boxOfficeResult.dailyBoxOfficeList[9].movieNm;
fetch(
`https://openapi.naver.com/v1/search/movie.json?query='${name}'`,
{
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
}
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${name}&language=ko-KR&page=1`
)
.then(response => response.json())
.then(json => {
this.setState({
imgurl9: json.items[0].image
});
.then(response => {
this.setState({ imgurl9: response.data.results[0].poster_path });
});
}
// {
// for (var i = 0; i < 10; i++) {
// console.log(
// response.data.boxOfficeResult.dailyBoxOfficeList[i].movieNm
// );
// }
// }
)
})
.catch(error => {
console.log(error);
});
......@@ -256,50 +175,77 @@ export default class MovieRankingTab extends Component {
var date = year + "" + month + day;
this.getMovieList(date);
}
_onPressButton = () => {
Alert.alert("image pressed the car");
};
_onPressButton(temp) {
Alert.alert(temp);
}
render() {
return (
<SafeAreaView style={style.container}>
<ScrollView style={style.scrollView}>
<Text style={style.title}>MovieRanking</Text>
<View style={style.lowContainer}>
<TouchableOpacity onPress={this._onPressButton}>
<View>
<View style={style.leftContainer}>
<TouchableOpacity
onPress={this._onPressButton.bind(this, `${this.state.name0}`)}
>
<Image
style={style.poster}
source={{ uri: `${this.state.imgurl0}` }}
source={{
uri: `https://image.tmdb.org/t/p/original/${this.state.imgurl0}`
}}
/>
<Text>{this.state.name0}</Text>
</View>
</TouchableOpacity>
</View>
<View style={style.rightContainer}>
<View style={style.rightUpContainer}>
<Text style={style.name}>{this.state.name0}</Text>
</View>
<View style={style.rightDownContainer}>
<Text>
{this.state.overview0.length < 60
? `${this.state.overview0}`
: `${this.state.overview0.substring(0, 57)}...`}
</Text>
</View>
</View>
</View>
<View style={style.lowContainer}>
<View style={style.leftContainer}>
<TouchableOpacity
style={style.button}
onPress={this._onPressButton}
onPress={this._onPressButton.bind(this, `${this.state.name1}`)}
>
<View>
<Image
style={style.poster}
source={{ uri: `${this.state.imgurl1}` }}
source={{
uri: `https://image.tmdb.org/t/p/original/${this.state.imgurl1}`
}}
/>
<Text>{this.state.name1}</Text>
</View>
</TouchableOpacity>
</View>
<View style={style.lowContainer}>
<View style={style.rightContainer}>
<View style={style.rightUpContainer}>
<Text style={style.name}>{this.state.name1}</Text>
</View>
<View style={style.rightDownContainer}>
<Text style={style.overview}>{this.state.overview1}</Text>
</View>
</View>
</View>
{/* <View style={style.lowContainer}>
<View style={style.halfContainer}>
<Image
style={style.poster}
source={{ uri: `${this.state.imgurl2}` }}
source={{
uri: `https://image.tmdb.org/t/p/original/${this.state.imgurl2}`
}}
/>
<Text>{this.state.name2}</Text>
</View>
<View style={style.halfContainer}>
<Image
style={style.poster}
source={{ uri: `${this.state.imgurl3}` }}
source={{
uri: `https://image.tmdb.org/t/p/original/${this.state.imgurl3}`
}}
/>
<Text>{this.state.name3}</Text>
</View>
......@@ -308,14 +254,18 @@ export default class MovieRankingTab extends Component {
<View style={style.halfContainer}>
<Image
style={style.poster}
source={{ uri: `${this.state.imgurl4}` }}
source={{
uri: `https://image.tmdb.org/t/p/original/${this.state.imgurl4}`
}}
/>
<Text>{this.state.name4}</Text>
</View>
<View style={style.halfContainer}>
<Image
style={style.poster}
source={{ uri: `${this.state.imgurl5}` }}
source={{
uri: `https://image.tmdb.org/t/p/original/${this.state.imgurl5}`
}}
/>
<Text>{this.state.name5}</Text>
</View>
......@@ -324,14 +274,18 @@ export default class MovieRankingTab extends Component {
<View style={style.halfContainer}>
<Image
style={style.poster}
source={{ uri: `${this.state.imgurl6}` }}
source={{
uri: `https://image.tmdb.org/t/p/original/${this.state.imgurl6}`
}}
/>
<Text>{this.state.name6}</Text>
</View>
<View style={style.halfContainer}>
<Image
style={style.poster}
source={{ uri: `${this.state.imgurl7}` }}
source={{
uri: `https://image.tmdb.org/t/p/original/${this.state.imgurl7}`
}}
/>
<Text>{this.state.name7}</Text>
</View>
......@@ -340,24 +294,27 @@ export default class MovieRankingTab extends Component {
<View style={style.halfContainer}>
<Image
style={style.poster}
source={{ uri: `${this.state.imgurl8}` }}
source={{
uri: `https://image.tmdb.org/t/p/original/${this.state.imgurl8}`
}}
/>
<Text>{this.state.name8}</Text>
</View>
<View style={style.halfContainer}>
<Image
style={style.poster}
source={{ uri: `${this.state.imgurl9}` }}
source={{
uri: `https://image.tmdb.org/t/p/original/${this.state.imgurl9}`
}}
/>
<Text>{this.state.name9}</Text>
</View>
</View>
</View> */}
</ScrollView>
</SafeAreaView>
);
}
}
const style = StyleSheet.create({
container: {
flex: 1
......@@ -375,20 +332,58 @@ const style = StyleSheet.create({
lowContainer: {
flex: 1,
flexDirection: "row",
// backgroundColor: "black",
// alignContent: "space-around",
justifyContent: "center",
alignItems: "center",
marginBottom: 10
},
halfContainer: {
flex: 1,
justifyContent: "center",
alignItems: "center"
},
poster: {
// resizeMode: "cover",
flex: 10,
width: "90%",
height: 200,
paddingHorizontal: 50
// alignItems: "stretch"
leftContainer: {
flex: 1,
// backgroundColor: "yellow",
justifyContent: "center",
alignItems: "center"
},
halfContainer: {
rightContainer: {
flex: 2
// flexDirection: "column",
// backgroundColor: "yellow"
},
rightUpContainer: {
flex: 1,
paddingTop: 20,
// backgroundColor: "blue",
justifyContent: "center",
marginLeft: 10
// alignItems: "center"
},
rightDownContainer: {
flex: 3,
// backgroundColor: "red",
// margin: "5%"
paddingTop: 20,
paddingBottom: 10
// justifyContent: "center",
alignItems: "center"
// alignItems: "center"
},
poster: {
resizeMode: "cover",
flex: 10,
width: "30%",
height: 160,
paddingHorizontal: 50,
alignItems: "stretch",
borderRadius: 7
},
name: {
fontSize: 16
},
overview: {
fontSize: 14
}
});
......
import React, { Component } from 'react';
import { Image, View, Button, Text, TextInput, StyleSheet, TouchableOpacity, Alert } from 'react-native';
import { Icon } from 'native-base';
import React, { Component } from "react";
import {
Image,
View,
Text,
TextInput,
StyleSheet,
TouchableOpacity,
SafeAreaView,
ScrollView
} from "react-native";
import { Card, CardItem, Icon } from "native-base";
import axios from "axios";
import { AsyncStorage } from "react-native";
const API_KEY = "2bf00f660b1a6a3ffeb6e06ac270cce3";
const NAVER_CLIENT_ID = "KqPsntd1hcPJ8FUPBGqN";
......@@ -11,16 +19,30 @@ const NAVER_CLIENT_SECRET = "0GRb3uya1U";
export default class Search extends Component {
static navigationOptions = {
tabBarIcon: ({ tintColor }) => (
<Icon name='ios-search' style={{ color: tintColor }} />
<Icon name="ios-search" style={{ color: tintColor }} />
)
}
};
state = {
typing: "",
keyword: "",
items: [[0],[0]]
items: [],
info: [],
results: []
};
getNaverApi = async (search) => {
getDB = async search => {
axios
.get(
`https://api.themoviedb.org/3/search/movie?api_key=840724c8aa8b3b7c4ab68db53310cc9f&query=${search}&language=ko-KR&page=1`
)
.then(response => {
this.setState({ results: response.data.results });
console.log(response.data.results);
});
};
getNaverApi = async search => {
fetch(`https://openapi.naver.com/v1/search/movie.json?query="${search}"`, {
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
......@@ -28,62 +50,79 @@ export default class Search extends Component {
}
})
.then(response => response.json())
.then(json => this.setState({items: json.items}))};
handleSearchUpdate = text => {
this.setState({
searchTerm: text
});
.then(json => this.setState({ items: json.items }));
};
searching = (typing) => {
searching = typing => {
this.setState({
keyword: typing,
typing: ""
})
this.getNaverApi(typing)
}
viewimage(){
return this.state.items.map( item =>
<Image style={styles.imagecontainer}
style={{ height: "50%", width: "50%" }}
source={{ uri: `${item.image}`}}
/>)
}
});
this.getDB(typing);
};
render() {
return (
<View>
<View style={styles.container}>
<View style={styles.input}>
<TextInput
style={styles.inputText}
placeholder='Search'
autoCorrect={ false }
value = {this.state.typing}
onChangeText= { (typing) => this.setState({typing})}
placeholder="Search"
autoCorrect={false}
value={this.state.typing}
onChangeText={typing => this.setState({ typing })}
/>
<TouchableOpacity onPress = {() => this.searching(this.state.typing)}>
<Icon name='ios-search'/>
<TouchableOpacity onPress={() => this.searching(this.state.typing)}>
<Icon name="ios-search" />
</TouchableOpacity>
</View>
<Text>
{this.state.keyword}
</View>
<SafeAreaView>
<ScrollView>
<Card>
{this.state.results.map(result => (
<View style={styles.lowContainer}>
<View style={styles.leftContainer}>
<CardItem>
{
<Image
source={{
uri: `https://image.tmdb.org/t/p/original/${result.poster_path}`
}}
style={styles.poster}
/>
}
</CardItem>
</View>
<View style={styles.rightContainer}>
<View style={styles.rightUpContainer}>
<Text style={styles.name}>{result.title}</Text>
</View>
<View style={styles.rightDownContainer}>
<CardItem>
<Text style={styles.overview}>
{result.overview.length < 60
? `${result.overview}`
: `${result.overview.substring(0, 57)}...`}
</Text>
{/* <Image style={styles.imagecontainer}
style={{ height: "50%", width: "50%" }}
source={{ uri: `${this.state.items[1].image}` }}
source={{ uri: `${this.state.items[0].image}` }}
/> */}
{this.viewimage()}
</CardItem>
</View>
)}
</View>
</View>
))}
</Card>
</ScrollView>
</SafeAreaView>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
marginLeft: 50,
marginRight: 50,
marginRight: 50
},
input: {
borderRadius: 10,
......@@ -92,18 +131,63 @@ const styles = StyleSheet.create({
paddingRight: 10,
height: 50,
alignItems: "center",
flexDirection: 'row',
justifyContent: 'space-between',
flexDirection: "row",
justifyContent: "space-between",
borderBottomColor: "#bbb",
borderBottomWidth: StyleSheet.hairlineWidth,
borderBottomWidth: StyleSheet.hairlineWidth
},
inputText: {
flex: 1,
flex: 1
},
addBtn: {
color: '#4169E1'
color: "#4169E1"
},
imagecontainer:{
imagecontainer: {
flex: 1
},
lowContainer: {
flex: 1,
flexDirection: "row",
justifyContent: "center",
alignItems: "center",
marginBottom: 10
},
leftContainer: {
flex: 1,
justifyContent: "center",
alignItems: "center"
},
rightContainer: {
flex: 2
},
rightUpContainer: {
flex: 1,
paddingTop: 20,
justifyContent: "center",
marginLeft: 10
},
rightDownContainer: {
flex: 3,
paddingTop: 20,
paddingBottom: 10
},
poster: {
resizeMode: "cover",
flex: 10,
width: "30%",
height: 160,
paddingHorizontal: 50,
alignItems: "stretch",
borderRadius: 7
},
content: {
flex: 1,
flexDirection: "row"
},
name: {
fontSize: 16
},
overview: {
fontSize: 14
}
});
......
import React, { Component } from 'react';
import { StyleSheet, Text, View, Button } from 'react-native';
import { Icon } from 'native-base'; // 추가된 코드
import { createAppContainer } from 'react-navigation';
import { createMaterialTopTabNavigator } from 'react-navigation-tabs';
import SeenMovieTab from './AppTabNavigator/MovieRankingTab';
import MovieRankingTab from './AppTabNavigator/WantToWatchTab';
import WantToWatchTab from './AppTabNavigator/SeenMovieTab';
import Search from './/AppTabNavigator/Search';
import { Platform } from 'react-native'
import React, { Component } from "react";
import { StyleSheet, Text, View, Button } from "react-native";
import { Icon } from "native-base"; // 추가된 코드
import { createAppContainer } from "react-navigation";
import { createStackNavigator } from "react-navigation-stack";
import { createMaterialTopTabNavigator } from "react-navigation-tabs";
import SeenMovieTab from "./AppTabNavigator/MovieRankingTab";
import MovieRankingTab from "./AppTabNavigator/WantToWatchTab";
import WantToWatchTab from "./AppTabNavigator/SeenMovieTab";
import Search from ".//AppTabNavigator/Search";
import { Platform } from "react-native";
//import { Ionicons } from '@expo/vector-icons';
const AppTabNavigator = createMaterialTopTabNavigator({
SeenMovieTab:{ screen: SeenMovieTab },
MovieRankingTab:{ screen: MovieRankingTab },
WantToWatchTab:{ screen: WantToWatchTab },
const AppTabNavigator = createMaterialTopTabNavigator(
{
SeenMovieTab: { screen: SeenMovieTab },
MovieRankingTab: { screen: MovieRankingTab },
WantToWatchTab: { screen: WantToWatchTab },
Search: { screen: Search }
}, {
},
{
animationEnabled: true,
swipeEnabled: true,
tabBarPosition: "bottom",
tabBarOptions: {
style: {
...Platform.select({
android:{
backgroundColor:'white',
android: {
backgroundColor: "white"
}
})
},
iconStyle: { height: 30 },
activeTintColor: '#000',
inactiveTintColor: '#d1cece',
activeTintColor: "#000",
inactiveTintColor: "#d1cece",
upperCaseLabel: false,
showLabel: false,
showIcon: true,
showIcon: true
}
});
}
);
const AppTabContainet = createAppContainer(AppTabNavigator);
......@@ -43,19 +46,18 @@ export default class MainScreen extends Component {
// navigationOptions 코드 추가
static navigationOptions = {
//headerLeft: <Icon name='ios-camera' style={{ paddingLeft:10 }}/>,
title: 'PoketMovie'
}
title: "PoketMovie"
};
render() {
return <AppTabContainet/>; // AppTabContainet 컴포넌트를 리턴한다.
return <AppTabContainet />; // AppTabContainet 컴포넌트를 리턴한다.
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
alignItems: "center",
justifyContent: "center"
}
});
......
import React, { Component } from "react";
import { StyleSheet, Text, View, StatusBar } from "react-native";
export default class MovieRankingTab extends Component {
return() {
<View style={styles.container}>
<StatusBar barStyle="dark-content" />
<Text style={styles.text}>Getting the current weather</Text>
</View>;
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: "flex-end",
paddingHorizontal: 30,
paddingVertical: 100,
backgroundColor: "#FDF6AA"
},
text: {
color: "#2c2c2c",
fontSize: 30
}
});
import React from "react";
import { StyleSheet, Text, View } from 'react-native';
import { AsyncStorage } from "react-native";
import Loading from "./Loading";
import axios from "axios";
const API_KEY = "2bf00f660b1a6a3ffeb6e06ac270cce3";
const NAVER_CLIENT_ID = "KqPsntd1hcPJ8FUPBGqN";
const NAVER_CLIENT_SECRET = "0GRb3uya1U";
// const option = {
// query: "겨울왕국"
// };
// request.get(
// {
// uri: "https://openapi.naver.com/v1/search/movie", //xml 요청 주소는 https://openapi.naver.com/v1/search/image.xml
// qs: option,
// headers: {
// "X-Naver-Client-Id": NAVER_CLIENT_ID,
// "X-Naver-Client-Secret": NAVER_CLIENT_SECRET
// }
// },
// function(err, res, body) {
// let json = JSON.parse(body); //json으로 파싱
// console.log(json);
// }
// );
export default class extends React.Component {
state = {
isLoading: true
};
getNaverApi = async () => {
fetch("https://openapi.naver.com/v1/search/movie.json?query='겨울왕국 2'", {
headers: {
"X-Naver-Client-Id": NAVER_CLIENT_ID,
"X-Naver-Client-Secret": NAVER_CLIENT_SECRET
}
})
.then(response => response.json())
.then(json => {
console.log(json.items[0].image);
});
};
getMovieList = async () => {
axios
.get(
`http://www.kobis.or.kr/kobisopenapi/webservice/rest/boxoffice/searchDailyBoxOfficeList.json?key=${API_KEY}&targetDt=20191129`
)
.then(response => {
for (var i = 0; i < 10; i++) {
console.log(
response.data.boxOfficeResult.dailyBoxOfficeList[i].movieNm
);
}
})
.catch(error => {
console.log(error);
});
};
componentDidMount() {
this.getMovieList();
this.getNaverApi();
}
render() {
return (
<View>
<Text>WantToWatchTab</Text>
</View>
);
}
}
\ No newline at end of file
......@@ -16,7 +16,7 @@
"react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",
"react-native-axios": "^0.17.1",
"react-native-elements": "^1.2.7",
"react-native-gesture-handler": "~1.3.0",
"react-native-gesture-handler": "^1.5.2",
"react-native-reanimated": "~1.2.0",
"react-native-screens": "~1.0.0-alpha.23",
"react-native-stack": "^1.0.0-alpha11",
......
Arguments:
C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\yarn\bin\yarn.js add react-navigation-tabs
C:\Program Files\nodejs\node.exe C:\Users\1004n\AppData\Roaming\npm\node_modules\yarn\bin\yarn.js add ract-navigation-stack --save
PATH:
C:\Program Files (x86)\Common Files\Oracle\Java\javapath;C:\Program Files (x86)\Intel\iCLS Client\;C:\Program Files\Intel\iCLS Client\;C:\windows\system32;C:\windows;C:\windows\System32\Wbem;C:\windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files\Samsung\SamsungLink\AllShare Framework DMS\bin\;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\WINDOWS\System32\OpenSSH\;C:\Program Files\Git\cmd;C:\TmaxData\tibero6\bin;C:\TmaxData\tibero6\client\bin;C:\Program Files\PuTTY\;C:\Users\SSM\AppData\Roaming\nvm;C:\Program Files\nodejs;C:\Users\SSM\AppData\Local\Programs\Python\Python37\Scripts\;C:\Users\SSM\AppData\Local\Programs\Python\Python37\;C:\Users\SSM\AppData\Local\Microsoft\WindowsApps;C:\intelFPGA\18.1\modelsim_ase\win32aloem;C:\Users\SSM\AppData\Local\Programs\Microsoft VS Code\bin;C:\Users\SSM\AppData\Roaming\npm;C:\Users\SSM\AppData\Roaming\nvm;C:\Program Files\nodejs
C:\Program Files (x86)\Common Files\Oracle\Java\javapath;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\iCLS\;C:\Program Files\Intel\Intel(R) Management Engine Components\iCLS\;C:\windows\system32;C:\windows;C:\windows\System32\Wbem;C:\windows\System32\WindowsPowerShell\v1.0\;C:\windows\System32\OpenSSH\;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files\Intel\WiFi\bin\;C:\Program Files\Common Files\Intel\WirelessCommon\;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\WINDOWS\System32\OpenSSH\;C:\Program Files\nodejs\;C:\Program Files\NVIDIA Corporation\NVIDIA NvDLISR;C:\Program Files\Git\cmd;C:\TmaxData\tibero6\bin;C:\TmaxData\tibero6\client\bin;C:\Program Files\MySQL\MySQL Server 8.0\bin;C:\sqlite;C:\Program Files\MySQL\MySQL Shell 8.0\bin\;C:\Users\1004n\AppData\Local\Microsoft\WindowsApps;C:\Program Files\Bandizip\;C:\Users\1004n\AppData\Local\Programs\Microsoft VS Code\bin;C:\Users\1004n\AppData\Roaming\npm;C:\TRV-Mars\flutter\bin;C:\Program Files\JetBrains\IntelliJ IDEA Community Edition 2019.2\bin;C:\Users\1004n\AppData\Local\Android\Sdk\emulator;C:\Users\1004n\AppData\Local\Android\Sdk\platform-tools;C:\Users\1004n\AppData\Local\Android\Sdk\tools\bin;C:\Program Files\Java\jre1.8.0_231\bin;C:\Users\1004n\.android\avd;C:\Users\1004n\AppData\Local\atom\bin
Yarn version:
1.19.2
1.21.0
Node version:
12.9.0
10.16.0
Platform:
win32 x64
Trace:
Error: EPERM: operation not permitted, unlink 'C:\Users\SSM\Desktop\open_proj\khuhub\pocketMovie\node_modules\@babel\generator\node_modules\.bin'
Error: https://registry.yarnpkg.com/ract-navigation-stack: Not found
at Request.params.callback [as _callback] (C:\Users\1004n\AppData\Roaming\npm\node_modules\yarn\lib\cli.js:66938:18)
at Request.self.callback (C:\Users\1004n\AppData\Roaming\npm\node_modules\yarn\lib\cli.js:140622:22)
at Request.emit (events.js:198:13)
at Request.<anonymous> (C:\Users\1004n\AppData\Roaming\npm\node_modules\yarn\lib\cli.js:141594:10)
at Request.emit (events.js:198:13)
at IncomingMessage.<anonymous> (C:\Users\1004n\AppData\Roaming\npm\node_modules\yarn\lib\cli.js:141516:12)
at Object.onceWrapper (events.js:286:20)
at IncomingMessage.emit (events.js:203:15)
at endReadableNT (_stream_readable.js:1129:12)
at process._tickCallback (internal/process/next_tick.js:63:19)
npm manifest:
{
......@@ -34,6 +44,7 @@ npm manifest:
"react-dom": "16.8.3",
"react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",
"react-native-axios": "^0.17.1",
"react-native-elements": "^1.2.7",
"react-native-gesture-handler": "~1.3.0",
"react-native-reanimated": "~1.2.0",
"react-native-screens": "~1.0.0-alpha.23",
......@@ -41,6 +52,7 @@ npm manifest:
"react-native-web": "^0.11.7",
"react-navigation": "^4.0.10",
"react-navigation-stack": "^1.10.3",
"react-navigation-tabs": "^2.6.2",
"request": "^2.88.0"
},
"devDependencies": {
......@@ -1004,11 +1016,40 @@ Lockfile:
resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.149.tgz#1342d63d948c6062838fbf961012f74d4e638440"
integrity sha512-ijGqzZt/b7BfzcK9vTrS6MFljQRPn5BFWOx8oE0GYxribu6uV+aA9zZuXI1zc/etK9E8nrgdoF2+LgUw7+9tJQ==
"@types/prop-types@*":
version "15.7.3"
resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.3.tgz#2ab0d5da2e5815f94b0b9d4b95d1e5f243ab2ca7"
integrity sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==
"@types/qs@^6.5.1":
version "6.9.0"
resolved "https://registry.yarnpkg.com/@types/qs/-/qs-6.9.0.tgz#2a5fa918786d07d3725726f7f650527e1cfeaffd"
integrity sha512-c4zji5CjWv1tJxIZkz1oUtGcdOlsH3aza28Nqmm+uNDWBRHoMsjooBEN4czZp1V3iXPihE/VRUOBqg+4Xq0W4g==
"@types/react-native-vector-icons@^6.4.4":
version "6.4.4"
resolved "https://registry.yarnpkg.com/@types/react-native-vector-icons/-/react-native-vector-icons-6.4.4.tgz#f81dcc371b74a9c408ce12f95b8f494d7543146b"
integrity sha512-G1Iry/8i23IPjZzNjydMt/WcjV+T1Xu3cTXDwSsP9lpKu0bA0j+c7AACJ1aIka8HVnWXS41NoZnKkHImO0SMkw==
dependencies:
"@types/react" "*"
"@types/react-native" "*"
"@types/react-native@*":
version "0.60.24"
resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.60.24.tgz#0648aff3a910f29b8a892cecd0ec3199697bd31f"
integrity sha512-wI4C39mrEWpnx2JHCGsDKKcB22CNCKUWjLO6Mwt2yzgKD7crawuTjeHpBej/OiD/3df2X8rluuSmJ1xRcOZNAg==
dependencies:
"@types/prop-types" "*"
"@types/react" "*"
"@types/react@*":
version "16.9.15"
resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.15.tgz#aeabb7a50f96c9e31a16079ada20ede9ed602977"
integrity sha512-WsmM1b6xQn1tG3X2Hx4F3bZwc2E82pJXt5OPs2YJgg71IzvUoKOSSSYOvLXYCg1ttipM+UuA4Lj3sfvqjVxyZw==
dependencies:
"@types/prop-types" "*"
csstype "^2.2.0"
"@types/uuid-js@^0.7.1":
version "0.7.2"
resolved "https://registry.yarnpkg.com/@types/uuid-js/-/uuid-js-0.7.2.tgz#5b5552fcbaaf4acf026fb6dc66f7e5bd6b4be92f"
......@@ -1710,7 +1751,7 @@ Lockfile:
resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
integrity sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg==
color@~3.1.2:
color@^3.1.0, color@~3.1.2:
version "3.1.2"
resolved "https://registry.yarnpkg.com/color/-/color-3.1.2.tgz#68148e7f85d41ad7649c5fa8c8106f098d229e10"
integrity sha512-vXTJhHebByxZn3lDvDJYw4lR5+uB3vuoHsuYA5AKuxRVn5wzzIfQKGLBmgdVRHKTJYeK5rvJcHnrd0Li49CFpg==
......@@ -1882,6 +1923,11 @@ Lockfile:
hyphenate-style-name "^1.0.2"
isobject "^3.0.1"
csstype@^2.2.0:
version "2.6.7"
resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.7.tgz#20b0024c20b6718f4eda3853a1f5a1cce7f5e4a5"
integrity sha512-9Mcn9sFbGBAdmimWb2gLVDtFJzeKtDGIr76TUqmjZrw9LFXBMSU70lcs+C0/7fyCd6iBDqmksUcCOUIkisPHsQ==
dashdash@^1.12.0:
version "1.14.1"
resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0"
......@@ -1944,6 +1990,11 @@ Lockfile:
resolved "https://registry.yarnpkg.com/deep-extend/-/deep-extend-0.6.0.tgz#c4fa7c95404a17a9c3e8ca7e1537312b736330ac"
integrity sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==
deepmerge@^3.1.0:
version "3.3.0"
resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-3.3.0.tgz#d3c47fd6f3a93d517b14426b0628a17b0125f5f7"
integrity sha512-GRQOafGHwMHpjPx9iCvTgpu9NojZ49q794EEL94JVEw6VaeA8XTUyBKvAkOOjBX9oJNiV6G3P+T+tihFjo2TqA==
define-properties@^1.1.2:
version "1.1.3"
resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.3.tgz#cf88da6cbee26fe6db7094f61d870cbd84cee9f1"
......@@ -2818,7 +2869,7 @@ Lockfile:
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz#c5903cf409c0dfd908f388e619d86b9c1174cb47"
integrity sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==
hoist-non-react-statics@^3.0.1, hoist-non-react-statics@^3.3.0:
hoist-non-react-statics@^3.0.1, hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.3.0:
version "3.3.1"
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#101685d3aff3b23ea213163f6e8e12f4f111e19f"
integrity sha512-wbg3bpgA/ZqWrZuMOeJi8+SKMhr7X9TesL/rXMjTzh0p0JUBo3II8DHboYbuIXWRlttrUFxwcu/5kygrCw8fJw==
......@@ -4261,7 +4312,7 @@ Lockfile:
dependencies:
mimic-fn "^1.0.0"
opencollective-postinstall@^2.0.2:
opencollective-postinstall@^2.0.0, opencollective-postinstall@^2.0.2:
version "2.0.2"
resolved "https://registry.yarnpkg.com/opencollective-postinstall/-/opencollective-postinstall-2.0.2.tgz#5657f1bede69b6e33a45939b061eb53d3c6c3a89"
integrity sha512-pVOEP16TrAO2/fjej1IdOyupJY8KDUM1CvsaScRbw6oddvpQoOfGk4ywha0HKKVAD6RkW4x6Q+tNBwhf3Bgpuw==
......@@ -4681,6 +4732,11 @@ Lockfile:
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.12.0.tgz#2cc0fe0fba742d97fd527c42a13bec4eeb06241c"
integrity sha512-rPCkf/mWBtKc97aLL9/txD8DZdemK0vkA3JMLShjlJB3Pj3s+lpf1KaBzMfQrAmhMQB0n1cU/SUGgKKBCe837Q==
react-lifecycles-compat@^3.0.4:
version "3.0.4"
resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==
react-native-axios@^0.17.1:
version "0.17.1"
resolved "https://registry.yarnpkg.com/react-native-axios/-/react-native-axios-0.17.1.tgz#44292950aa07ceee2e4bd349106ff773bef81f8f"
......@@ -4708,6 +4764,20 @@ Lockfile:
dependencies:
lodash "^4.17.15"
react-native-elements@^1.2.7:
version "1.2.7"
resolved "https://registry.yarnpkg.com/react-native-elements/-/react-native-elements-1.2.7.tgz#1eca2db715c41722aeb67aea62bd2a4621adb134"
integrity sha512-0S+0R1cbItl15i64qrkWnyMztwpw60d0SUsZGVDKRAMf0Jvq9Clgyh/MzxJx2sr42mbedQP1sg5Et4fZM7Fp1w==
dependencies:
"@types/react-native-vector-icons" "^6.4.4"
color "^3.1.0"
deepmerge "^3.1.0"
hoist-non-react-statics "^3.1.0"
opencollective-postinstall "^2.0.0"
prop-types "^15.7.2"
react-native-ratings "^6.3.0"
react-native-status-bar-height "^2.2.0"
react-native-gesture-handler@~1.3.0:
version "1.3.0"
resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-1.3.0.tgz#d0386f565928ccc1849537f03f2e37fd5f6ad43f"
......@@ -4730,12 +4800,20 @@ Lockfile:
prop-types "^15.6.2"
react-native-iphone-x-helper "^1.0.3"
react-native-ratings@^6.3.0:
version "6.5.0"
resolved "https://registry.yarnpkg.com/react-native-ratings/-/react-native-ratings-6.5.0.tgz#a1606ccba3c5b54eec8e6cfa4765a45cf0e4ab8d"
integrity sha512-YMcfQ7UQCmXGEc/WPlukHSHs5yvckTwjq5fTRk1FG8gaO7fZCNygEUGPuw4Dbvvp3IlsCUn0bOQd63RYsb7NDQ==
dependencies:
lodash "^4.17.4"
prop-types "^15.5.10"
react-native-reanimated@~1.2.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/react-native-reanimated/-/react-native-reanimated-1.2.0.tgz#9219227a52a5dfa4d34c324596d6726ccd874293"
integrity sha512-vkWRHrPK5qfHP/ZawlRoo38oeYe9NZaaOH/lmFxRcsKzaSK6x3H5ZPXI8lK6MfTLveqwo1QhJje3zIKXO4nQQw==
react-native-safe-area-view@^0.14.1:
react-native-safe-area-view@^0.14.1, react-native-safe-area-view@^0.14.6:
version "0.14.8"
resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.14.8.tgz#ef33c46ff8164ae77acad48c3039ec9c34873e5b"
integrity sha512-MtRSIcZNstxv87Jet+UsPhEd1tpGe8cVskDXlP657x6rHpSrbrc+y13ZNXrwAgGNNhqQNX7UJT68ZIq//ZRmvw==
......@@ -4760,6 +4838,16 @@ Lockfile:
tiny-invariant "^1.0.4"
tiny-warning "^1.0.2"
react-native-status-bar-height@^2.2.0:
version "2.4.0"
resolved "https://registry.yarnpkg.com/react-native-status-bar-height/-/react-native-status-bar-height-2.4.0.tgz#de8cee4bb733a196167210d2d0bc1fa10acba3e3"
integrity sha512-pWvZFlyIHiuxLugLioq97vXiaGSovFXEyxt76wQtbq0gxv4dGXMPqYow46UmpwOgeJpBhqL1E0EKxnfJRrFz5w==
react-native-tab-view@^2.11.0:
version "2.11.0"
resolved "https://registry.yarnpkg.com/react-native-tab-view/-/react-native-tab-view-2.11.0.tgz#2e57d1f617ccc88c7f452708804f3409f880b700"
integrity sha512-vqetlxGO7A8bnqvXcB50MWpRZAImXFrDGz1WCQKdCqe03Ey3ZzENe7yLuWrtBJYlepGfOLAsmCXv+wW82Yfm1w==
react-native-vector-icons@^6.6.0:
version "6.6.0"
resolved "https://registry.yarnpkg.com/react-native-vector-icons/-/react-native-vector-icons-6.6.0.tgz#66cf004918eb05d90778d64bd42077c1800d481b"
......@@ -4852,6 +4940,16 @@ Lockfile:
dependencies:
prop-types "^15.7.2"
react-navigation-tabs@^2.6.2:
version "2.6.2"
resolved "https://registry.yarnpkg.com/react-navigation-tabs/-/react-navigation-tabs-2.6.2.tgz#6611f3bbc5fcbc004a96a457e1dbe8d957d09ef5"
integrity sha512-b7Bwio3pOyb2dJOsfICm1eXUCekULO63VitLlkslsuwB5v5qXD9u+TkuSGADPiAybRH3Fts4cQX/xA5WGsIsfg==
dependencies:
hoist-non-react-statics "^3.3.0"
react-lifecycles-compat "^3.0.4"
react-native-safe-area-view "^0.14.6"
react-native-tab-view "^2.11.0"
react-navigation@^4.0.10:
version "4.0.10"
resolved "https://registry.yarnpkg.com/react-navigation/-/react-navigation-4.0.10.tgz#ddf41134600689d6ba99e35dd22ba1f664f91e5c"
......
......@@ -2726,6 +2726,11 @@ growly@^1.3.0:
resolved "https://registry.yarnpkg.com/growly/-/growly-1.3.0.tgz#f10748cbe76af964b7c96c93c6bcc28af120c081"
integrity sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=
hammerjs@^2.0.8:
version "2.0.8"
resolved "https://registry.yarnpkg.com/hammerjs/-/hammerjs-2.0.8.tgz#04ef77862cff2bb79d30f7692095930222bf60f1"
integrity sha1-BO93hiz/K7edMPdpIJWTAiK/YPE=
har-schema@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/har-schema/-/har-schema-2.0.0.tgz#a94c2224ebcac04782a0d9035521f24735b7ec92"
......@@ -4711,14 +4716,15 @@ react-native-elements@^1.2.7:
react-native-ratings "^6.3.0"
react-native-status-bar-height "^2.2.0"
react-native-gesture-handler@~1.3.0:
version "1.3.0"
resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-1.3.0.tgz#d0386f565928ccc1849537f03f2e37fd5f6ad43f"
integrity sha512-ASRFIXBuKRvqlmwkWJhV8yP2dTpvcqVrLNpd7FKVBFHYWr6SAxjGyO9Ik8w1lAxDhMlRP2IcJ9p9eq5X2WWeLQ==
react-native-gesture-handler@^1.5.2:
version "1.5.2"
resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-1.5.2.tgz#281111550bf1eee10b7feba5278d142169892731"
integrity sha512-Xp03dq4XYVTD0xmWx4DW4eX+ox1NQLjHmbykspTdS5FCNIVIOekVXRLFCw1698/v8dYUHApNo6K3s3BCD8fqPA==
dependencies:
hammerjs "^2.0.8"
hoist-non-react-statics "^2.3.1"
invariant "^2.2.2"
prop-types "^15.5.10"
invariant "^2.2.4"
prop-types "^15.7.2"
react-native-iphone-x-helper@^1.0.3:
version "1.2.1"
......