๋ฆฌ์กํธ ๋ค์ดํฐ๋ธ
-
- [React Native] ํด๋ฆญ ์, ๋ฆฌํ ํจ๊ณผ(Ripple Effect) ์ฃผ๋ ๋ฐฉ๋ฒ
ํด๋ฆญ ์, ๋ฆฌํ ํจ๊ณผ(Ripple Effect) ์ฃผ๋ ๋ฐฉ๋ฒ๋ค์ด๊ฐ๋ฉฐ๋ฆฌ์กํธ ๋ค์ดํฐ๋ธ(React Native)์์ ์์ ํด๋ฆญ ์, ๋ฆฌํ ํจ๊ณผ(Ripple Effect)๋ฅผ ์ค ์ ์๋ ๋ฐฉ๋ฒ์ ์ ๋ฆฌํด๋ณธ๋ค. ๋ฐฉ๋ฒ์ฐ์ ํน์ ์์์ ํด๋ฆญ ์ด๋ฒคํธ๋ฅผ ๋ฃ๊ธฐ ์ํด์๋ @Pressable@ ์ปดํฌ๋ํธ๋ก ํด๋น ์์๋ฅผ ๊ฐ์ธ์ค์ผ ํ๋ค.import { View, Text, Pressable } from 'react-native';function MyComponent(props) { return ( {/* ํด๋ฆญ ํจ๊ณผ๋ฅผ ๋ฃ์ ์์๋ฅผ ๊ฐ์ธ์ค๋ค. */} {props.text} );} Android OS@Pressable@ ์ปดํฌ๋ํธ์ @android_ripple@ ์์ฑ์ ์ถ๊ฐํ์ฌ ์์ ํด๋ฆญ..
1 2024.12.11 -
- [React Native] FlatList
FlatList๋ค์ด๊ฐ๋ฉฐ๋ฆฌ์กํธ ๋ค์ดํฐ๋ธ(React Native)์ @FlatList@ ์ปดํฌ๋ํธ์ ๋ํด ์ ๋ฆฌํด๋ณธ๋ค. FlatList๊ฐ๋ ํจ์จ์ ์ผ๋ก ๋๋์ ์คํฌ๋กค ๊ฐ๋ฅํ ํญ๋ชฉ์ ๋ ๋๋งํ๊ธฐ ์ํด ์ฌ์ฉ๋๋ ์ปดํฌ๋ํธ์ต์ ํ๋ ๊ฐ์ ์คํฌ๋กค๋ง ๊ธฐ๋ฅ์ ์ ๊ณตํ์ฌ ์ฑ๋ฅ ๋ฌธ์ ๋ฅผ ์ค์ด๊ณ , ์คํฌ๋กค ์ ํ์ํ ํญ๋ชฉ๋ง ๋ ๋๋งํ๋ค.@ScrollView@ ์ปดํฌ๋ํธ์์ ์ฐจ์ด์ ์ฃผ์ ์์ฑ์์ฑ์ค๋ช @data@- ๋ ๋๋งํ ๋ฐ์ดํฐ ๋ฐฐ์ด(Array)์ ์ ๋ฌ- ๋ฐฐ์ด์ ๊ฐ ์์๋ ๋ ๋๋ง๋ ํญ๋ชฉ์ ๋ฐ์ดํฐ@renderItem@- ๋ฐ์ดํฐ๋ฅผ ์ด๋ป๊ฒ ๋ ๋๋งํ ์ง ์ ์ํ๋ ํจ์- ๋งค๊ฐ๋ณ์๋ก @{ item, index }@ ํํ์ ๊ฐ์ฒด๋ฅผ ๋ฐ๋๋ค.@keyExtractor@- ๊ฐ ํญ๋ชฉ์ ๊ณ ์ ํค๋ฅผ ๋ฐํํ๋ ํจ์- ๊ธฐ๋ณธ์ ์ผ๋ก @item.key@ ๋๋ @item.id@๋ฅผ ์ฌ์ฉ..
2024.12.10 -
- [React Native] Expo Go ์ฑ์์ Expo ํ๋ก์ ํธ ์ฐ๊ฒฐ ์๋๋ ๋ฌธ์ ํด๊ฒฐ ๋ฐฉ๋ฒ (There was a problem running the requested app)
Expo Go ์ฑ์์ Expo ํ๋ก์ ํธ ์ฐ๊ฒฐ ์๋๋ ๋ฌธ์ ํด๊ฒฐ ๋ฐฉ๋ฒ (There was a problem running the requested app)๋ค์ด๊ฐ๋ฉฐExpo Go ์ฑ์์ PC์์ ์์ฑํ Expo ํ๋ก์ ํธ๋ฅผ ์ฐ๊ฒฐํ ๋, ์๋์ ๊ฐ์ ์ค๋ฅ๊ฐ ๋ฐ์ํ ๋ ํด๊ฒฐํ๋ ๋ฐฉ๋ฒ์ ์ ๋ฆฌํด๋ณธ๋ค. ๋ฐฉ๋ฒโ ๋์ผํ ๋คํธ์ํฌ์ ์ฐ๊ฒฐ๋์ด ์๋์ง ํ์ธํ๊ธฐPC์ Expo Go ์ฑ์ด ์ค์น๋ ๋ชจ๋ฐ์ผ ์ฅ์น๊ฐ ๋ชจ๋ ๋์ผํ ๋คํธ์ํฌ(์์ดํ์ด)์ ์ ์๋์ด ์๋์ง ํ์ธํ๋ค. โก ์ ์ดํ์์ NodeJS ๊ด๋ จ ๊ธฐ๋ฅ ์ค์ ํ๊ธฐ[์ ์ดํ] > [์์คํ ๋ณด์] > [Windows Defender ๋ฐฉํ๋ฒฝ] > [ํ์ฉ๋๋ ์ฑ]์์ @NodeJS JavaScript Runtime@ ํญ๋ชฉ์ @[๊ฐ์ธ]@, @[๊ณต์ฉ]@์ ๋ชจ๋ ์ฒดํฌํด์ค๋ค.
2024.11.26 -
- [React Native] Expo CLI vs. React Native CLI
Expo CLI vs. React Native CLI๋ค์ด๊ฐ๋ฉฐ๋ฆฌ์กํธ ๋ค์ดํฐ๋ธ(React Native) ํ๋ก์ ํธ ์์ฑ ๋ฐฉ๋ฒ์ผ๋ก Expo CLI ์ React Native CLI ๋ฐฉ๋ฒ 2๊ฐ์ง๊ฐ ์๋ค.์ด ๋ ๋ฐฉ๋ฒ์ ์ฐจ์ด์ ์ ๊ฐ๋จํ๊ฒ ์ ๋ฆฌํด๋ณธ๋ค. Expo CLI๊ฐ๋ ๋ฆฌ์กํธ ๋ค์ดํฐ๋ธ๋ก ์ฑ์ ๊ฐ๋ฐํ ๋ ์ฌ์ฉ๋๋ ๋๊ตฌํ๋ก์ ํธ ์์ฑ, ๊ด๋ฆฌ, ์คํ์ ๊ฐ๋จํ๊ฒ ํด์ฃผ๋ ๋ช ๋ น์ค ์ธํฐํ์ด์ค(Command Line Interface)๋ฆฌ์กํธ ๋ค์ดํฐ๋ธ ํ๋ก์ ํธ๋ฅผ ์์ฑํ ๋ ๊ธฐ๋ณธ์ ์ผ๋ก ๊ถ์ฅ๋๋ ์ ๊ทผ ๋ฐฉ์ ์ ํ๋ก์ ํธ ์์ฑํ๊ธฐ$ npx create-expo-app@latest # ์ ํ๋ก์ ํธ ์์ฑ ์ฃผ์ ํน์ง๊ธฐ๋ณธ ํ ํ๋ฆฟ์ ์ ๊ณตํ์ฌ ์ด๊ธฐ ์ค์ ์์ด ๋ฐ๋ก ์ฑ ๊ฐ๋ฐ ์์ ๊ฐ๋ฅ์นด๋ฉ๋ผ, ์์น ์ ๋ณด, ํธ์ ์๋ฆผ ๋ฑ ๋ค์ดํฐ๋ธ ๊ธฐ๋ฅ์ ์ฝ๊ฒ ์ฌ์ฉํ ..
2024.11.25