리액트(React)45 React Native(리액트네이티브) - 앱개발 Expo 로 시작하기 !! React Native는 Meta 에서 개발하고 관리하고 있습니다.하지만 실제 앱을 개발하는데 있어서 기본적인 기능만 제공하고 있고 커뮤니티를 통해 다양한 기능을 붙여서 사용할 수 있습니다. Expo 는 React Native를 이용한 앱을 개발하기 위한 툴과 편리한 기능을 통합하여 제공하고 있어 앱 개발을 처음하는 초보 개발자의 경우 개발편이성 측면에서 많은 도움이 되어 저와 같이 초보 개발자들이 Expo 를 이용한 앱 개발을 하는데 도움을 드리고자 앞으로 포스트 주제로 주요 기능을 다뤄보고자 합니다. 제가 작성한 내용이 최선은 아니지만 초보자로 Expo Document 를 보고 따라하기 어려운 분들에게 다소 도움을 드리고자 합니다. 일단 아래의 Expo Document 사이트를 한 번 둘러 보시고 E.. 2024. 8. 9. React배열데이터 가공 reduce, concat, slice, splice (2) 이전 포스트에 이어서 리액트 배열 데이터 가공시 활용도가 높은 함수인 reduce(), concat(), slice(), splice()에 대해 설명하고자 합니다. 1. reduce() reduce 함수는 JavaScript에서 배열을 순회하고 하나의 결과를 누적하는 데 사용되는 고차 함수입니다. reduce 함수는 인자로 콜백 함수를 받으며, 이 함수는 배열의 각 요소에 적용되며 중간 결과를 추적하는 누적기(accumulator)가 있습니다. reduce 함수의 기본 구문은 다음과 같습니다. array.reduce(callback, initialValue); callback: 배열의 각 요소에 대해 한 번씩 호출되는 함수로, 네 가지 인수를 받습니다. accumulator: 콜백의 반환 값들을 누적하는.. 2024. 1. 27. React 배열 데이터 가공 - map,find,findindex,filter (1) 리액트에서 데이터를 가공할 때, 특히 배열에서 많이 사용하는 자바스크립트 함수에 대해 알아두면 도움이 되어 1, 2편 나눠서 정리해 봅니다. 실제 예시를 기반으로 어떻에 활용하는지 실제 개발하는데 도움이 되었으면 합니다. 이번 포스팅에서는 map, find, findindex, filter 에 대해 알아 보겠습니다. 1. map() JSX 문법을 사용하는 리액트에서는 배열로 된 데이터를 가공하는데 for문 대신 map() 을 사용합니다. 실사용에서 제일 많이 사용하는 함수로 사용하는데 주의점이 있습니다. JSX에서 자바스크리립트 구문은 { } 사이에 사용합니다. {items.map((item) => item)} 상기 예시는 items 배열에 있는 항목 하나씩(item) 꺼내서 리스트로 표출하는 예시로 기.. 2024. 1. 21. 리액트 - Netlify 배포하는 방법 및 주의사항 리액트 개발 공부를 하면서 실제 외부에서 접근 가능하도록 무료 호스팅(hosting) 방법중에서 정적 컨텐츠를 호스팅해주는 Netlify 를 사용하는 방법과 주의사항에 대해 알아 보겠습니다. 1. Netlify 와 github pages 차이점 github pages NetlifyNetlify가 전반적으로 사이트 배포 관리 기능이 gitub pages에 비해 훨씬 다양하고, 도메인 비교github pages - https://계정명.github.io/리포지토리명 으로 구성 .. 2023. 9. 7. [React] gh-pages 배포시 주의사항 및 오류 해결 이전의 gh-pages 로 정적 홈페이지 배포방법에 대해 설명하였고,2023.08.15 - [리액트(React)] - 웹사이트 Build 및 깃허브(Github) Pages로 배포하기추가로 깃허브(Github)의 무료 호스팅인 page 로 create-react-app 으로 만든 리액트 프로젝트을 배포하는데 몇가지 주의사항이 있어서 별도로 설명하고자 합니다..기본적으로 gh-pages의 경우 리액트와 같은 SPA(Single Page Application)를 지원하지 않습니다. 따라서 다양한 페이지로 접근시 404 에러(페이지를 찾을 수 없음)가 나타납니다.이에 따라 단순하게 페이지 하나만 보여주는 것은 별 문제가 되지 않으나 기본적으로 gh-pages 에서는 https://[사용자명].github.io.. 2023. 8. 15. 웹사이트 Build 및 깃허브(Github) Pages로 배포하기 리랙트 프로젝트로 만든 사이트를 깃허브에서 제공하는 무료로 HTML 파일을 호스팅 해주는 사이트인 Pages로 실제 배포해 보고자 합니다. 물론 무료인 만큼 제약사항으로 Static HTML, CSS, Javascript 정도 지원이 되니 적용 가능한지 사전에 인지가 필요합니다. 실제 만들어진 프로젝트 파일을 그대로 Github에 복사해서 올린다고 동작하지 않습니다. 배포하기 위한 작업 단계에 대해 설명드리고자 합니다. 1. 사전작업 지금까지 코딩한 파일은 localhost:3000 을 통해서 동작확인을 합니다. 실행시 warning message 정도는 배포시 문제되지 않습니다. github.com 에 신규 계정 가입을 하고 프로젝트명에 해당하는 repository를 만듭니다. 참고로 계정이름과 rep.. 2023. 8. 15. 이전 1 2 3 4 5 6 7 8 다음 반응형