import React from 'react';

import { StyleSheet, Text, View, Image, TouchableOpacity, ScrollView} from 'react-native';

const main = 'https://firebasestorage.googleapis.com/v0/b/sparta-image.appspot.com/o/lecture%2Fmain.png?alt=media&token=8e5eb7'

export default function App() {

//return 구문 밖에서는 슬래시 두개 방식으로 주석

return (

  <ScrollView style={styles.container}>

    <Text style={styles.title}>나만의 꿀팁</Text>

    <Image style={styles.mainImage} source={{uri:main}}/>

    <ScrollView style={styles.middleContainer} horizontal indicatorStyle={"white"}>

    <TouchableOpacity style={styles.middleButton01}><Text style={styles.middleButtonText}>생활</Text></TouchableOpacity>

    <TouchableOpacity style={styles.middleButton02}><Text style={styles.middleButtonText}>재테크</Text></TouchableOpacity>

    <TouchableOpacity style={styles.middleButton03}><Text style={styles.middleButtonText}>반려견</Text></TouchableOpacity>

    <TouchableOpacity style={styles.middleButton04}><Text style={styles.middleButtonText}>꿀팁 찜</Text></TouchableOpacity>

    </ScrollView>

    <View style={styles.cardContainer}>

    <View style={styles.card}>

    <Image style={styles.cardImage} source={{uri:'https://storage.googleapis.com/sparta-image.appspot.com/lecture/pizza.png'}}/>

    <View style={styles.cardText}>

    <Text style={styles.cardTitle}>먹다 남은 피자를 촉촉하게!</Text>

    <Text style={styles.cardDesc} numberOfLines={3}>먹다 남은 피자는 수분이 날라가기 때문에 처음처럼 맛있게 먹을 수 없는데요. 이럴 경우...</Text>

    <Text style={styles.cardDate}>2020.09.09</Text>

    </View>

    </View>

    </View>

  </ScrollView>

  );

}

위에서.. 스크롤이 왜 적용이 안되는지 모르겠어요 ㅜ... 강의에서는 적용이 되는거 같은데.. 화면이 커서 그런건지