⭐️sihanni

아무래도 리액트 지식이 빈약하다보니 채팅 서비스를 만들면서 웹 화면은 GPT의 도움을 많이 받았다.리팩토링을 진행하면서 지식을 내것으로 만들고자 기록하게 됐다.애매하게 알던 것도 제대로 알고 넘어가자. 어중간하게 알면서 애매하게 사는건 좋지않다. e.preventDefault();e.preventDefault()는 이벤트가 발생했을 때, 해당 이벤트가 기본적으로 수행하는 동작을 막는 메서드 예를 들어, 폼 제출 시 페이지가 리로드되는 기본 동작을 막고, 대신 JavaScript로 사용자 정의 동작을 수행하도록 할 수 있다.e.preventDefault()는 폼을 제출할 때 페이지 리로드 없이 자바스크립트로 데이터를 처리하게 된다. fetchfetch는 JavaScript에서 HTTP 요청을 보내기 위한 ..

들어가며처음에는 단순히 GPT를 활용해서 화면을 간단히 구현하고 넘겨버릴 생각이었는데, 역시 내가 원하는대로 gpt에게 입력하는 것도 쉽지 않고 직접 공부해가면서 구조나 평소에 잘 안해본 부분만 도움을 받으니 꽤나 내가 학습하는 것도, 작업이 진행 완료된 (1차적으로) 부분도 많았다.작업  8/1src/navigationsrc/navigation/AppNavigator.tsxsrc/navigation/AuthNavigator.tsxsrc/navigation/MainNavigator.tsxsrc/navigation/RootStackParamList.tsreact의 navigation에 대해선 아래에서 좀 더 자세히 다루도록 함.src/screens/Auth/LoginScreen.tsxapi에서 함수를 im..

https://reactnative.dev/docs/getting-started Introduction · React NativeThis helpful guide lays out the prerequisites for learning React Native, using these docs, and setting up your environment.reactnative.dev 들어가며nestJS, typeORM를 도입해서 토이프로젝트 서버 쪽을 1차로 개발을 끝내고, 앱 화면 구성을 위해 리액트 네이티브를 채택하게 되는데..당장 프론트쪽 지식을 깊게 알고싶지않다(?) 라는 오만방자한 생각을 하며 chatGPT를 통해 화면을 구성하려다 된통 삽질만하고 결국 공식문서로 공부해가면서 천천히 초기 세팅부터 진행하..

디렉토리 추가src/components/:여기에 재사용 가능한 컴포넌트를 추가합니다.예: Button.tsx, Header.tsxsrc/screens/:애플리케이션의 주요 화면 컴포넌트를 저장합니다.예: HomeScreen.tsx, LoginScreen.tsxsrc/services/:API 호출 및 비즈니스 로직을 포함하는 파일을 추가합니다.예: apiService.ts, authService.tssrc/utils/:유틸리티 함수와 상수를 정의하는 파일을 추가합니다.예: constants.ts, helpers.tssrc/navigation/:네비게이션 관련 파일을 저장합니다. React Navigation 설정 파일 등을 포함합니다.예: AppNavigator.tsx 패키지 설치1. npm install..

토이프로젝트 화면 구현을 위한 스터디React Native (간단 요약 설명 with GPT)크로스 플랫폼 개발:React Native는 iOS와 Android에서 모두 동작하는 애플리케이션을 단일 코드베이스로 개발할 수 있게 해줍니다. 이는 개발 시간과 비용을 절감할 수 있는 큰 장점입니다.React 기반:React Native는 React의 컴포넌트 기반 아키텍처를 사용합니다. 즉, UI를 작은 재사용 가능한 컴포넌트로 분리하여 관리합니다. React의 생태계를 활용할 수 있어 개발자에게 익숙한 환경을 제공합니다.네이티브 성능:React Native는 JavaScript와 네이티브 모듈 간의 브리지(bridge)를 사용하여 네이티브 UI 구성 요소와 기능에 접근합니다. 이를 통해 네이티브 앱과 유사한..