외부파일 불러오는 방법
//폴더안에 존재할경우
import data from './data.json';
//폴더 밖에 있는 경우
import data from '../data.json';
<View style={styles.cardContainer}>
{/* 하나의 카드 영역을 나타내는 View */}
{
tip.map((content,i)=>{
return (<View style={styles.card} key={i}>
<Image style={styles.cardImage} source={{uri:content.image}}/>
<View style={styles.cardText}>
<Text style={styles.cardTitle} numberOfLines={1}>{content.title}</Text>
<Text style={styles.cardDesc} numberOfLines={3}>{content.desc}</Text>
<Text style={styles.cardDate}>{content.date}</Text>
</View>
</View>)
})
}
</View>
let result = 10 > 2 ? "참" : "거짓"
(기본 모습)
let result = 조건 ? 참일 때 : 거짓 일때
(예제)
let result = 10 == 9 ? true : false // result <-- false 값 할당
let result = 10 !== 9 ? true : false // result <-- true 값 할당
let reuslt = 99 > 10 ? true : false // result <-- true 값 할당
어바웃 화면만들기
import React from 'react'
import {View,Text,StyleSheet,Image, TouchableOpacity} from 'react-native'
import { color } from 'react-native/Libraries/Components/View/ReactNativeStyleAttributes';
export default function AboutPage(){
return (<View style={styles.container}>
<Text style = {styles.main}>Hi! 스파르타코딩 앱개발 반에 오신것을 환영합니다</Text>
<View style={styles.imgcontainer}>
<Image
source = {{uri:'https://firebasestorage.googleapis.com/v0/b/sparta-image.appspot.com/o/lecture%2FaboutImage.png?alt=media&token=13e1c4f6-b802-4975-9773-e305fc7475c4'}}
style={styles.imageStyle}
resizeMode='cover'
/>
<Text style={styles.desc01}>
많은 내용을 간결하게 담아내려 노력했습니다!
</Text>
<Text style={styles.desc02}>
꼭 완주하셔서 여러분들것으로 만들어가시길 바랍니다
</Text>
<TouchableOpacity style={styles.Button}>
<Text style={styles.ButtonText}>
@0thousandboy
</Text>
</TouchableOpacity>
</View>
</View>);
}
const styles = StyleSheet.create({
container:{
flex:1,
backgroundColor: '#252c74',
alignItems:'center'
},
main:{
fontSize : 30,
color: '#fff',
marginTop: 80,
marginHorizontal: 30,
fontWeight:"700"
},
imgcontainer:{
backgroundColor:'#fff',
height:500,
width:'80%',
justifyContent:'center',
alignItems:'center',
marginTop:50,
borderRadius:30
},
imageStyle:{
height:150,
width:150,
borderRadius:30
},
Button:{
backgroundColor:'orange',
padding:20,
borderRadius:15
},
ButtonText:{
fontSize:20,
fontWeight:"700",
color:'#fff'
},
desc01:{
textAlign:"center",
fontSize:20,
fontWeight:"700",
paddingLeft:22,
paddingRight:22
},
desc02:{
textAlign:"center",
fontSize:15,
fontWeight:"700",
padding:22
}
});