The latest articles on DEV Community by Avin Lambrero (@lambrero). https://dev.to/lambrero https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F894701%2F5ba8bf5a-3d82-49af-b9b2-325a82f9a9b4.png https://dev.to/lambrero en Avin Lambrero Fri, 20 Jan 2023 15:35:44 +0000 https://dev.to/lambrero/top-packages-for-react-development-2444 https://dev.to/lambrero/top-packages-for-react-development-2444 <p>Here is my set of favorite libraries when developing with React.</p> <h2> Building + developing </h2> <ul> <li> <a href="https://github.com/facebook/create-react-app" rel="noopener noreferrer">Create react app</a> + <a href="https://github.com/dilanx/craco" rel="noopener noreferrer">Craco</a> </li> <li><a href="https://github.com/vitejs/vite" rel="noopener noreferrer">Vite</a></li> <li><a href="https://github.com/avin/fake-api-middleware" rel="noopener noreferrer">Fake-api-middleware</a></li> </ul> <h2> Navigation </h2> <ul> <li><a href="https://github.com/remix-run/react-router" rel="noopener noreferrer">react-router</a></li> </ul> <h2> State managment </h2> <ul> <li><a href="https://github.com/reduxjs/redux-toolkit" rel="noopener noreferrer">Redux Toolkit</a></li> <li><a href="https://github.com/pmndrs/zustand" rel="noopener noreferrer">Zustand</a></li> </ul> <h2> Common hooks </h2> <ul> <li><a href="https://github.com/streamich/react-use" rel="noopener noreferrer">React-use</a></li> <li><a href="https://github.com/alibaba/hooks" rel="noopener noreferrer">Ahooks</a></li> </ul> <h2> Form control </h2> <ul> <li><a href="https://github.com/react-hook-form/react-hook-form" rel="noopener noreferrer">React-hook-form</a></li> <li><a href="https://github.com/jaredpalmer/formik" rel="noopener noreferrer">Formik</a></li> </ul> <h2> I18n </h2> <ul> <li><a href="https://github.com/i18next/react-i18next" rel="noopener noreferrer">React-i18next</a></li> </ul> <h2> Components playground </h2> <ul> <li><a href="https://github.com/react-cosmos/react-cosmos" rel="noopener noreferrer">React-cosmos</a></li> <li><a href="https://github.com/storybookjs/storybook" rel="noopener noreferrer">Storybook</a></li> </ul> <h2> Animation </h2> <ul> <li><a href="https://github.com/reactjs/react-transition-group" rel="noopener noreferrer">React-transition-group</a></li> <li><a href="https://github.com/pmndrs/react-spring" rel="noopener noreferrer">React-spring</a></li> </ul> <h2> Utils </h2> <ul> <li><a href="https://github.com/lukeed/clsx" rel="noopener noreferrer">Clsx</a></li> </ul> <h2> Other useful packages </h2> <ul> <li><a href="https://github.com/uNmAnNeR/imaskjs" rel="noopener noreferrer">imask</a></li> <li><a href="https://github.com/eduardoboucas/include-media" rel="noopener noreferrer">include-media</a></li> <li><a href="https://github.com/fkhadra/react-toastify" rel="noopener noreferrer">react-toastify</a></li> </ul> programming webdev discuss Avin Lambrero Thu, 05 Jan 2023 20:52:52 +0000 https://dev.to/lambrero/alternative-libs-to-migrate-from-react-to-vue-or-vue-to-react-18dl https://dev.to/lambrero/alternative-libs-to-migrate-from-react-to-vue-or-vue-to-react-18dl <p>Here is a list of libs to choose when you decide to go from React to Vue (or vice versa)</p> <h2> State management </h2> <p>React:</p> <ul> <li><a href="https://github.com/reduxjs/redux-toolkit">redux-toolkit</a></li> <li><a href="https://github.com/pmndrs/zustand">zustand</a></li> </ul> <p>Vue:</p> <ul> <li><a href="https://github.com/vuejs/pinia">pinia</a></li> </ul> <h2> Use SVG as component </h2> <p>React: </p> <ul> <li><a href="https://github.com/gregberge/svgr">SVGR</a></li> </ul> <p>Vue: </p> <ul> <li> <a href="https://github.com/jpkleemans/vite-svg-loader">vite-svg-loader</a> </li> <li> <a href="https://github.com/shrpne/vue-inline-svg">vue-inline-svg</a> + <a href="https://github.com/wangzongming/vite-plugin-require">vite-plugin-require</a> </li> </ul> <h2> Form control </h2> <p>React: </p> <ul> <li><a href="https://github.com/react-hook-form/react-hook-form">react-hook-form</a></li> </ul> <p>Vue: </p> <ul> <li><a href="https://github.com/logaretm/vee-validate">vee-validate</a></li> </ul> <h2> I18n </h2> <p>React:</p> <ul> <li><a href="https://github.com/i18next/react-i18next">react-i18next</a></li> </ul> <p>Vue:</p> <ul> <li><a href="https://github.com/kazupon/vue-i18n">vue-i18n</a></li> </ul> <h2> Common hooks lib </h2> <p>React: </p> <ul> <li><a href="https://github.com/streamich/react-use">react-use</a></li> <li><a href="https://github.com/alibaba/hooks">ahooks</a></li> </ul> <p>Vue:</p> <ul> <li><a href="https://github.com/vueuse/vueuse">vueuse</a></li> </ul> vue react lib compare