[RN/오류노트] Solved - task app:uploadCrashlyticsMappingFileDevRelease
·
React & React Native/오류노트
해당 글에서는 React-Native에서 빌드 시 발생하는 오류에 대한 해결방법을 확인합니다. 1) 문제점💡문제점- React-Native 환경에서./gradlew assembleRelease 명령어를 통해서 APK 파일을 생성하기 위해서 터미널에서 명령어를 수행하였으나 아래와 같은 빌드 오류가 발생하였습니다.WARNING: The specified Android SDK Build Tools version (33.0.0) is ignored, as it is below the minimum supported version (34.0.0) for Android Gradle Plugin 8.2.1. Android SDK Build Tools 34.0.0 will be used. To suppress thi..
[짧은 생각] 피드백
·
취미 생활/짧은 생각
문득 드는 짧은 생각을 적어봅니다. '피드백'이라는 단어는 사전적으로 '출력된 결과를 다시 입력(원인)측에 되돌려 출력하는 과정'이라고 합니다. 즉, 입력과 출력 간의 관계에서 입력에 대한 출력이 도출되었을 때, 이에 대해서 추가로 다른 사람의 의견을 반영하여 이를 보완하고 다시 입력으로 되돌려 결과를 도출해 내는 하나의 순환적인 과정으로 이해가 되었습니다. 즉, 일상에서 어떠한 일을 통해서 결과를 얻었을 때, 누군가가 그 결과를 봐주고 "이런 것은 좋은데, 이런 면이 좀 부족하네"라고 결과에 대한 조언을 해주어 더 나은 결과를 만들어 내는 과정으로 설명이 됩니다. 알게 모르게, 일상 생활에서 이러한 피드백에 대해 인지하지 못할 때가 많습니다. 내가 하고 있는 일을 잘하고 있는 중에 누군가가 이에 대해서..
[Java] Spring Boot 3.x 환경에서 Swagger3 이해하고 적용하기 : SpringDoc OpenAPI Starter WebMVC UI 및 구성 방법
·
Java/Spring Boot
해당 글에서는 Spring Boot 3.x 버전 내에서 Swagger3을 SpringDoc OpenAPI Starter WebMVC UI를 통해 이해하고 설정하는 방법에 대해 알아봅니다.💡  [참고] Swagger에 대해 상세히 궁금하시면 아래의 글을 참고하시면 도움이 됩니다.분류링크RESTful API 설계 방법 -1 : 이해하기https://adjh54.tistory.com/150RESTful API 설계 방법 -2 : 구성하기https://adjh54.tistory.com/151Spring Boot 2.x 환경에서 Swagger 이해하고 적용하기 : SpringDoc openAPI UIhttps://adjh54.tistory.com/72Spring Boot 3.x 환경에서 Swagger3 이해하고..
[RN/Short] React Native ScrollView 최상단, 최하단으로 이동 시 동작 처리 방법
·
React & React Native/Short 개발
해당 글에서는 react-native 환경에서 ScrollView로 최상단, 최하단을 이동했을 때 이벤트를 발생시키는 동작 처리 방법에 대해 알아봅니다. 1) ScrollView의 최상단, 최하단으로 이동시 동작 처리 방법💡ScrollView의 최상단, 최하단으로 이동시 동작 처리 방법- Scroll로 이동을 하였을 때, 최상단일 때와 최하단일 때에 대해서 특정 이벤트를 발생시키는 동작 처리를 확인해 봅니다.  1. ScrollView💡ScrollView- React Native에서 제공하는 스크롤 가능한 컨테이너 컴포넌트입니다. 이 컴포넌트는 내부의 콘텐츠가 화면 크기를 초과할 때 유용하게 사용됩니다. 💡[참고] ScrollView 속성속성설명onScroll스크롤 이벤트가 발생할 때 호출되는 함수..
[RN/Short] React Native TextInput 입력 시 최초 키보드 타입 지정 방법: 대문자, 소문자, 숫자
·
React & React Native/Short 개발
해당 글에서는 react-native 환경에서 TextInput으로 텍스트를 입력할 때 최초 키보드의 타입을 지정하는 방법에 대해 알아봅니다. 1) TextInput 입력 시 최초 키보드 타입 지정(대문자, 소문자) : autoCapitalize 💡TextInput 입력 시 최초 키보드 타입 지정(대문자, 소문자) : autoCapitalize- 사용자의 편의성을 위해서 대문자만을 입력을 받는 경우에 최초 키보드가 띄어질 때, 대문자 패드로 출력이 되면 편리하기에 이에 대한 적용을 수행합니다.- 이를 해결하기 위해 autoCapitalize 속성을 활용합니다. TextInput · React NativeA foundational component for inputting text into the app..
[RN/Short] React Native 디바이스 별 폰트 사이즈 고정 설정 방법 : Text, TextInput
·
React & React Native/Short 개발
해당 글에서는 디바이스 별로 사용자 시스템에서 지정한 폰트 사이즈에 따라서 앱의 사이즈가 달라지기에 이에 따라서 앱 내에서 이를 고정하는 방법에 대해 알아봅니다. 1) 디바이스 별 사이즈 고정하기 : Text, TextInput💡디바이스 별 사이즈 고정하기 : Text, TextInput- 사용자 별로 디바이스에 대한 글자 크기를 지정할 수 있습니다. 그렇기에 각각 화면상에 보이는 글자 크기가 달라집니다.- 앱에서 변화된 크기에 따라 디자인이 적용되면 좋겠지만, 이에 대해 고정하여서 동일한 글자 크기에 대해서 디자인을 적용하기 위해서 ‘앱 내에서 이를 고정하는 방법’에 대해 알아봅니다.1. Android 글자 크기 확인 방법💡Android 글자 크기 확인 방법- 설정 > 디스플레이 > 글자 크기와 스..
[RN/Short] React Native Modal 뒷 배경 반투명 처리 방법 : centeredView
·
React & React Native/Short 개발
해당 글에서는 react-native 환경에서 Modal 팝업에서 팝업 외에 화면을 반투명 처리를 하여 뒤에 화면이 보이도록 하는 방법에 대해 알아봅니다. 1) Modal 태그 뒷 배경 불투명 처리 방법💡Modal 태그 뒷 배경 투명 처리 방법- Modal 팝업이 띄어지고 화면상에 출력이 될 때, 뒤에 배경을 반투명 처리를 하여서 팝업임을 나타내기 위해서 사용이 되는 방법입니다. Modal · React NativeThe Modal component is a basic way to present content above an enclosing view.reactnative.dev 1. centeredView 스타일 적용💡centeredView 스타일 적용- Modal 컴포넌트에서 사용되는 스타일 객체..
[RN/Short] React Native Text 줄 넘김에 대해 … 처리 방법 : numberOfLines + ellipsizeMode
·
React & React Native/Short 개발
해당 글에서는 React-native 환경에서 Text 글이 넘어감에 따라서 ... 처리를 하기 위한 방법에 대해 알아봅니다. 1) Text 태그 줄 넘김에 대해 … 처리 방법 : numberOfLines + ellipsizeMode💡Text 태그 줄 넘김에 대해 … 처리 방법 : ellipsizeMode- 텍스트의 길이가 일정 숫자를 넘어가게 되면 잘리는 현상이 발생합니다. 이에 대해서 긴 문자에 대해, ‘…’으로 잘린 부분에 대해 대체하기 위해 사용이 됩니다.- 이를 해결하기 위해 Text 속성 중 numberOfLines + ellipsizeMode 속성을 이용합니다. 1. Text 태그 속성💡Text 태그 속성- Text 태그의 속성들로 여러 가지 들이 있지만 주요한 태그들에 대해서만 알아봅니..
[RN/Short] React Native Android / iOS 앱의 화면 방향 고정: 가로 모드 막는 설정 방법
·
React & React Native/Short 개발
해당 글에서는 react-native 환경에서 Android / iOS 환경에서 가로 모드를 지원하지 않는 경우 이를 막는 설정 방법에 대해 알아봅니다. 1) 디바이스 가로모드 막는 설정 방법💡디바이스 가로모드 막는 설정 방법  💡디바이스 가로모드로 적용하였을 때 장점장점설명사용자 경험 일관성모든 화면이 일관된 방향으로 표시되어 사용자 경험이 향상됩니다.레이아웃 단순화개발자 입장에서는 가로 모드 레이아웃을 별도로 설계할 필요가 없어 개발 과정이 간소화됩니다.리소스 최적화세로 모드만 지원하므로 메모리 및 처리 리소스를 더 효율적으로 사용할 수 있습니다. 1. 안드로이드 방향 설정: android/src/main/AndroidManifest.xml💡안드로이드 : android/src/main/Andr..
[RN/Short] React Native 특정 영역 선택 시 키보드 닫기 : Keyboard.dismiss 활용
·
React & React Native/Short 개발
해당 글에서는 React-Native 환경에서 텍스트 입력 후 ‘확인’ 버튼을 눌러서 키보드 닫는 불편함을 피하기 위해 특정 영역을 선택하였을 때, 키보드를 닫는 방법에 대해 알아봅니다. 1) 특정 영역 선택시 키보드 닫기 : TouchableWithoutFeedback + Keyboard.dismiss 활용 💡특정 영역 선택시 키보드 닫기 : TouchableWithoutFeedback + Keyboard.dismiss 활용- 사용자의 편의성을 위해 키보드로 텍스트를 입력하는 도중에 ‘확인’ 버튼을 누르는 것이 아닌 작성이 완료되면, 특정 영역을 선택하면 키보드가 닫히는 액션을 구현하기 위해서 이를 활용합니다.- 이를 위해서 TouchableWithoutFeedback 태그내에 onPress 이벤트로..