Creating Custom Components

Components

• All components are sourced from gluestack-ui and styled using nativewind for consistent styling across web and native platforms.

• Component organization: Located in packages/components folder, subdivided into primitives and custom directories.

• Custom component creation options:

  • Build using existing custom or primitives components
  • Create new components directly with nativewind
  • Reference: nativewind custom components guide

• Implementation steps:

  1. Place custom components in packages/components/custom/<component-name>
  2. Create an index.tsx file with exports
  3. Reference components in Next.js and Expo via the alias: @cloudnua-mobile/components/custom/<component-name>

Additional Resources

• Nativewind Documentation
• gluestack-ui Documentation