[리액트네이티브] react-native QR코드, 바코드 인식

아래 expo 문서를 확인하면 barcode scanner가 있었다! 교수님께서 알려주셔서 진짜 몇줄로 코드가 실행되서 억울할 정도ㅜㅜ https://docs.expo.dev/versions/latest/sdk/bar-code-scanner/ BarCodeScanner Allows scanning variety of supported barcodes both as standalone module and as extension for expo-camera. docs.expo.dev 아무튼!! ​ 코드는 import React, { useState, useEffect } from 'react'; import { Text, View, StyleSheet, Button } from 'react-native'; ..

• format_list_bulleted 프론트/React Native, React
• · 2023. 6. 26.
• textsms

[리액트네이티브] react-native stack navigation 넘어가면 초기화하기

이번 졸업 프로젝트로 하는 내용에서 ​ QR코드를 스캔하고 해당 기능페이지로 넘어간다 ​ 하지만 다시 뒤로 가기를 하면 그 전에 스캔 했던 ​ QR코드와 station의 정보가 나와서 이런 점을 보완하고자 ​ react native navigation을 공부하기로 했다.. ​ ​ 그래서 찾은 내용은 ​ Reset!!! ​ 이라는 내용이다..! ​ https://zeunny.tistory.com/18 [React Native] React Navigation 스택 초기화하기 [React Native] React Navigation 스택 초기화하기 React Native 프로젝트에서 React Navigation 중 Stack Navigation 을 사용하면 스택이 계속 쌓인다. 이 때 스택을 초기화 해야하는..

• format_list_bulleted 프론트/React Native, React
• · 2023. 6. 26.
• textsms

[리액트 네이티브] react-native react와의 태그 비교

react와 react-native의 차이점 리액트는 페이스북에서 만든 프론트엔드 javascript 라이브러리 ​ 리액트 네이티브는 react의 방식으로 네이티브 앱을 개발할 수 있는 페이스북의 오픈소스 프레임 워크 ​ ​ 리액트 네이티브는 html문법을 사용하지 않는다 ​ 그래서 이번 포스팅에서는 이것을 다룰것이다 ​ html은 많이 있는데 기본의 css도 지원하지 않는다 ​ 일단 대표적인 태그들을 비교해보겠다 html React Native div img span, p ul/ol, li 태그가 다르다 이부분도 꼭 기억해줘야한다! 헷갈리면 안돼,,,! ​ ​ 상태바를 조작할 수 있다! style을 조작하여 상태바를 조절할 수 있다 https://docs.expo.dev/versions/latest/s..

• format_list_bulleted 프론트/React Native, React
• · 2023. 6. 26.
• textsms

[리액트 네이티브]react-native 함수 컴포넌트 불러오기

리액트 네이티브는 리액트에서 파생? 아무튼 비슷한데 모두 같은건 아니다!! ​ ​ 리액트 네이티브를 통해 프론트 개발을 할 때는 2가지 방법으로 컴포넌트를 선언할 수 있다 클래스형 컴포넌트를 사용하거나 함수형 컴포넌트를 사용할 수 있다 ​ 클래스형 컴포넌트! import React, { Component } from 'react'; class Hello extends Component { render() { const { color, name, isSpecial } = this.props; return ( {isSpecial && *} 안녕하세요 {name} ); } } Hello.defaultProps = { name: '이름없음' }; export default Hello; 함수형 컴포넌트!! imp..

• format_list_bulleted 프론트/React Native, React
• · 2023. 6. 26.
• textsms

[리액트 네이티브]react-native 현재위치 가져오기

일단 처음이기 때문에 니콜라스 쌤 수업을 들으면서 진행하려고 한다! #2.8 Weather (15:32) – 노마드 코더 Nomad Coders All Courses – 노마드 코더 Nomad Coders 초급부터 고급까지! 니꼬쌤과 함께 풀스택으로 성장하세요! nomadcoders.co 이 영상을 보면서 따라했다! !! 중요 !! expo install expo-location import * as Location from "expo-location"; import { StatusBar } from "expo-status-bar"; import React, { useEffect, useState } from "react"; import { View, Text, Dimensions, ActivityInd..

• format_list_bulleted 프론트/React Native, React
• · 2023. 6. 26.
• textsms

[리액트네이티브] react-native QR code

우산 스테이션을 인식하기 위해서 각 스테이션 마다 QR 코드를 가지고 있움 ​ 사용자는 스테이션의 QR코드를 스캔하여 해당 스테이션을 사용할 수 있는데 ​ ​ 그렇게 되면 일반 카메라가 아닌 QRscan이 가능한 코드를 작성해야 한다 ​ ​ 그래서 막 시도를 해볼건데 처음부터 되는 내용은 없었던 거 같다.. ​ 막 시도해볼테니 제 코드를 사용하기 전 결과 먼저 확인해보시는게 좋을거 같숩니다! ​ ​ ​ ​ 일단 첫번 째 시도!! ​참고 사이트: https://flamingotiger.github.io/frontend/ReactNative/react-native-qrcode-scanner/ React native QRcode scanner 사용하기 시작하기react-native 앱에서 QR코드를 스캔할 수..

• format_list_bulleted 프론트/React Native, React
• · 2023. 6. 19.
• textsms