내맘대로 개발일지

📱테스트 환경"react": "18.2.0""react-native": "0.74.2"이미지를 호출하는 방식이 2개인데하나는 외부 URL 링크를 통해서 호출하는 방법이고하나는 내부 이미지를 호출 하는 방법이다.나는 이미지를 /assets/img 폴더에 모아놓기 때문에경로는 자기에 맞게 수정하면된다.1. 내부이미지 호출하는 방법이런식으로 source 안에 require 를 이용하여 내부 이미지를 호출한다.2. 외부이미지 호출하는 방법내부이미지 호출방법과 다른 점은 source 안에 중괄호가 하나 더 들어간다는 점과uri 를 통해 이미지를 호출한다는 것이다.이미지를 호출하는 방식이 다르다 보니 한번씩 햇갈릴때가 있는데이번기회에 햇갈리지 않도록 기억해두자 ..

📱테스트 환경"react": "18.2.0""react-native": "0.74.2"역시 사람의 뇌는 믿을게 안된다 .. 한달전에 한 세팅이 기억이 안나서전에 했던 설정을 다시 살펴보는 지경 .. ㅠ설정하는 방법을 기록하면서 다시한번 새기기 위해서 작성한다.1. 외부 폰트 파일 ( .ttf .otf ) 파일을 다운받는다.2. 다운받은 파일을 /assets/fonts 폴더에 저장한다.3.react-native.config.js 파일을 수정한다. ( 없으면 생성 )module.exports = { project: { ios: {}, android: {}, }, assets: ['./assets/fonts'],};4. npx react-native-asset 명령어를 입력해주면 끝난다.5...

📱테스트 환경"react": "18.2.0""react-native": "0.74.2"Nuxt 에서 사용하던 Router.push() 나React 에서 사용하던 navigate 를 사용하고있었다.간단하게 사용할 순 있는데 자꾸 까먹게되서 설정하는 방법을 기록하려고 한다.const TestCalcScreen = ({navigation}: NavigateProps) => { return (...)}export default TextScreen해당 컴포넌트를 생성할때 호출해주면된다.NavigateProps 타입은 만들어서 사용해주면되는데// types.tsximport {NativeStackScreenProps} from '@react-navigation/native-stack';import {RootS..

📱테스트 환경"react": "18.2.0""react-native": "0.74.2"React 에서 사용하던 을 사용하려고 보니 당연히 안됐고 ..이게 몇개있는데 사용방법은 다른 글을 확인해보면 좋다. [RN] Input 사용하기📱테스트 환경"react": "18.2.0""react-native": "0.74.2"React 와 React-Native 가 같다고 하니Input 도 당연히 이렇게 쓰려고 하니 당연히 안됐고 ^^ ..React Native 에서 Input 을 사용하는 방법은 다음과 같다.import { T8735.tistory.com   [RN] Alert 사용하는 방법📱테스트 환경"react": "18.2.0""react-native": "0.74.2"버튼을 눌렀을 때 API 사용후..

📱테스트 환경"react": "18.2.0""react-native": "0.74.2"React 와 React-Native 가 같다고 하니Input 도 당연히 이렇게 쓰려고 하니 당연히 안됐고 ^^ ..React Native 에서 Input 을 사용하는 방법은 다음과 같다.import { TextInput } from 'react-native'; setYear(v)}/>특이점은 Input 의 type 처럼keyboardType 을 통해 키보드 타입을 선택할 수 있다.나머지는 React 와 동일하다.

📱테스트 환경"react": "18.2.0""react-native": "0.74.2"버튼을 눌렀을 때 API 사용후에 '소중한 한표 감사합니다❤️' 창을 띄워주고 싶었는데React 나 다른 JS 에서 alert('소중한 한표 감사합니다❤️') 이렇게 썼으니까 ..어차피 RN 도 React 기반이니까 똑같거니 했더니 역시 안됐다 ^^React Native 에서 Alert 를 사용하는 방법은 다음과같다.import { Alert } from 'react-native';Alert.alert('소중한 한표 감사합니다❤️')이렇게 아주 간단하게 사용할 수 있다.더 자세한 사용방법은 공식문서에서 확인해볼 수 있는데확인누르고 콜백받아서 처리를 하거나,타이틀이나 텍스트도 정해줄 수 있다. Alert · React ..

📱테스트 환경"react": "18.2.0""react-native": "0.74.2"광고를 붙여야 돈을 벌 수 있으니 광고를 붙여보려고 한다.근데 Android 는 좀해봤어도 IOS 개발은 안해봐서 설정에 좀 애먹다보니해당 설정하는 내용을 기록하려고 한다!Podfile 에pod 'Google-Mobile-Ads-SDK'해당 내용 추가해당 내용은target 'ProjectName' do안에 넣어주면 된다.그다음 Xcode 에서File > Add Package Dependencies... 에서https://github.com/googleads/swift-package-manager-google-mobile-ads.git추가해주면 끝!면 좋겠지만 .. 진짜 프로젝트 생성할때마다 에러를 겪어서 해당 방법을 ..

📱테스트 환경"react": "18.2.0""react-native": "0.74.2"최근 이제 React Native 로 IOS 플랫폼 개발도 하다보니 맥에서 개발을 시작했는데나는 IOS 개발이 이번이 첨이라 참 .. 어려웠는데[!] Failed to load 'glog' podspec: [!] Invalid `glog.podspec` file: undefined method `[]' for nil.이 에러가 참 날 정신나가게 만들었다 ㅎpod install 을 진행할때마다 해당 에러가 발생하면서 Podfile.lock 파일이 생기지도 않았고xCode 시뮬레이터도 계속 에러만 뱉어내니 너무 답답했는데원인이 코드에 있지않아 너무 슬펐는데 xCode 의 경로를 차지 못해서 발생한 에러였다.sudo xco..

React Native Error : java.io.UncheckedIOException: Could not move temporary workspaceWhat went wrong: java.io.UncheckedIOException: Could not move temporary workspace (C:\Users\Sreya\Desktop\sreya\love-knot\android.gradle\8.6\dependencies-accessors\stackoverflow.com아니 무슨 프로젝트를 생성할때마다 에러가 발생해 ..답답해서 이것저것 찾아보고있었는데 여기서 알려준 버전 다운그레이드가 가장 효과적이였다.IntelliJ 에러라는말도 있고 하는거보면 나도 WebStorm 사용중이라 그런가 싶긴하다.아무튼..

나는 지금까지 React 개발을 하면서 스타일은 항상 Styled-components 를 사용해왔다.이유는 딱히 없었다.  React 처음할때 사용한 css 가 저거였을 뿐.그이후로도 쭉 React 관련 프로젝트를 할때마다 사용했고 익숙하니까 속도도 나왔다.근데 타의로 최근 scss 를 사용하게 되었는데 익숙함에 오는 거부감인지 왠지 자꾸 단점만 찾게되고다른사람들이 바보같아보였다. 근데 나는 저게 왜 좋은지도 모르고 쓰는건데이번기회에 어떤점이 좋은건지. 왜 쓰는건지 알고 사용하고더 좋은게 있다면 바꿀 수 있도록 하기위해 Styled-components 의 정리를 하려고 한다.npm install styled-componentsimport styled from 'styled-components'const ..