![]()
오늘은 위 사진처럼 주소의 일부 입력 시 유사 주소가 나오며 주소를 검색할 수 있는 방법에 대해서 작성해 보겠다.개발 순서는 이렇다. 1. 카카오 REST API 호출 //지역 검색 API 호출 const companyLocationGet = async () => { const url = `https://dapi.kakao.com/v2/local/search/address.json?query=${searchedLocation}&analyze_type=similar&page=1&size=30`; const headers = { Authorization: 'KakaoAK ${REST_API_KEY}', 'Content-Type': 'application/json;charse..
![]()
오늘은 위 사진과 같이 총 4가지를 개발해 보았다. 1. 이메일 유효성 검증 2. 검증 여부에 따른 메세지 , 메세지 색상 및 아이콘 표시 3. 이메일 유효성 검증이 완료되어야 버튼 활성화 4. 이메일 중복 확인 및 중복 확인에 따른 메세지, 메세지 색상 및 아이콘 표시 1. 이메일 유효성 검사 및 메세지 저장을 위한 state를 작성한다. // 입력 받는 이메일 저장 const [email, setEmail] = useState(''); // text input이 눌렸는지 const [EmailisPress, setEmailIsPress] = useState(false); // 이메일 validation 검증 const [isEmailCheck, setIsEmailCheck] = useState(fal..
![]()
오늘은 앱 아이콘을 설정해 보겠다. 간단하다. 1. 아래 링크를 이용하여 빈 공간에 로고를 드래그한 후 Generate 버튼을 누른다 위 과정을 거치는 이유는 현재 개발하는 앱을 아이폰, 아이패드, 애플워치, 맥북에서 사용할 수 있기 때문에 각각의 기기에 적합한 사이즈의 로고가 필요하기 때문이다. https://www.appicon.co/ 사진이 추출되면 아래 사진과 같이 AppIcons 폴더 속에 2개의 사진과 하나의 폴더가 들어있을 것이다. 두 개의 사진은 ios, android 개발 후 각각의 애플리케이션 스토어(앱스토어, 플레이스토어)에 배포 시 필요한 크기의 사진이다. 폴더 속의 사진들은 로고 사진을 크기별로 추출한 것이다. ex) 16.png는 16*16 사이즈의 로고 2. Xcode에서 아이..
![]()
Splash Screen이란 무엇인가? 애플리케이션 실행 시 애플리케이션의 컨텐츠의 로딩이 완료될 때까지 일시적으로 보여주는 화면을 의미한다. 자 이제 splash screen을 설정해 보겠다. 1. 프로젝트 폴더 경로에서 터미널을 열어 아래 명령을 입력한다. 해당 과정은 splash screen 설정을 위한 라이브러리 설치 과정이다. npm i react-native-splash-screen --save 2. 설치가 완료되었다면 아래 명령을 입력한다. 여기서 주의할 점. 본 글쓴이는 IOS를 이용하기 때문에 입력하는 것이다. npx pod-install 3. App.tsx를 열어 아래와 같은 코드를 추가해 준다. import SplashScreen from 'react-native-splash-scre..
