[개발일지] 앱개발 2주차: 웰컴페이지 만들기

그냥 내 맘대로 만든 웰컴 페이지!

숙제인데, 생각보다 잘 된 거 같아서 마음에 든다ㅎㅎ
내 코드는 다음과 같다

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

export default function AboutPage(){
    // const aboutImage = "https://firebasestorage.googleapis.com/v0/b/sparta-image.appspot.com/o/lecture%2FaboutImage.png?alt=media&token=13e1c4f6-b802-4975-9773-e305fc7475c4"
  return (
    <View style={styles.container}>
        <Text style={styles.title}>HI! 몌와 함께하는 앱개발 {"\n"} 반에 오신 것을 환영합니다!</Text>
        <View style={styles.containerBox}>
            <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.image}
                // resizeMode={"center"}
            />
            <Text style={styles.innerTitle}>몌가 얼마나 성장할 지 {"\n"} 기대되지 않으시나요?</Text>
            <Text style={styles.innerDesc}>꼭 완주해서 멋진 모습 보여줄게요!</Text>
            <TouchableOpacity style={styles.Button}><Text style={styles.ButtonText}> Instagram으로 가기</Text></TouchableOpacity>
        </View>   
    </View>)
}

const styles = StyleSheet.create({
    container: {
        flex:1,
        backgroundColor:"#1F266A",
        alignItems:"center"
    },
    title:{
        color:"white",
        fontSize: 30,
        fontWeight: "700",
        alignSelf: "center",
        marginTop: 50,
        marginHorizontal: 30,
        textAlign: "center"
    },
    containerBox:{
        backgroundColor: "white",
        borderRadius : 20,
        width: 300,
        height: 450,
        marginTop: 40
    },
    image:{
        width: 140,
        height: 140,
        alignSelf: "center",
        borderRadius: 25,
        marginTop:70
    },
    innerTitle:{
        fontSize: 20,
        fontWeight: "700",
        textAlign: "center",
        marginTop:20,
        marginHorizontal: 30
    },
    innerDesc:{
        fontSize:15,
        fontWeight: "600",
        textAlign:"center",
        margin: 20
    },
    Button:{
        backgroundColor: "orange",
        padding: 20,
        alignSelf: "center",
        borderRadius: 20,
        margin: 8
    },
    ButtonText:{
        color: "white",
        fontWeight: "700",
        textAlign: "center"
    }
    
})