앱개발 학습. 화면 만들기(JSX 기본 문법)

 

// 앱개발 종합반 - 2주차(스파르타코딩클럽)

JSX, 화면을 구성하는 태그 문법

• return 은 작성한 JSX문법으로 구성된 화면을 앱상에 보여주는 역할
• 이 동작을 렌더링이라고 함
• JSX는 <View>...</View> 꺽쇠 형태 태그로 쓰여짐
  • Html 태그와 구성이 비슷하다. 사용법도 유사할것같다

---

JSX 기본 문법

• 모든 태그는 가져와서 사용한다
  • https://reactnative.dev/docs/view?redirected

View · React Native

• 태그는 항상 닫는 태그와 자체적으로 닫는 태그를 구분해서 사용해야 함
• 모든 엘리먼트를 감싸는 최상위 엘리먼트가 있어야 함. 엘리먼트는 곧! 태그 <>

<View style={styles.container}>
      <Text style = {styles.textStyle}>스파르타 이얍얍</Text>
      <StatusBar style="Auto" />
    </View>

• return에 의해 렌더링 될 땐 항상 소괄호()로 감싸져야 한다.
• JSX 문법 밖에서의 주석과 안에서의 주석은 다르다!
  • return 문 안(태그 안)은 JSX의 영역이고
  • 밖은 Javascript의 영역