{"id":25344731,"url":"https://github.com/jackccrawford/mobile-base","last_synced_at":"2025-04-08T15:42:24.875Z","repository":{"id":277249076,"uuid":"931813317","full_name":"jackccrawford/mobile-base","owner":"jackccrawford","description":"Basic React Native App","archived":false,"fork":false,"pushed_at":"2025-03-09T06:31:00.000Z","size":37548,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-09T07:20:31.039Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jackccrawford.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-02-12T22:32:47.000Z","updated_at":"2025-03-09T06:31:03.000Z","dependencies_parsed_at":"2025-02-12T23:31:57.432Z","dependency_job_id":"8e9994f5-4787-4c8e-bf32-28104f028d6f","html_url":"https://github.com/jackccrawford/mobile-base","commit_stats":null,"previous_names":["jackccrawford/mobile-base"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jackccrawford%2Fmobile-base","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jackccrawford%2Fmobile-base/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jackccrawford%2Fmobile-base/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jackccrawford%2Fmobile-base/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jackccrawford","download_url":"https://codeload.github.com/jackccrawford/mobile-base/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247873601,"owners_count":21010492,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-02-14T11:50:54.923Z","updated_at":"2025-04-08T15:42:24.869Z","avatar_url":"https://github.com/jackccrawford.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Mobile Base\n\nA modern, well-structured React Native starter app that follows Material Design 3 principles.\n\n[![Windsurf](https://img.shields.io/badge/Built%20with-Windsurf-0066CC.svg)](https://codeium.com/windsurf)\n[![Codeium](https://img.shields.io/badge/Powered%20by-Codeium-09B6A2.svg)](https://codeium.com)\n[![Digital Twin](https://img.shields.io/badge/Digital%20Twin-Ready-blue)](https://www.digitaltwinconsortium.org/)\n[![React](https://img.shields.io/badge/React-18.3.1-blue.svg?style=flat\u0026logo=react\u0026logoColor=61DAFB)](https://reactjs.org/)\n[![React Native](https://img.shields.io/badge/React%20Native-0.76.6-blue.svg?style=flat\u0026logo=react)](https://reactnative.dev/)\n[![Material Design](https://img.shields.io/badge/Material%20Design-v3-000000.svg?style=flat\u0026logo=materialdesign\u0026logoColor=white)](https://m3.material.io/)\n[![Expo](https://img.shields.io/badge/Expo-52.0.30-black.svg?style=flat\u0026logo=expo)](https://expo.dev/)\n[![TypeScript](https://img.shields.io/badge/TypeScript-5.3-3178C6?style=flat\u0026logo=typescript\u0026logoColor=white)](https://www.typescriptlang.org/)\n[![Markdown](https://img.shields.io/badge/Markdown-000000?style=flat\u0026logo=markdown\u0026logoColor=white)](https://www.markdownguide.org/)\n[![Open Source](https://img.shields.io/badge/Open%20Source-%E2%9D%A4-red)](https://opensource.org/)\n[![Documentation](https://img.shields.io/badge/docs-latest-brightgreen.svg)](https://pattern-bridge.github.io/docs)\n[![Community](https://img.shields.io/badge/Join-Codeium%20Community-7289DA.svg?style=flat\u0026logo=discord)](https://discord.gg/3XFf78nAx5)\n[![X](https://img.shields.io/badge/Follow-@jackccrawford-000000.svg?style=flat\u0026logo=x)](https://x.com/jackccrawford)\n[![ManagedV](https://img.shields.io/badge/By-ManagedV-4DFFD2.svg?style=flat)](https://www.managedv.com)\n[![Maintained](https://img.shields.io/badge/Maintained-yes-brightgreen.svg)](https://github.com/pattern-bridge/pattern-bridge/pulse)\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](http://makeapullrequest.com)\n[![License](https://img.shields.io/badge/license-MIT-blue.svg)](https://opensource.org/licenses/MIT)\n\n## Features\n\n- 🎨 **Material Design 3**: Complete implementation of MD3 theming, components, and interactions\n- 🌓 **Smart Theming**: Intuitive theme switching with automatic system theme detection\n- 📱 **Navigation**: Production-ready drawer and tab navigation setup using React Navigation\n- 🎭 **Pattern Examples**: Multiple layout patterns showcasing different UI approaches\n- 📦 **Zero Config**: Ready to use with minimal setup required\n- 🔒 **TypeScript**: Type-safe codebase with modern TypeScript practices\n\n## Quick Start\n\n```bash\n# Clone the repository\ngit clone https://github.com/jackccrawford/mobile-base.git\n\n# Install dependencies\ncd mobile-base\nnpm install\n\n# Start the development server\nnpx expo start --clear\n```\nScan barcode to launch the app on your iOS or Android device.\n\n## Project Structure\n\n```\nsrc/\n├── components/     # Reusable UI components\n├── navigation/     # Navigation configuration\n├── screens/        # Screen components\n├── theme/         # Material Design 3 theming\n└── utils/         # Helper functions and utilities\n```\n\n## Layout Patterns\n\nThe app includes several layout pattern examples that you can use as starting points for your own screens:\n\n- **Masonry**: Pinterest-style grid layout\n- **Card Swipe**: Tinder-style card swiping interface (works on mobile and web)\n- **Standard**: Traditional mobile list view\n- **Focus**: Centered content with emphasis\n- More patterns coming soon!\n\n### Known Issues\n\n- **TODO**: Card swipe animation on desktop browsers needs improvement - cards don't always animate completely off screen when swiped. The implementation works well on mobile web and native platforms.\n\n## Customization\n\n### Settings\n\nThe app includes a comprehensive settings screen with:\n- Theme switching (Light/Dark/System) with intuitive icon-based toggle\n- Custom header title configuration\n- Direct links to GitHub and license information\n\n### Color System\n\nThe app implements a carefully designed color system that:\n- Provides optimal contrast in both light and dark modes\n- Uses consistent patterns for selected/unselected states\n- Follows Material Design 3 color token guidelines\n\n### Theming\n\nThe app uses Material Design 3 theming system. You can customize the theme by modifying `src/theme/theme.ts`:\n\n```typescript\nconst lightTheme = {\n  colors: {\n    primary: '#006495',\n    // ... other color tokens\n  },\n  // ... other theme properties\n};\n```\n\n### Navigation\n\nNavigation is set up using React Navigation v6. The main navigation structure is defined in `src/navigation/ThemedNavigator.tsx`.\n\n## Contributing\n\nWe welcome contributions! Please see our [Contributing Guide](CONTRIBUTING.md) for details.\n\n## License\n\nMIT License - See [LICENSE](LICENSE) for details\n\n---\n\n\u003cp align=\"center\"\u003e\n  \u003ci\u003eBuild beautiful React Native apps.\u003c/i\u003e\u003cbr\u003e\n  \u003ci\u003eStart with a solid foundation.\u003c/i\u003e\n\u003c/p\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjackccrawford%2Fmobile-base","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjackccrawford%2Fmobile-base","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjackccrawford%2Fmobile-base/lists"}