본문 바로가기
반응형

React13

[React Native] WebView 적용하는 방법(localhost 안될때,nsurlerrordomain) WebView를 어떻게 App에서 적용할 수 있는 건지 항상 궁금했었는데, 이번 프로젝트를 통해서 알게됐다. WebView란 웹 프로젝트 그 자체를 그냥 앱에서 띄우는 것이다. Naver도 WebView로 만들어진 앱으로 유명한데, 웹뷰는 즉, naver.com을 치면 나오는 화면을 그대로 앱에서 보여주는 것이다. React Native에서 적용하는 방법은 엄청 간단하다! import React from 'react'; import {WebView} from 'react-native-webview'; export default function Home() { return ( ); } 이렇게 해주면? 나도 네이버앱 완성이다!ㅋㅋㅋㅋ 다만 WebView를 보여줄 때, 고려해야할 점은 바로 Stack이다. A.. 2023. 5. 19.
XCode 빠르게 다운로드, 업데이트하는 방법 Xcode를 App Store에서 다운받으면 가끔 로딩바가 나온채로 얼어버리는 경우 또는 엄~청 오래 걸리는 경우가 있다. 그래서 내가 빠르게 업데이트를 하는 방법은 공식 홈페이지를 이용하는 것이다! https://developer.apple.com/download/all/ 로그인 - Apple idmsa.apple.com 1. 애플 개발자웹에서 로그인 후, 다운로드로 들어간다. (상단링크) 2. Xcode로 검색하면 하단에 Xcode 최신버전이 뜬다. 3. xip파일을 클릭 후, 다운받아 실행하여 압축을 푼다. 4. Xcode file을 옮기면 교체(대치)할 것인지 묻는 창이 뜹니다. Replace 클릭! 그럼 끝~~~!! 2023. 4. 4.
[React] 상태관리 라이브러리란? 및 필요성 (Recoil vs Redux 비교) 먼저, 상태관리 라이브러리란 무엇일까요? 리액트에서의 상태는 즉 state인데, 말 그대로 이를 관리해주는 라이브러리가 바로 상태 관리 라이브러리입니다. 흠... 그런데 이미 개발을 잘하고 있는데 왜 굳이 state를 "관리"까지 해주어야 하는 걸까요? 그 이유에 대해서 알아보죠! 리액트는 컴포넌트 단위의 로고를 조립하는 것과 같이 개발을 진행을 하게 됩니다. 예를 들어, 게시판을 만든다고 했을 때, 아래와 같이 게시판의 글 한 줄, 한 줄에 해당하는 컴포넌트를 따로 만들고, 그 컴포넌트를 모아 게시판 하나를 완성하게 되죠. const board = () => { const [posts, setPosts] = useState([]); return ( 제목 작성자 {posts.map((post) => )}.. 2022. 8. 18.
[postCSS] CSS전처리기란? postCSS 정리 및 리액트 적용 방법! Post CSS란? Less, SASS와 같은 CSS 전처리기 중 하나입니다. 그렇다면 여기서 CSS 전처리기란 무엇일까요? 바로 CSS의 특성상 반복되고 중복되는 코드들을 최소화하고자 나온 툴입니다. 바로 아래의 예시를 보시죠! [1] postCSS 적용 전 .login__list { padding: 1em; background-color: #263343; } .login__input { width: 25%; height: 2.5em; font-size: 1.2rem; border-radius: 1.2rem; text-align: center; border: 1px solid #263343; outline: 0; } 위처럼 #263343이라는 같은 색상이나 같은 사이즈를 쓰는 항목에도 일일이 코드 색상.. 2022. 7. 19.
반응형