위어드섹터 공식 블로그

최근 진행한 프로젝트 중 React Native를 이용한 App 제작에서 OS 영역을 맡게 되었습니다. 안드로이드와 iOS 개발을 동시 진행하면서 안드로이드에서는 잘 구현되는 기능이 iOS에서는 작동이 안 되는 경우가 생겨 수시로 기능 및 스타일을 확인해야 하는 경우가 생겼습니다. Xcode로 통해 개발을 진행하고 있었지만 불현듯 스마트폰에 연결 후 실시간 연동이 가능했으면 좋겠다 라는 생각을 가지게 되었고, 확인이 가능한 기능이 존재해 개발 진행에 많은 도움이 되어 이번 게시물로 통해 공유하려고 합니다. iOS 개발 특성상 맥 기기와 애플 개발자 계정을 가지고 있어야만 가능합니다. 우선 Xcode를 사용하여 아이폰으로 실시간 연동 및 TestFlight로 통해 Test App 업로드, AppStore에..

리액트 네이티브 기반의 프로젝트를 진행하던 중, 버튼을 화면의 제일 하단으로 배치하고 나머지 영역은 콘텐츠로 채우는 디자인을 퍼블리싱하게 되었습니다. , 태그를 최상단에 작성했을때, 이 태그와 최하단 버튼에 아래와 같이 flex : 1 을 주면 원하는 대로 스타일이 적용되었습니다. test: { flex:1, } 그런데, 태그를 최상단에 작성 후, 위와 같이 스타일을 주었으나 적용되지 않았습니다. 알고나면 쉬운 해결 방법이지만 무엇이 문제인지 모를 때는 답답한 상황입니다..! 이번 글에는 태그를 최상단에 작성했을 때, 최하단으로 버튼을 정렬하는 방법을 공유하려 합니다. 먼저, 제가 디자인 받은 시안은 아래와 같습니다. 텍스트 콘텐츠 영역이 태그로 되어있습니다. [ 시도했던 해결 방안 ] 위 문제를 겪고 ..

진행 중인 프로젝트에서 펼쳐보기 버튼을 누르면 상세보기가 되고 생략 버튼을 누르면 생략이 되는 버튼을 컴포넌트가 추가될 때 자동으로 생성되는 것을 목표로 구현해보았습니다. 처음 시도에서는 컴포넌트를 보여주는 것을 관리하는 state를 각각 만들어서 독립적으로 관리하려고 했습니다. 하지만 그렇게 되면, 추가 버튼을 눌러서 컴포넌트를 새로 만들면 새롭게 변수를 만들어야 하는데, 변수를 자동 생성하는 게 쉽지 않았고 변수가 많아짐에 따라 코드의 가독성이 저하되고 유지 보수하는데 어려움이 있는 문제가 발생하였습니다. 이후, 컴포넌트를 보여주는 Boolean 값들을 가지는 배열을 state로 만들었습니다. 그렇게 함으로써 새롭게 컴포넌트를 만들 때, 배열에 값을 push를 해서 관리하기 용이하도록 하였습니다. 이..