jins

📌 번역 기능 추가하기 (Google Translate API 사용) 번역을 추가하려면, Google Translate API를 사용해서 변환된 텍스트를 원하는 언어로 번역하면 돼. 🛠 Google Translate API 키 받기 (필요) 1. Google Cloud Console에서 Google Cloud Translation API를 활성화 2. API 키를 발급받아 프로젝트에서 사용 🚀 React Native에서 번역 추가한 코드 (STT + 번역 + TTS)import React, { useState } from "react";import { Button, Text, View } from "react-native";import Voice from "@react-native-voice/voi..

자주 쓴다면 전역(global)으로 설치하는 것도 고려할 만하지만, 무조건 전역 설치가 좋은 건 아니야. 각각의 장단점을 비교해 보고 결정하는 게 좋아.✅ 전역 설치 (npm install -g expo) vs 로컬 실행 (npx expo)방식장점단점전역 설치 (npm install -g expo)- 매번 npx 없이 바로 expo 실행 가능 → 실행 속도 빠름- 인터넷 연결 없이도 실행 가능- 업데이트가 필요할 때 직접 npm update -g expo 해야 함- 프로젝트마다 다른 버전 관리 어려움로컬 실행 (npx expo)- 프로젝트마다 최신 버전 자동 사용 가능- 전역 설치 없이도 동작 → 환경 깔끔- 매번 npx를 써야 함 (npx expo start)- 첫 실행 시 다운로드 시간이 걸릴 수 있..

인터넷 없이 npm start를 실행했는데도 Expo 프로젝트가 실행됐다면, 로컬에 Expo CLI가 설치되어 있을 가능성이 높아. 하지만 expo 명령어가 작동하지 않는 이유는 몇 가지가 있을 수 있어.🔎 확인해야 할 것들 1️⃣ 프로젝트 내에 expo가 설치된 경우 (node_modules 안에 있음) 👉 expo-cli가 전역(global)으로 설치된 게 아니라 프로젝트 내부에만 설치된 경우야.👉 이 경우, npm start는 node_modules/.bin/expo를 실행하므로 정상 작동하지만, 터미널에서 expo 명령어를 직접 입력하면 안 먹힐 수 있어. 🔹 확인 방법npx expo --version이 명령어가 작동하면, 프로젝트 내부에 expo-cli가 설치된 것이야.2️⃣ PATH 문..

sudo npm install -g react-devtools react-devtools

sudo npm install -g react-devtools react-devtools

React Native의 Pressable 컴포넌트와 pressed 상태에 대한 보고서1. 개요React Native의 Pressable 컴포넌트는 사용자의 터치 상호작용을 감지하고, 다양한 상태를 기반으로 스타일을 동적으로 변경할 수 있는 컴포넌트이다. pressed 상태는 사용자가 버튼을 누르고 있을 때(onPressIn)와 떼는 순간(onPressOut)을 감지하여 UI에 반영하는 데 사용된다.2. Pressable의 기본 문법 (pressed ? styles.pressedItem : styles.defaultItem)}> Press Mestyle 속성은 함수 형태를 사용할 수 있으며, 이 함수의 매개변수로 pressed 상태를 받을 수 있다.pressed는 불리언(boolean) 값이며, 사용자..

1. 개요JavaScript의 bind() 메서드는 함수의 this 값을 명시적으로 설정하고, 선택적으로 인자를 고정할 수 있도록 도와주는 메서드이다. bind()를 사용하면 원본 함수를 변경하지 않고, this가 특정 객체를 가리키는 새로운 함수를 생성할 수 있다.2. 문법function.bind(thisArg, arg1, arg2, ...)thisArg: 바인딩할 this 값.arg1, arg2, ...: 바인딩할 함수의 기본 인자들.3. 동작 방식bind()는 새로운 함수를 반환하며, 원본 함수의 this를 thisArg로 고정한다.인자를 함께 전달하면, 고정된 인자를 가지는 새로운 함수를 생성할 수 있다.원본 함수는 변경되지 않는다.4. 예제기본적인 this 바인딩const person = { ..

JavaScript의 filter() 메서드에 대한 보고서1. 개요JavaScript의 filter() 메서드는 배열에서 주어진 조건을 만족하는 요소들만을 새로운 배열로 반환하는 메서드이다. 이 메서드는 원본 배열을 변경하지 않으며, 콜백 함수에서 true를 반환하는 요소들만 필터링하여 새로운 배열을 생성한다.2. 문법array.filter(callback(element, index, array), thisArg);callback: 각 요소에 대해 실행할 함수.element: 처리 중인 현재 요소.index (선택적): 처리 중인 현재 요소의 인덱스.array (선택적): filter()를 호출한 원본 배열.thisArg (선택적): callback 함수 내부에서 this로 사용될 값.3. 동작 방식배열..

좋아! React Native를 학습하기 전에 알아야 할 언어 및 문법을 보고서 형식으로 정리해 줄게.React Native 학습을 위한 필수 언어 및 문법 정리 1. 개요 React Native는 JavaScript 기반의 프레임워크로, 단일 코드베이스로 iOS 및 Android 애플리케이션을 개발할 수 있도록 지원한다.React Native를 효과적으로 학습하고 활용하기 위해서는 JavaScript(ES6 이상), React의 핵심 개념, 그리고 React Native의 기본 문법을 이해하는 것이 중요하다. 본 문서에서는 React Native를 학습하기 전에 반드시 익혀야 할 JavaScript 문법, React 개념, 그리고 React Native의 주요 기능을 정리한다.2. JavaScript ..

Node.js, npm 및 npx의 필요성과 관계 1. Node.js 개요 Node.js는 JavaScript를 서버에서 실행할 수 있게 해주는 런타임 환경입니다. 일반적으로 JavaScript는 웹 브라우저에서만 실행되지만, Node.js를 사용하면 서버 사이드 프로그래밍을 JavaScript로 할 수 있습니다. 이는 웹 애플리케이션 및 서버 기반 서비스 개발에 매우 유용하며, 특히 비동기적이고 효율적인 데이터 처리에 강점을 가지고 있습니다. 2. npm: Node.js의 패키지 관리자 npm(Node Package Manager)은 Node.js 환경에서 필요한 외부 패키지(라이브러리 및 도구)를 관리하는 도구입니다. npm을 사용하면, 개발자는 복잡한 기능을 손쉽게 구현할 수 있도록 다양한 라이브러..