기업협업 2일차, 본격적인 프로젝트에 들어가기 앞서 React Native, TypeScript와 친해지는 한 주를 보내고 있다. 프로그래밍 언어를 공부하는 데 있어 최고의 학습 방법은 역시 '많이 써보는 것'이라는데, 하룻동안 익힌 개념도 손으로 직접 써보며 구현해보니 이해가 금방 되었다. 그리고 무엇보다 앱 개발은 웹 개발과는 다른 또다른 매력이 있었다.😍
기억하고 싶은 개념 & 코드
Basic Components 중
-View : UI를 구성하는 기본 컴포넌트로 실제로는 영역을 구분하고 스타일이나 이벤트를 줘야할 때, 즉 <div>를 쓸 때와 같이 쓴다.
-ScrollView : 모바일로 화면을 내려서도 볼 수 있게 만들어야 하는 컨텐츠에 쓴다.
*view와 함께 썼을 때, view 화면은 자동으로 고정, ScrollView 컨텐츠는 스크롤링 된다. css의 fixed와 같은 효과가 있었다.
-StyleSheet : CSS styling을 줘야 할 때 쓴다. sytled component를 구성하는 것과 유사했다.
-TouchableOpacity: Button 대신 사용한다. (Button은 커스텀이 제한적이고, iOS와 Android 간 구현된 화면이 차이가 있다고 한다.)
- 컴포넌트를 한 페이지 안에서 사용할 때 상단에 해당 컴포넌트를 import 해주어야 한다. (import {SafeAreaView, ScrollView, StyleSheet} from 'react-native')
Styling
display: flex;가 기본 값이다. 🥳 또한 flex-direction의 기본 값은 'column'이기 때문에 가로 정렬을 하려면 flex-direction을 'row'로 줘야 한다.- 화면 전체를 채울 때 기존 React에서 'height: 100% or 100vh'를 사용했다면 React Native에서는 'flex: 1'을 사용한다.
*구현중인 의도치 않은 미니멀한 디자인의 To-Do list
Questions & Learned
- 앱 개발은 웹 개발보다 UI 구현에 제약이 있는 것처럼 보이지만 보다 직관적이고, 작은 화면에서 큰 이벤트를 줄 수 있는 섬세한 기능들이 많다. 특히, 터치로 작동되는 기능이 많기 때문에 관련해서 재밌는 메소드들이 많았다.
- React의 state, props 등을 사용해 구현하는 것이 같아 확실히 정리할 수 있었다. 오히려 웹보다 규모가 작아 더 명확하게 이해할 수 있었다.
- 새로운 기술을 배울 때 지레 겁먹곤 했다. 빨리 배워서 당장 뭔가를 만들어내야 한다는 부담감이 너무 컸기 때문에. 지금이야말로 더 부담되어야 하는 상황일 수 있지만 오히려 침착하게, 느리더라도 코드 하나하나 쳐보며 시험해보고 하나라도 내것으로 만드는 것이 중요하다는 것을 이젠 안다.
- Trello, GitHub을 사용한 프로젝트 관리를 시작했다. (애자일 프로젝트 관리 도구들이 많은데 우리 기업에서는 JIRA를 사용한다고 한다. 처음보는 툴들은 꼭 써보고 사용법정도 익혀둬야 겠다.)
- 내일부터는 React Native로만 구현했던 부분을 TypeScript로 바꾸며 공부해봐야겠다.
- 열심히 공부하는 건 좋은데 내가 기업에 와서 배우고 싶었던 게 무엇이었는지를 떠올려보면(기업 문화, 일하는 방식) 앉아만 있는게 최선은 아니겠구나하는 생각이 든다. 중간중간 기웃거리며 관찰하고, 생각하는 시간을 갖을 것.
