Dev/React Native9

• 

  ReactNative: 이벤트 핸들러와 콜백 함수 이벤트 핸들러와 콜백 함수 프로젝트를 진행하면서, 초기 레이아웃을 구성할 때 바텀탭을 직접 디자인하여, 화면 하단에 띄워주는 방식으로 개발을 진행하고 있었는데 아무래도 기존 사용하는 바텀탭 라이브러리가 아니다 보니 컴보넌트와 스크린간 데이터를 주고받는것이 쉽지 않음을 느꼈다 우리는 이제 버튼을 누르면, 각 탭이 전환되도록 구현하고자 하였고 많은 경험 후 해당 기능을 구현할 수 있었다 이벤트 핸들러 이벤트 핸들러(EventHandler)는 특정 이벤트가 발생했을 때 실행되는 함수입니다. 예를 들어, 버튼을 클릭하거나 입력 필드에서 텍스트를 입력할 때와 같은 사용자의 상호작용에 대응하여 원하는 동작을 수행할 수 있습니다. 이벤트 핸들러는 일반적으로 이벤트가 발생한 요소에 연결되어 실행됩니다. 콜백 함수 콜백.. Dev/React Native 2023. 5. 20.

• 

  ReactNative: Expo에서 GPT에 요청-응답 받아오기 Expo에서 GPT에 요청-응답 받아오기 캡스톤디자인 프로젝트를 진행하던 중, GPT API를 사용하기 위하여 GPT에 요청을 보내고 해당 요청을 받아오는 코드를 작성하려고 하는데, 자료들이 많이 없어 애를 많이 먹었다 각종 자료를 종합하고, 확인하여 응답을 보내고, 요청을 받아 화면에 출력하는 간단한 API 활용법에 대하여 포스팅하려고 한다 프로젝트는 진행 중이며, 아직 초기 단계지만 프로젝트 내용과 사용하는 기술 스택 및 여러 정보들은 다음 깃허브 주소를 참고하면 될 것 같다 GitHub - dduneon/Nine-2023CapstoneDesign: 2023 Chosun Univ. Capstone Design(01) 2023 Chosun Univ. Capstone Design(01). Contribu.. Dev/React Native 2023. 5. 17.

• 

  ReactNative: ESlint, Prettier 설치 및 세팅방법 VSCode: ESlint, Prettier VSCode에서 ESlint와 Prettier는 자바스크립트 코드를 더 깔끔하고 일관성 있게 작성할 수 있도록 도와주는 플러그인입니다. 각각의 역할과 특징은 다음과 같습니다. ESlint ESlint는 자바스크립트 코드에서 문제점을 검사하고, 코드 스타일을 일관성 있게 유지하기 위한 도구입니다. ESlint는 일반적으로 코드 스타일, 코드 품질, 보안, 호환성 등의 측면에서 코드를 검사합니다. 예를 들어, ESlint는 변수의 선언 방법, 함수 호출 방법, 들여쓰기, 쉼표, 따옴표 등을 검사합니다. ESlint는 VSCode에서 기본으로 제공되지 않기 때문에, VSCode에서 ESlint를 사용하려면 먼저 ESlint를 설치하고 VSCode의 ESlint 플러.. Dev/React Native 2023. 5. 5.

• ReactNative: 5/3 공부일지 작성 - map() 공부 중 map()에 대한 내용 작성 const fcstValues = forecasts.map((item) => item.fcstValue); JSON으로 받은 응답을 처리하는 과정에서 map()을 사용해 보았다 그냥 처리하려고 했지만 Object들로 감싸져 있는 바람에 하나하나 처리하기 힘들고 오류가 발생하여 map에 대하여 알아보고 이를 대체하는 과정으로 이를 해결했던 것 같다 map() JavaScript의 map() 함수는 배열 요소를 순회하며 각 요소를 인자로 전달받은 함수를 실행하여 새로운 배열을 생성합니다. 이 때, 새로운 배열은 이전 배열과 같은 길이를 가지며 각 요소는 전달받은 함수를 실행한 결과로 채워집니다. map() 함수의 구문은 다음과 같습니다. arr.map(callback(c.. Dev/React Native 2023. 5. 3.

• ReactNative: 5/3 공부일지 작성 - useEffect() 배경 프로젝트 진행 중, useEffect()를 남용했다가 콘솔에서 너무 많은 요청을 한다는 이유로 오류메시지가 표시되었다 이에 useEffect()에 대하여 조금 알아보았고, 알아본 내용을 바탕으로 정리하여 작성한다 ! useEffect() 는 React의 훅(Hook) 중 하나로, 컴포넌트의 렌더링이 완료된 후에 특정 작업을 수행하거나, 컴포넌트가 사라지기 전에 필요한 정리 작업을 수행할 수 있도록 해줍니다. useEffect() 는 두 개의 인자를 받습니다. 첫 번째 인자는 함수이며, 렌더링이 완료된 후에 실행될 작업을 정의합니다. 두 번째 인자는 배열이며, 해당 배열에 포함된 값들이 변경되었을 때만 첫 번째 인자로 전달된 함수를 실행하도록 하는 역할을 합니다. 예를 들어, 다음 코드는 useEff.. Dev/React Native 2023. 5. 3.