UI Build Checklist

React (example) of choices to include in a UI library build checklist:

React UI Build Checklist

• Style Guide
• Project creation tool
  • Create React App
  • Create Next App
  • Vite
  • Expo (React Native)
  • Create T3 App
• Package Manager, Bundler
  • NPM
  • Yarn
  • PNPM
  • Webpack
  • Turbopack
  • Turborepo
  • Lerna
  • Nx
• FC or not FC?
  • FC Pros:
    • Explicit return type of ReactElement | null;
      • Alternative for Non-FC is JSX.Element return type
  • FC Cons:
    • React.FC doesn't accept generics
    • Implicitly takes children.
• State Management
  • Redux/RTK
  • Recoil
  • Zustand
  • MobX
  • Context API
• Data Fetching
  • Axios
  • Fetch API
  • SWR
  • RTK Query
  • Tanstack (React) Query
  • Apollo Client
  • Urql
  • Prisma Client
• Routing
  • React Router
  • React Navigation (React Native)
• CSS Styling
  • Tailwind CSS
  • styled-components (CSS-in-JS)
  • emotion (CSS-in-JS)
  • CSS modules
  • SASS
• UI component libraries
  • Chakra UI
  • MUI (Material UI)
  • Tailwind UI components (paid)
  • Flowbite UI (Tailwind-based)
  • React Bootstrap
  • Radix UI
  • Maintine UI
• Animation Libraries
  • Framer Motion
  • react-spring
• Chart libraries
  • Recharts
  • visx
  • nivo
  • Victory
  • react-chartjs
• Form libraries
  • React Hook Form
  • Formik
• Form validation
  • yup
  • zod
• Linting tools
  • eslint
  • prettier
• Authentication
  • auth0
  • Okta
  • nextauth
  • Clerk
  • AWS Cognito
  • GCP Firebase
  • Supabase
• Hosting
  • AWS, GCP, Azure
  • Vercel
  • Digital Ocean
• Testing
  • jest
  • react-testing-library
  • playwright
• Immutable Data Structures
• immer.js
• immutable.js
• Date/Time Libraries
  • date-fns
  • Luxon
• React Internationalization
  • react-i18next
  • FormatJS
  • day.js
• Payments
  • PayPal
  • Stripe
  • Square
  • Solana web3.js
• File Upload
  • react-dropzone
• Maps
  • react-leaflet
  • Mapbox
  • Google Maps
  • world-countries
• Monitoring
  • New Relic Browser
  • Google Analytics
  • AWS Pinpoint/Cloudwatch
  • Adobe Analytics
• Design Prototyping
  • Storybook
  • Figma
• Documentation
  • Docusaurus
  • MDX library (React/Markdown)
  • Gitbook
• Spinners
  • react-spinners
• Icons
  • react-icons