Tag: react

Nextjs typescript 절대경로 설정하기

시작하기상대경로를 사용할 시 패키지 구조가 깊어질 경우 import시에 많이 번거로워지게 됩니다.작은 규모의 어플리케이션이라면 상관없지만 규모가 커질수록 꼬이기 쉬워집니다. 상대경로 1import Acomponent from ‘../../../../component/Acomponent’; 절대경로 1import Acomponent from ‘src/com

리액트 프로젝트에 폰트추가

시작하기리액트 프로젝트에서 폰트를 추가 하는 방법을 알아보겠습니다.구글 폰트에서 링크를 통해 적용하는 방법과 폰트를 다운로드해서 프로젝트에 적용하는 방법이 있습니다. 구글 웹폰트를 통해서 적용하기 프로젝트에 직접 적용하기 구글 웹폰트를 통해서 적용하기구글 폰트 사이트에 접속해서 마음에 드는 폰트를 찾습니다. 폰트를 찾았다면 해당 폰트를 선택하고 하단에

react native android 시작시 adb 에러

시작하기react native에서 시뮬레이터가 켜져 있는 상태인데도 npm run android를 하면 adb command not found와 같은 에러가 날때가 있습니다. android studio를 설치하면 자동으로 adb가 설치됩니다.react native 프로젝트를 시작할때 에러가 나오는 것은 경로가 설정이 제대로 되어있지 않기 때문입니다. 해결하

Gatsby에 markdown 설정하기

시작하기gatsby는 정적 페이지로 제작시 많이 이용합니다. 예로 블로그나 소개 페이지 같은 경우에 용이합니다.데이터 베이스를 연결하지 않고 markdown파일로 글을 작성 후 데이터를 불러와 화면에 뿌릴수 있습니다.markdown파일로 작성시 재사용에 좋습니다. 그러면 gatsby에 markdown를 추가해보도록 하겠습니다. 플러그인 설치기존에 설치되어있

React native firebase 페이스북 로그인 적용하기

시작하기firebase 적용포스트를 통해 설정을 마친 상태여야 합니다.react-native v0.60 이상을 기준으로 작성하였습니다. 페이스북 개발자 계정설정페이스북 개발자 홈페이지에 로그인을 합니다. 오른쪽 상단 내 앱을 선택한 후 새 앱추가를 합니다. 내 앱 생성이 완료되면 Add a product에서 페이스북 로그인을 추가합니다. Firebase

React native firebase 구글 로그인 적용하기

시작하기firebase 적용포스트를 통해 설정을 마친 상태여야 합니다. 라이브러리 설치1@react-native-community/google-signin 설치가 완료되면 초기화시키는 작업이 필요합니다. App.jsx1234567891011import { GoogleSignin } from '@react-native-community/g

React native 에러 혹은 여러 상황시에 초기화 방법

시작하기React native를 하다보면 오픈 라이브러리를 추가하거나 코드를 수정할때 제대로 작성했지만 동작하지 않는 경우가 종종 있습니다. 빌드한 데이터가 남아 있어서 일가능성이 있습니다. 그래서 초기화를 해보도록 하겠습니다. react-native1npm start --reset-cache React native에서 사용하는 메트로 서버 캐시를 초기화

React native firebase 적용하기

시작하기firebase는 손쉬운 방법으로 데이터 관리를 할수 있는 서비스 입니다. 서버의 인프라를 고민할 필요가 없습니다. 그리고 백엔드를 작업해야할 시간이 단축되는 장점이 있습니다. ios메인 페이지에 로그인을 한 후 프로젝트 등록합니다. xcode에서 Bundle Identifier를 복사 붙여넣기 합니다. 구성파일을 이미지와 같이 넣어줍니다.구성파일

React native realm (typescript) 적용하기

시작하기react natvie 애플리케이션에서 로컬db로 저장하는 방법은 여러종류가 있습니다.sqlite, AsyncStorage, realm 등이 있습니다.이중에 realm을 사용해보도록 하겠습니다. 공식홈페이지에서는 기존 스토리지보다 더욱빠르고 향상된 기능을 제공한다고 합니다. 설치하기react-native v0.60이상에서 작성하였습니다. 1npm i

React native splash screen 적용하기

시작하기애플리케이션을 처음실행하면 홈화면이 등장하기전에 로고가 나오는 페이지를 splash screen이라 합니다.react native splash screen패키지를 이용해서 splash screen를 구현해보겠습니다. 설치하기react-native v0.60 이상에서는 자동으로 링크해주기 때문에 추가로 link를 할 필요는 없습니다. 1npm i re