본문 바로가기
반응형

DEV/리액트3

리액트 훅이란? 참고: Do It! 리액트 네이티브 액 프로그래밍 리액트 훅 리액트 프레임워크는 컴포넌트라는 기법으로 가상 DOM 객체를 만들고나서 가상 DOM 객체에 어떤 변화가 감지되면 해당 변화만 화면에 재렌더링하여 전체 렌더링 속도를 빠르게 하는데 초점이 맞춰진 프레임워크이다. 리액트 프레임워크는 오랫동안 객체 지향 언어의 상속 개념에 맞춘 클래스 형태로 제작되었다. 그런데, 클래스 컴포넌트 기술을 코드를 작성하는 방법도 복잡하고, 1초당 60회 정도의 매우 빠른 재렌더링을 실행해야 할 때 화면에 정상적인 렌더링이 안 되는 버그를 내포하고 있다. 리액트 개발팀은 클래스 컴포넌트를 구현할 때의 복잡함을 덜고자 컴포넌트를 함수 형태로 만들 수 있게 하였고, 2019년 2월 16.8.0 버전을 내놓으면서 함수 컴포넌트.. 2023. 1. 29.
[리액트네이티브 + expo]터치 할 때마다 이미지 바뀌게 하기 리액트 네이티브 + 엑스포 조합으로 앱을 하나 제작하려고 준비중이다. 생각보다 쉬운 앱인데 간단한 인강 하나 보고 무작정 만드려니 생각보다 쉽지 않다. 우선 기본은 play 버튼이 노출되고 play 버튼을 터치하면 pause 버튼으로 바뀌게 하려고 하는데 html + javascript 조합이었으면 10초면 끝날건데 리액트 네이티브로 하려고 하니 한시간 넘게 걸렸다. 😂 import React, {useState} from 'react'; import { StyleSheet, Text, View, TouchableOpacity , Image} from 'react-native' import startImg from '../assets/images/start.png' import pauseImg from .. 2023. 1. 28.
1. 리액트 네이티브 & Expo 설치 및 실행 ** MAC 기준 포스팅 리액트 네이티브(React Native)는 페이스북이 개발한 오픈 소스 모바일 애플리케이션 프레임워크이다. 리액트 네이트브를 사용하면 안드로이드 앱 및 IOS 앱을 따로 만들지 않고 하나만 만들어서 배포할 수 있는 앱을 만들 수 있다. 물론 상황에 따라서는 android, ios 각각의 폴더에 들어가서 직접 코드를 수정해야 될 수도 있다. Expo는 초기 설정이 간단하며, 각 플랫폼 IDE를 설치하지 않고도 시뮬레이터를 사용할 수 있는 프레임워크이자 플랫폼이다. 리액트 네이티브와 Expo를 사용하기 위해서 Node.js, Visual Studio Code, Android Studio, XCode(Mac 사용시) 가 필요하다. 우선 아래 URL을 통해 전부 다운로드 받은 후 설치해.. 2022. 12. 28.
반응형