일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- unittest
- build
- vsCode
- 센토스
- PYTHON
- 맥
- avds
- MachineLearning
- 리눅스
- androidstudio
- MAC
- VirtualBox
- jest
- 네트워크
- xcode
- picker
- react
- localserver
- 개발
- node
- TensorFlow
- IOS
- Chrome
- centos
- qunit
- webpack
- ReactNative
- Android
- linux
- Today
- Total
목록전체 글 (484)
로메오의 블로그
React 목록 react-native-make 설치 $ npm install --save-dev @bam.tech/react-native-make App 아이콘 1024 * 1024 사이즈의 png 이미지로 아이콘을 준비합니다. $ npx react-native set-icon --path ./src/assets/res/icon-1024.png --background "#191919" Android와 ios에 아이콘이 사이즈 별로 생성되었습니다. Splash 이미지 $ npx react-native set-splash --path ./src/assets/res/launchImage.png --resize center --background "#191919" android와 ios에 사이즈별 splash..
React 목록 async-storage 설치 $ npm install @react-native-async-storage/async-storage App.tsx import React, {useEffect, useState} from 'react'; import { View, SafeAreaView, StatusBar, Text, TouchableOpacity, StyleSheet, } from 'react-native'; import AsyncStorage from '@react-native-async-storage/async-storage'; type Nation = { nation: string; company: string; }; const App = () => { const [list, setL..
PYTHON 차례 requests 설치 $ pip install requests call.py import requests def call(): headers = { 'Content-Type' : 'application/x-www-form-urlencoded' } payload = { 'id': 'foo', 'name': 'bar' } url = 'https://domain.com' response = requests.post(url, headers=headers, data=payload) print(response) call() 코드 실행 $ python3 call.py PYTHON 차례
PYTHON 차례 interval.py import threading def set_interval(func, sec): def func_wrapper(): set_interval(func, sec) func() t = threading.Timer(sec, func_wrapper) t.start() return t seq = 1 def interval_func(): global seq seq = seq + 1 print('interval: ' + str(seq)) set_interval(interval_func, 3) 코드 실행 $ python3 interval.py PYTHON 차례
React 목록 Chrome DevTools 설정 react-native ios에서 command + d를 누르고 Open React DevTools를 선택하면 아래의 오류가 발생합니다. error Browser exited with error:, Error: invalid url, missing http/https protocol React Native가 사용하는 Hermes 엔진을 크롬에서 직접 설정해 줘야합니다. 크롬에서 DevTools 디버깅하기 크롬에서 chrome://inspect/ 에 접속합니다. Configure를 누르고 localhost:8081을 추가합니다. 여러개의 Hermes가 표시되는 이 중 하나입니다. ㅋ inspect를 누릅니다. DevTools에서 console을 확인 할 수..
React 목록 App.tsx import React from 'react'; import {SafeAreaView, StatusBar} from 'react-native'; import {Provider} from 'react-redux'; import {store} from './src/redux/store'; import TodoHeader from './src/components/TodoHeader'; import TodoList from './src/components/TodoList'; const App = () => { const RootApp = () => { return ( ); }; return ( ); }; export default App; store.ts import {config..
React 목록 https://randomuser.me/documentation#pagination Api 더미 데이터는 위 사이트에서 가져옵니다. App.tsx import React from 'react'; import {SafeAreaView, StatusBar} from 'react-native'; import {Provider as ReduxProvider} from 'react-redux'; import UserList from './UserList'; import store from './store'; const App = () => { return ( ); }; export default App; store.ts import {combineReducers, configureStore} fr..
React 목록 설치 $ npm install @reduxjs/toolkit counter.ts $ mkdir src/redux $ touch src/redux/counter.ts import {createSlice} from '@reduxjs/toolkit'; import type {PayloadAction} from '@reduxjs/toolkit'; export interface CounterState { count: number; } const initialState: CounterState = { count: 0, }; export const counterSlice = createSlice({ name: 'counter', initialState, reducers: { increment: sta..
React 목록 프로젝트 생성 $ npx react-native init dragableList --template react-native-template-typescript React Native Reanimated 설치 $ npm install --save react-native-reanimated babel.config.js module.exports = { presets: ['module:metro-react-native-babel-preset'], plugins: ['react-native-reanimated/plugin'], }; plugins에 react-native-reaminated/plugin을 추가합니다. react-native-gesture-handler 설치 $ npm instal..
React 목록 App.tsx import React from 'react'; import {View, StyleSheet} from 'react-native'; import ChildScreen from './src/screens/ChildScreen'; const App = () => { const company = [ { country: 'Korea', company: 'Samsung', }, { country: 'USA', company: 'Apple', }, { country: 'Japan', company: 'Sony', }, ]; // 자식으로부터 호출됨 const onCalled = (param: string) => { console.log(param); }; return ( ); }; e..
React 목록 구글 Noto KR 폰트 다운로드 https://fonts.google.com/noto/specimen/Noto+Sans+KR Download family 로 폰트 다운로드합니다. StyleSheet에 적용 import { View, Text, StyleSheet } from 'react-native'; ... const HomeScreen = () => { ... return ( C ); }; export default HomeScreen; const styles = StyleSheet.create({ ... keypadNumber: { ... fontFamily: 'Noto Sans KR', }, ... }); font를 인지하지 못합니다. iOS 폰트 설정 $ mkdir src/io..
React 목록 모듈 설치 $ npm install redux $ npm install react-redux $ npm install redux-thunk 파일 생성 $ mkdir src $ mkdir src/redux $ mkdir src/screens $ touch src/redux/actions.tsx $ touch src/redux/reducer.tsx $ touch src/redux/store.tsx $ touch src/screen/HomeScreen.tsx $ touch src/screen/ChildScreen.tsx store.tsx import {legacy_createStore, combineReducers, applyMiddleware} from 'redux'; import thunk..
React 목록 import React, {useState} from 'react'; import {View, Text, StyleSheet, Button, ScrollView} from 'react-native'; interface State { name: string; } export default function App() { const [companies, setCompany] = useState([ {name: 'google'}, {name: 'samsung'}, {name: 'microsoft'}, {name: 'facebook'}, {name: 'apple'}, ]); const add = () => { const newCompany = {name: 'newCompany'}; setCompa..
React 목록 import React, {useState} from 'react'; import {View, Text, StyleSheet, Button} from 'react-native'; interface State { age: number; } export default function App() { const [count, setCount] = useState({age: 0}); const increase = () => { setCount({age: count.age + 1}); }; const descease = () => { setCount({age: count.age - 1}); }; return ( {count.age} ); } const styles = StyleSheet.create..
React 목록 import React, {Component} from 'react'; import {View, Text, StyleSheet, Button} from 'react-native'; interface State { name: string; age: 0; } export default class App extends Component { state: State = { name: '', age: 0, }; render() { return ( {this.state.name} { this.setState({ name: 'hello', }); }} /> ); } } const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'c..
React 목록 react-native navigation 설치 $ npm install @react-navigation/native --save $ npm install react-native-screens react-native-safe-area-context --save $ npm install @react-navigation/native-stack --save $ npm install @react-navigation/bottom-tabs --save 파일생성 $ mkdir navigation $ mkdir navigation/screens $ touch navigation/MainNavigation.tsx $ touch navigation/screens/HomeScreen.tsx $ touch n..
React 목록 react-native navigation 설치 $ npm install @react-navigation/native --save $ npm install react-native-screens react-native-safe-area-context --save $ npm install @react-navigation/native-stack --save iOS 모듈 설치 $ cd ios $ pod install $ cd .. Android 모듈 설치 ... import android.os.Bundle; public class MainActivity extends ReactActivity { ... @Override protected void onCreate(Bundle savedInstan..
React 목록 App.tsx import React from 'react'; import { SafeAreaView, StatusBar, StyleSheet, Text, useColorScheme, View, } from 'react-native'; import {Colors} from 'react-native/Libraries/NewAppScreen'; const App = () => { const isDarkMode = useColorScheme() === 'dark'; const backgroundStyle = { backgroundColor: isDarkMode ? Colors.darker : Colors.lighter, }; return ( Restaurant App Explore Restau..
React 목록 react-native-cli 삭제 $ sudo npm uninstall -g react-native-cli 기존에 설치된 react-native-cli를 삭제합니다. Node, Watchman, JDK, Ruby 설치 $ brew install node $ brew install watchman $ brew tap homebrew/cask-versions $ brew install --cask zulu11 $ brew tap AdoptOpenJDK/openjdk $ brew install --cask adoptopenjdk8 $ rvm install "ruby-2.7.5" $ sudo gem install cocoapods 프로젝트 생성 및 실행 $ cd my/project/folder..
React Native [React Native] 프로젝트 생성하기 (2019년 기준) [React Native] 프로젝트 생성하기 (2022년 기준) [React Native] Plugin 설치/삭제하기 [React Native] Codepush 설치하기 [Appcenter] [React Native] Codepush module 설치 [Appcenter] [React Native] Codepush deployment key 설정 [Appcenter] [React Native] Codepush 배포하기 [Appcenter deployment] [React Native] Stack navigation 사용하기 (2019년 기준) [React Native] Stack navigation 사용하기 (2022..