본문 바로가기

프로그래밍/React Native11

Mac에서 react-native 개발환경 세팅하기 React Native는 iOS 및 Android 모바일 애플리케이션을 만드는 데 사용되는 JavaScript 기반의 프레임워크입니다. 이번에는 Mac에서 React Native 개발 환경을 설정하는 방법에 대해 알아보겠습니다. 1. Node.js 설치 React Native를 개발하기 위해서는 먼저 Node.js가 필요합니다. Node.js를 다운로드하려면 공식 웹사이트에서 다운로드 페이지로 이동하십시오. Mac OS 버전에 맞는 버전을 다운로드하고 설치하십시오. Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2. Watchman 설치 Watchman은 파일 시스템 변경을 감지하고 해당.. 2023. 2. 27.
Windows에서 react-native 개발환경 세팅하기 React Native는 iOS 및 Android 모바일 애플리케이션을 만드는 데 사용되는 JavaScript 기반의 프레임워크입니다. 이번에는 Windows 운영체제에서 React Native 개발 환경을 설정하는 방법에 대해 알아보겠습니다. 1. Chocolatey 설치 Chocolatey는 Windows에서 패키지 관리를 위한 도구입니다. React Native 개발을 위해서는 Chocolatey가 필요합니다. Chocolatey를 설치하려면 PowerShell을 열고 다음 명령을 실행하십시오. Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net... 2023. 2. 27.
Windows 에서 Expo 개발환경 세팅하기 Expo는 React Native 애플리케이션 개발을 더욱 쉽게 만들어주는 도구입니다. 이번에는 Windows 운영체제에서 Expo 개발 환경을 설정하는 방법에 대해 알아보겠습니다. 1. Node.js 설치 Expo를 개발하기 위해서는 먼저 Node.js가 필요합니다. Node.js를 다운로드하려면 공식 웹사이트에서 다운로드 페이지로 이동하십시오. Windows 운영체제에 맞는 버전을 다운로드하고 설치하십시오. Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2. Expo CLI 설치 Expo CLI를 설치하려면 Windows PowerShell을 실행하고 다음 명령을 입력하십시오. npm.. 2023. 2. 27.
MAC OS에서 Expo 개발환경 세팅하기 Expo는 리액트 네이티브 애플리케이션을 더 쉽게 만들 수 있도록 도와주는 프레임워크입니다. 이번에는 Mac에서 Expo 개발 환경을 설정하는 방법에 대해 알아보겠습니다. 1. Node.js 설치 Expo 개발을 위해서는 Node.js가 필요합니다. Node.js를 다운로드하려면 공식 웹사이트에서 다운로드 페이지로 이동하십시오. Mac OS 버전에 맞는 버전을 다운로드하고 설치하십시오. Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2. Expo CLI 설치 Expo CLI를 설치하려면 터미널에서 다음 명령을 실행하십시오. npm install -g expo-cli 이 명령을 실행하면 E.. 2023. 2. 27.
React Native 패키지 업데이트 후 제대로 동작하지 않을 때 React Native 혹은 Expo 패키지 업데이트 후 동작이 원활하게 동작하지 않을 때 적절히 사용하면 좋은 명령어들 입니다. 업데이트에 의해서 많은 파일이 급격하게 변하거나 하는 경우 watchman의 데이터나 npm cache데이터가 꼬이면서 빌드 혹은 실행이 제대로 되지 않는 경우에 사용하면 좋습니다. watchman 정리 watchman은 변경됨을 감시하고 기록하기 위해 만들어진 서비스입니다. react-native와 마찬가지로 facebook에서 만들어졌습니다. 아래의 명령어로 watchman에서 관리 감시하고 있는 기록을 모두 삭제할 수 있습니다. watchman watch-del-all npm cache 데이터 정리 npm에서 관리하고 있는 cache 데이터를 삭제하는 방법입니다. 패키지.. 2022. 9. 15.
Visual Studio Code import 문 정리 단축키 Visual Studio Code에서 javascript import 문에서 안 쓰는 정의 들을 깔끔하게 정리하는 단축키입니다. Windows: Alt + Shift + O Mac: Option + Shift + O 단축키를 사용하면 사용하지 않는 정의는 모두 지워지고, 가나다순으로 정렬됩니다. 단축키를 사용하기 전과 후의 결과 예시는 아래와 같습니다. 사용하기 전 import React, { useState, useEffect } from 'react' import { SafeAreaView, StyleSheet, View, Dimensions, Alert, Platform, Image } from 'react-native' import { Text, Icon, Button, colors } from .. 2022. 9. 14.
반응형

티스토리툴바