# Flatlist
search.js
들어가기insta에서 사진의 caption에 있는 단어들을 근거로,검색을 해서 사진을 찾아서 뿌려줄 수 있다.사진을 클릭 하면, 사진을 feed에 나오는 사진처럼 like, comment, 등등을 볼 수 있다.화면 바깥을 클릭했을때, 키보드가 사라지는 component
Flatlist, Pull to Refersh
들어가기폰 화면을 밑으로 내렸을때, refresh, reload되게 하는 기능Flatlist안에 포함되어 있는 기능임.
Flatlist, useQuery
들어가기seeFeed Query를 useQuery를 이용해서 data를 불러온 다음에Flatlist로 뿌려줌, web에서는 map으로 뿌렸는데app에서는 Flatlist로 뿌려줌.Scrollview를 이용해도 되지만, 이어서 infiniteScroll까지 사용하기 위해
ScrollView Vs FlatList
https://reactnative.dev/docs/scrollview https://reactnative.dev/docs/flatlist 공식문서~ scrollview는 한번에 모든 data rendering so this has a performance dow
Infinite Scroll
Screen에서 Loading을 한꺼번에 하지않고 화면이 밑으로 도달할때 쯤, 다시 Loading을 함.블랙핑크 제니의 인스타그램 follow를 본다고 생각해 보면됨.very difficult ㅜㅜ 초집중이 팔요함.https://react-query.tanst
[RN-CheatSheet] FlatList EmptyComponent 가운데 정렬하기
FlatList 의 ListEmptyComponent 프롭을 통해서 data 가 비어있을때, 렌더링될 컴포넌트를 전달할 수 있다.일반적으로 아무 스타일 없이 넘기게 될 경우 다음과 같이 나오게 된다.보통 가운데 정렬을 하기 위해서, contentContainerStyl
[React-native] 인스타그램 피드와 무한 스크롤, Refresh, 상단 스토리 구현 (FlatList 이용)
FlatList를 이용해 인스타그램 피드를 구현하는 방법을 소개하겠습니다. 추가로 무한 스크롤, Refresh 그리고 스토리를 피드 상단에 넣어주는 방법까지 정리했습니다:)
[React-Native] FlatList
FlatList는 React-Native에서 ScrollView와 비슷하게 화면에 벗어난 데이터를 보여줄 때 사용한다. React를 공부하면서 map을 사용해 리스트들을 화면에 랜더링하는 것을 컴포넌트에서 설정으로 간단하게 구현할 수 있다고 보면 되지 않을까 싶다. S
List View in React native
List Android 에서 RecyclerView iOS에서 TableView라면 리액트 네이티브는 List 가 있다! 레거시와 동작방식 비교 ListViews,DataSources 과 같은 태그를 사용했지만, 과도한 메모리 소비와 버그들으로 더이상 사용 되지 않게
[엄청 늦은 TIL]RN FlatList, AsyncStorage,SVG
기업 협업 부터, 취업 준비까지 핑계를 대자면 엄청 바쁘게 달려오다보니 해야지해야지 하던 블로깅이 무려 한달가까이 늦어버렸다.... 처음에는 '글의 퀄리티를 좀 높여서 블로깅을 해야지'라는 생각이었는데 내 기준으로 봤을 때 꾸준하지 못한게 더 악영향.. 조만간 깃블로그
TIL] React Native-FlatList, SectionList
. react native tab view . FlatList (key는 string)
React-Native FlatList에 대해 알아보자
오늘은 React-Navtive FlatList에 대해 알아보자! FlatList 컴포넌트란? FlatList는 많은 양의 스크롤이 필요한 리스트 아이템을 보여주고자 할 때 쓰이는 리액트네이티브 컴포넌트이다 JS에서의 map 함수 역할과 비슷하나 더 많은 기능을
React-Native) FlatList
RN에서 많은 양의 데이터를 처리할때는 FlatList나 ScrollView 를 주로 사용한다. 화면보다 데이터의 양이 많을 경우 두 태그는 모두 스크롤을 생성한다는 공통점이 있다. 는 데이터를 모두 렌더링하고 화면이 벗어났을 때 스크롤을 생성하기 때문에 데이터가