🤯오늘 배운것

앱 개발을 하면서 매번 보고 ctrl+C, ctrl+V 이다 심지어 방금 적은문자도 똑같은 방식으로 진행했다. 그러자 백지상태에서 프로그래밍을 해보라 했을때 너무 답답하고 막막하여 어떻게 해야할지 몰랐다. 하지만 오늘 3시간동안 머리를 굴린결과 조금의 희망과 어떻게 코드를 작성해나가야하는지 조금 알것 같다.

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

export default function AboutPage(){
  return (<View>
        <Text>어바웃페이지</Text>
      </View>)
}

오늘 처음 코딩의 시작은 이렇게 시작했다.

처음에는 어떻게 해야할까를 1시간 정도 고민했다. 하지만 지금 코드를 다 완성한뒤 1시간동안 생각한것은 무용 지물 말그대로 아무짝에 쓸모없는 생각 들이었다.

1시간동안 고민후 결국 해설강의를 찾아 유심히 보기시작한 뒤 무언가 눈치채버렸다.

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! 스파르타코딩 앱개발 반에 오신것을 환영합니다</Text>

        <View style={styles.textContainer}>
        <Image style={styles.aboutImage} source={{uri:aboutImage}} resizeMode={"cover"}/>
        <Text style={styles.text01}>많은 내용을 간결하게 담아내려 노력했습니다!</Text>
        <Text style={styles.text02}>꼭 완주 하셔서 꼭 여러분것으로 만들어가시길 바랍니다</Text>
        <TouchableOpacity style={styles.button}>
          <Text style={styles.buttonText}>여러분의 인스타계정</Text>

        </TouchableOpacity>

        
        
        </View>
      </View>)
}
const styles = StyleSheet.create({
  container: {
      flex:1,
      backgroundColor:"#1F266A",
      alignItems:"center"
    
  },
  title: {
    fontSize:30,
    fontWeight:"700",
    color:"#fff",
    paddingLeft:30,
    paddingTop:100,
    paddingRight:30
},
  textContainer: {
    width:300,
    height:500,
    backgroundColor:"#fff",
    marginTop:50,
    borderRadius:30,
    justifyContent:"center",
    alignItems:"center"
},
  aboutImage:{
    width:150,
    height:150,
    borderRadius:30
},
text01: {
  textAlign:"center",
  fontSize:20,
  fontWeight:"700",
  paddingLeft:22,
  paddingRight:22

},
text02: {
  textAlign:"center",
  fontSize:15,
  fontWeight:"700",
  padding:22
},
button:{
  backgroundColor:"orange",
  padding:20,
  borderRadius:15
},
buttonText: {
  color:"#fff",
  fontSize:15,
  fontWeight:"700"
}
})

이것이 오늘 숙제 내가 완성한 코드들이다.

처음과 지금 코딩을 처음하는사람들이라면 엄청나게 많아지고 달라졌다고 생각할수도 있다고 생각한다.(제가 그랬습니다.)
하지만 이해 하면 정작 정말 별것없는 내용이다.