--- title: Best React Native posts of 2023 | daily.dev description: The most upvoted React Native posts of 2023, curated by the daily.dev community. canonical: https://daily.dev/tags/react-native/best-of/2023 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/tags/react-native/best-of/2023 og:type: website og:site_name: daily.dev og:title: Best React Native posts of 2023 | daily.dev og:description: The most upvoted React Native posts of 2023, curated by the daily.dev community. og:image: https://media.daily.dev/image/upload/s--VAY5ToZt--/f_auto/v1724209435/public/daily.dev%20-%20open%20graph --- # Best of React Native — 2023 1. 1 [](/posts/the-react-ecosystem-in-2023-t1c5bte1z "The React Ecosystem in 2023") Article builder.io · 3y The React Ecosystem in 2023 The React Ecosystem celebrates its 10th anniversary in 2023 as the ecosystem continues to flourish. For those who are new to React, getting started can be a daunting task. With a vast array of tools and libraries available within the React ecosystem, choosing the right combination for your project can be challenging. 603 38 2. 2 [](/posts/usehooks-q0mtmslia "useHooks") Article Community Picks · 3y useHooks There’s no better way to learn useHooks than by building it yourself. Use LocalStorage to track the dimensions of the browser window with useWindowSize. Track and manage the visibility of your DOM elements within the viewport. 440 20 3. 3 [](/posts/this-is-why-we-stopped-using-react-native--2lishktw "This is Why We Stopped Using React Native") Article Community Picks · 4y This is Why We Stopped Using React Native React Native is a ‘cross-platform’ framework that allows you to create both Android and iOS apps with a single codebase. It’s an alternative to ‘native’ frameworks for iOS and Android which are the frameworks that the vendors of the platforms suggest you use. 222 29 4. 4 [](/posts/web-development-stacks-in-2023-software-trends-qextnj3wc "Web development stacks in 2023 – software trends") Article The Software House · 3y Web development stacks in 2023 – software trends Web development stack is a set of tools typically used in tandem to develop web apps. A highly specialized web stack can exist within the constraints of frontend or backend development. The most important choice is the one concerning your full development stack. Full web development stacks are abbreviated based on the technologies that comprise them. 168 11 5. 5 [](/posts/react-custom-hook-usearray-xdnabel6v "React Custom Hook: useArray") Article habr · 3y React Custom Hook: useArray "useArray" hook is one of the many carefully crafted hooks available in the collection of React custom hooks. The useArray hook uses the useState hook from React to manage the array state. The advantages of using this custom hook are twofold: it simplifies the management of array states and provides a cleaner and more readable code structure. 153 10 6. 6 [](/posts/tamagui-1-0-tamagui-vjwfe5ljk "Tamagui 1.0 🎉 — Tamagui") Article Community Picks · 3y Tamagui 1.0 🎉 — Tamagui Tamagui is a suite of React components and hooks that optimize React code and provide customizable styles and themes. It consists of Tamagui Core, Tamagui Static, and Tamagui UI. The key feature of Tamagui's performance gains is view flattening or tree-flattening. Tamagui Core is a complete cross-platform style library, while Tamagui Static is an optimizing compiler for frontend React code. There are several new components in Tamagui, and upcoming features include dynamic inline evaluation, container queries, and more. Tamagui is funded by Github Sponsors. 137 10 7. 7 [](/posts/top-front-end-tools-of-2022-smashing-magazine-8d3ucysrm "Top Front-End Tools Of 2022 — Smashing Magazine") Article Smashing Magazine · 4y Top Front-End Tools Of 2022 — Smashing Magazine Top Front-End Tools Of 2022 are the most popular tools in the developer community. Almost all of these tools are practical tools you can use in your projects today. Piling.js is a JavaScript library that allows you to build interfaces where large amounts of items can be dragged and dropped into “piles” It’s built on top of PixiJS. 136 6 8. 8 [](/posts/introducing-react-native-ai-hxocz4nxf "Introducing React Native AI") Article Nader's Thoughts · 3y Introducing React Native AI React Native AI is a full stack framework for building cross-platform mobile AI apps. It provides pre-built components and features for streaming/real-time responses, LLM normalization, OpenAI Assistants, image processing, chat UI, and theming/styling. 121 2 9. 9 [](/posts/react-custom-hook-usescript-dlbvty46f "React Custom Hook: useScript") Article habr · 3y React Custom Hook: useScript This article explores the useScript custom hook in React, which allows for asynchronous script loading and improves performance and user experience. It provides examples of how the hook can be used in different scenarios. 86 1 10. 10 [](/posts/react-custom-hook-useasync-xm3z5emfo "React Custom Hook: useAsync") Article habr · 3y React Custom Hook: useAsync The useAsync hook takes in a callback function that performs the asynchronous operation and an optional array of dependencies. It returns an object with three properties: loading, error, and value. The hook employs the useState and useEffect hooks to manage the loading state and invoke the memoized callback function when necessary. 84 3 11. 11 [](/posts/outstanding-set-of-the-most-powerful-react-hooks-xrdurhlw8 "Outstanding set of the most powerful React Hooks") Article React Native Example · 3y Outstanding set of the most powerful React Hooks Discover an outstanding set of the most powerful React Hooks that can be used in React Native projects. 83 12. 12 [](/posts/react-custom-hook-useonscreen-qlstgjdg2 "React Custom Hook: useOnScreen") Article habr · 3y React Custom Hook: useOnScreen The useOnScreen hook leverages the power of the Intersection Observer API. It can be immensely useful in scenarios where you want to trigger animations, lazy load images, or load additional content as the user scrolls. UseOnScreen will notify you when it enters or exits the viewport. 83 5 13. 13 [](/posts/react-performing-authentication-with-jwt-ikqnlmfnk "React: Performing Authentication with JWT") Article asayer · 3y React: Performing Authentication with JWT This article will discuss how to perform JWT authentication in a React app. We will cover the steps involved in setting up a backend JWT endpoint, signing up and signing in from your React app, and protecting routes with JWT validation. You will use a custom-built Express server API to relay the JWT token for a user. 80 7 14. 14 [](/posts/front-end-javascript-development-handbook-react-angular-and-vue-compared-ixhkwdsar "Front End JavaScript Development Handbook – React, Angular, and Vue Compared") Article freeCodeCamp · 3y Front End JavaScript Development Handbook – React, Angular, and Vue Compared Frontend frameworks offer structured approaches and pre-built components to streamline the coding process. These tools can help boost productivity by offering reusable components and abstracting complex tasks like DOM manipulation and state management. Frameworks promote code maintainability through modular development, making it easier to modify or replace individual components. 76 3 15. 15 [](/posts/react-custom-hook-usedarkmode-v8zzl6epm "React Custom Hook: useDarkMode") Article habr · 3y React Custom Hook: useDarkMode "UseDarkMode" Hook is one of the many carefully crafted hooks available in the collection of React custom hooks. It combines two other handy hooks and, to provide a seamless dark mode experience. It automatically detects the user's preferred color scheme and persists the dark mode state in the browser's local storage. 72 16. 16 [](/posts/react-custom-hook-useprevious-rpihxtwtq "React Custom Hook: usePrevious") Article habr · 3y React Custom Hook: usePrevious "usePrevious" hook is one of the many carefully crafted hooks available in the collection of React custom hooks. The advantages of using usePrevious are remarkable. By using useRef, this hook efficiently stores the current and previous values, updating them whenever the value changes. 71 3 17. 17 [](/posts/react-custom-hook-usestorage-7c33obhd1 "React Custom Hook: useStorage") Article habr · 3y React Custom Hook: useStorage Discover the potential of React custom hooks with a focus on the 'useStorage' hook. It provides convenient functions for storing and retrieving data in the browser's local or session storage. The hook handles serialization, deserialization, and automatic synchronization with the component's state. The remove function allows for easy deletion of stored values. Use the hook in various scenarios, such as persisting user preferences in a settings panel. 67 3 18. 18 [](/posts/htmx-the-game-changing-alternative-to-react-jonbkmzdc "HTMX: The Game-Changing Alternative to React") Article Community Picks · 3y HTMX: The Game-Changing Alternative to React 68 11 19. 19 [](/posts/react-custom-hook-useclickoutside-yezh95qls "React Custom Hook: useClickOutside") Article habr · 3y React Custom Hook: useClickOutside The useClickOutside hook is designed to simplify the process of detecting clicks outside a specified component. It listens for click events on the document level, allowing you to trigger a callback function when a click occurs outside the provided component's reference. It works seamlessly with functional components using the useState and useRef hooks. 63 2 20. 20 [](/posts/a-travel-app-ui-in-react-native-with-tailwindcss-b7uhrrxh4 "A Travel App UI in React Native with TailwindCSS") Article React Native Example · 3y A Travel App UI in React Native with TailwindCSS Open it in the Expo app on your phone to view it. It will reload if you save edits to your files, and you will see build errors and logs in the terminal. It also attempts to open your app on a connected Android device or emulator. 62 2 21. 21 [](/posts/react-custom-hook-usedebuginformation-1ztlht8nk "React Custom Hook: useDebugInformation") Article habr · 3y React Custom Hook: useDebugInformation React Custom Hook: useDebugInformation is one of the many carefully crafted hooks available in the collection of React custom hooks. The hook tracks the number of renders, changed props, time since the last render, and the timestamp of the last rendering. UseDebugInformation can be applied in various scenarios. 57 22. 22 [](/posts/0-to-1-working-in-a-startup-as-software-engineer-0bxuxhe25 "0 to 1, working in a startup as Software Engineer") Article DEV · 3y 0 to 1, working in a startup as Software Engineer The article recounts the author's personal journey of working in a startup as a software engineer. It highlights factors to consider before joining a startup, the validation of the startup's idea, and the possibility of work-life balance in a startup. 54 1 23. 23 [](/posts/react-custom-hook-usestatewithhistory-hlkntwuly "React Custom Hook: useStateWithHistory") Article habr · 3y React Custom Hook: useStateWithHistory Explore the benefits and use cases of the useStateWithHistory custom React hook which provides automatic history tracking, efficient memory usage, and time-travel functionality. 52 24. 24 [](/posts/react-custom-hook-usecookie-nrhqaw9xu "React Custom Hook: useCookie") Article habr · 3y React Custom Hook: useCookie React Custom Hook: useCookie is one of the many carefully crafted hooks available in the collection of React custom hooks. UseCookie allows you to effortlessly handle cookies by providing a concise interface. In scenarios where you need to remove a cookie, the deleteCookie function comes to the rescue. 52 3 25. 25 [](/posts/react-custom-hook-usetimeout-mzv5vqe5w "React Custom Hook: useTimeout") Article habr · 3y React Custom Hook: useTimeout Learn about the useTimeout hook in React, which allows for easy setting, clearing, and resetting of timeouts within a component. The hook ensures that the callback function remains up to date and optimizes performance by memoizing certain functions. It can be used in various scenarios where timed actions are required. 51 [See all React Native archives](/tags/react-native/best-of) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@graph":[{"@type":"CollectionPage","@id":"https://daily.dev/tags/react-native/best-of/2023#page","url":"https://daily.dev/tags/react-native/best-of/2023","name":"Best React Native Posts of 2023","description":"The most upvoted React Native posts of 2023, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/tags/react-native/best-of/2023#items","numberOfItems":25,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/the-react-ecosystem-in-2023-t1c5bte1z","name":"The React Ecosystem in 2023"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/usehooks-q0mtmslia","name":"useHooks"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/this-is-why-we-stopped-using-react-native--2lishktw","name":"This is Why We Stopped Using React Native"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/web-development-stacks-in-2023-software-trends-qextnj3wc","name":"Web development stacks in 2023 – software trends"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/react-custom-hook-usearray-xdnabel6v","name":"React Custom Hook: useArray"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/tamagui-1-0-tamagui-vjwfe5ljk","name":"Tamagui 1.0 🎉 — Tamagui"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/top-front-end-tools-of-2022-smashing-magazine-8d3ucysrm","name":"Top Front-End Tools Of 2022 — Smashing Magazine"},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/introducing-react-native-ai-hxocz4nxf","name":"Introducing React Native AI"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/react-custom-hook-usescript-dlbvty46f","name":"React Custom Hook: useScript"},{"@type":"ListItem","position":10,"url":"https://daily.dev/posts/react-custom-hook-useasync-xm3z5emfo","name":"React Custom Hook: useAsync"},{"@type":"ListItem","position":11,"url":"https://daily.dev/posts/outstanding-set-of-the-most-powerful-react-hooks-xrdurhlw8","name":"Outstanding set of the most powerful React Hooks"},{"@type":"ListItem","position":12,"url":"https://daily.dev/posts/react-custom-hook-useonscreen-qlstgjdg2","name":"React Custom Hook: useOnScreen"},{"@type":"ListItem","position":13,"url":"https://daily.dev/posts/react-performing-authentication-with-jwt-ikqnlmfnk","name":"React: Performing Authentication with JWT"},{"@type":"ListItem","position":14,"url":"https://daily.dev/posts/front-end-javascript-development-handbook-react-angular-and-vue-compared-ixhkwdsar","name":"Front End JavaScript Development Handbook – React, Angular, and Vue Compared"},{"@type":"ListItem","position":15,"url":"https://daily.dev/posts/react-custom-hook-usedarkmode-v8zzl6epm","name":"React Custom Hook: useDarkMode"},{"@type":"ListItem","position":16,"url":"https://daily.dev/posts/react-custom-hook-useprevious-rpihxtwtq","name":"React Custom Hook: usePrevious"},{"@type":"ListItem","position":17,"url":"https://daily.dev/posts/react-custom-hook-usestorage-7c33obhd1","name":"React Custom Hook: useStorage"},{"@type":"ListItem","position":18,"url":"https://daily.dev/posts/htmx-the-game-changing-alternative-to-react-jonbkmzdc","name":"HTMX: The Game-Changing Alternative to React"},{"@type":"ListItem","position":19,"url":"https://daily.dev/posts/react-custom-hook-useclickoutside-yezh95qls","name":"React Custom Hook: useClickOutside"},{"@type":"ListItem","position":20,"url":"https://daily.dev/posts/a-travel-app-ui-in-react-native-with-tailwindcss-b7uhrrxh4","name":"A Travel App UI in React Native with TailwindCSS"},{"@type":"ListItem","position":21,"url":"https://daily.dev/posts/react-custom-hook-usedebuginformation-1ztlht8nk","name":"React Custom Hook: useDebugInformation"},{"@type":"ListItem","position":22,"url":"https://daily.dev/posts/0-to-1-working-in-a-startup-as-software-engineer-0bxuxhe25","name":"0 to 1, working in a startup as Software Engineer"},{"@type":"ListItem","position":23,"url":"https://daily.dev/posts/react-custom-hook-usestatewithhistory-hlkntwuly","name":"React Custom Hook: useStateWithHistory"},{"@type":"ListItem","position":24,"url":"https://daily.dev/posts/react-custom-hook-usecookie-nrhqaw9xu","name":"React Custom Hook: useCookie"},{"@type":"ListItem","position":25,"url":"https://daily.dev/posts/react-custom-hook-usetimeout-mzv5vqe5w","name":"React Custom Hook: useTimeout"}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Tags","item":"https://daily.dev/tags"},{"@type":"ListItem","position":3,"name":"React Native","item":"https://daily.dev/tags/react-native"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/tags/react-native/best-of"},{"@type":"ListItem","position":5,"name":"2023"}]}]} ```