반응형 IT/javascript57 ReactNative - expo 프로젝트 만들기 1. 환경 구성https://reactnative.dev/docs/set-up-your-environment Set Up Your Environment · React NativeIn this guide, you'll learn how to set up your environment, so that you can run your project with Android Studio and Xcode. This will allow you to develop with Android emulators and iOS simulators, build your app locally, and more.reactnative.dev node는 이미 설치 되어 있어서 (20.18.1) watchman만 설치brew instal.. 2025. 3. 7. React Native 를 macOS 에서 할때 항상 나던 오류 해결 Error: EMFILE: too many open files, watch react native 를 셋팅하고 처음 andorid 에뮬레이터를 실행하면 항상 나는 오류인데, 이것저것 하다보면 어떻게? 해결이 되곤 했다.이참에 해결을 좀 제대로 해야지! 싶어서 perplexity 에게 물어보니 한방에 해결 -_-;;오류에 나온것처럼 파일디스크립터를 진짜로 늘리면 된다. 다음 명령어로 갯수를 확인하고, ( 오류 날때 2096? 개 나왔다. )ulimit -n 아래로 바꿔준다.sudo ulimit -n 10240 해결! 이렇게 쉬워서 아무도 답을 안써주고 있었나.. 2025. 1. 13. react-native iOS 모듈 만들기 1. 리액트-네이티브 프로젝트 생성brew install nodebrew install watchmannpx react-native@latest init AwesomeProject 2. 프로젝트 실행후, iOS 시뮬레이터에서 실행 확인npm start# 실행시 meteo 가 실행 되고, i 를 누르면 iOS에뮬레이터가 실행되며 cocoapod 설치 여부 물어봄 설치! 3. 네이티브 모듈 생성 ( 파일2개 )RCTCalendarModule.h//// Header.h// AwesomeProject//// Created by 한태종 on 11/22/24.//#ifndef RCTCalendarModule_h#define RCTCalendarModule_h#import @interface RCTCalenda.. 2024. 11. 22. react-native iOS 프로젝트 오류시 클린 정리 후 재실행 하기 1. cocoapod 재설치 업데이트# 프로젝트 루트에서cd iospod deintegratepod cleanpod installcd .. 2. xcode 캐시 정리rm -rf ~/Library/Developer/Xcode/DerivedData 3. 프로젝트 리빌드# 역시 프로젝트 루트에서npx react-native cleannpx react-native run-ios 성공! 2024. 11. 22. react-native setting without Framework 회사에서 열심히 밀고 있는 Mendix의 Native Mobile 빌드를 위해 react-native를 알아봐야 될것 같아서설치를 진행해보도록 했다. https://reactnative.dev/docs/set-up-your-environment Set Up Your Environment · React NativeIn this guide, you'll learn how to set up your environment, so that you can run your project with Android Studio and Xcode. This will allow you to develop with Android emulators and iOS simulators, build your app locally, .. 2024. 11. 7. [TS]Visual Studio Code 에서 타입스크립트 제네릭 사용시, auto close tag 로 불편할 경우! Typescript 의 Generic 기능을 사용할때, 태그와 동일한 모양새 때문에, 자동 닫기 태그가 활성화 되어 매번 불편하다. ! 설정을 통해서 TypeScript 에서는 자동닫기를 비활성화 하면 도움이 된다. Ctrl+Shit+P > Prefrences: Open User Settings(JSON) "auto-close-tag.activationOnLanguage": [ "html", "xml", "javascript", "javascriptreact", "typescriptreact", 2024. 9. 10. [TS]graphQL 샘플 프로젝트 생성 ( feat. GraphQL과 타입스크립트로 개발하는 웹 서비스 ) node -v : 20.16.0 # 프로젝트 구성 ( 프로젝트 루트 /graphql-book-fullstack-project )npm i -g yarn git init .gitignore 파일 생성 ( 아래 사이트에서 react, node 를 넣고 파일로 생성 )gitignore.io - 자신의 프로젝트에 꼭 맞는 .gitignore 파일을 만드세요 (toptal.com)# 프론트 생성 make projectcd projectyarn create react-app --template @chakra-ui/typescript web cd web yarn startyarn add @apollo/client graphql# 백엔드 생성 ## /project 에서 mkdir server cd server yarn.. 2024. 9. 9. [Next.js]차트와 대시보드 예제-홈화면 출처 : 레벨업 리액트 프로그래밍 1. 프로젝트 생성create-next-app@latest levelup-dashboard - 정상 확인cd levelup-dashboardnpm run dev 2. 추가 라이브러리 설치npm i @heroicons/react @tailwindcss/forms @tremor/react @vercel/postgres autoprefixer bcrypt clsx next-auth@beta use-debounce uuid zod -개발용 추가 설치npm i -D @types/bcrypt @types/uuid @vercel/style-guide dotenv eslint-config-prettier prettier prettier-plugin-tailwindcss 3. 파일 수.. 2024. 6. 30. clsx 모듈 - css 조건 적용하기 설치npm i clsx 활용 button.tsxclassName == css class 쪽에 clsx 와 : 을 이용해서 조건을 이용해서 css 가 적용되게 한다.import clsx from "clsx";export default function Button ({ kind = 'default', ...props} : React.ButtonHTMLAttributes & { kind? : 'default' | 'important' | 'reference';}) { return ( )} various-buttons.tsx'use client'import Button from "./button"import React, {useState} from "react"expo.. 2024. 6. 27. 이전 1 2 3 4 ··· 7 다음 반응형
