KO | EN

GitLite

Minimalist Open Source Repository Search Engine

gitlite — search

#developer-tools #typescript #claude-code #codex #dsh #dsh-plugin #ai-agent #ai-agents #deepseek-harness #agent-skills #macos #cli

nativeMotion

★ 92 Open GitHub ↗

React native animated ui components made with styled components, React native reanimated, NO more library hell

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Native Motion

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

**Elevate your React Native applications with Native Motion – a curated collection of beautifully designed, production-ready, and performant animated UI components.**

Native Motion provides developers with a growing library of lightweight UI elements that can be easily integrated into any React Native project. Our focus is on delivering a seamless copy-paste experience, allowing you to build stunning interfaces without the usual overhead, powered by modern animation techniques.

**Explore the Components & Documentation: [nativemotion.dev](https://nativemotion.dev)**

## ✨ Key Features

*   **Copy & Paste Simplicity:** Effortlessly integrate components directly into your projects.
*   **Performance First:** Built with React Native Reanimated 3 for smooth, native-thread animations (aiming for 60 FPS).
*   **Modern & Aesthetic:** Professionally designed components to enhance the look and feel of your applications.
*   **Lightweight:** No unnecessary bloat, ensuring optimal app performance and bundle sizes.
*   **Developer Focused:** Created by developers, for developers, with a focus on practical use cases and ease of implementation.
*   **Growing Library:** We are committed to regularly adding new and innovative animated components.
*   **Well-Documented:** Clear instructions, examples, and prop details for each component are provided on our documentation site.
*   **Open Source:** Freedom to use, inspect, modify, and contribute.

## 🚀 How to Use Native Motion Components

Native Motion is designed to be incredibly straightforward for developers:

1.  **Browse the Documentation:** Visit our official documentation site at [nativemotion.dev](https://nativemotion.dev) Here you can explore:
    *   Live previews of each component.
    *   Detailed usage instructions and code snippets.
    *   Information on available props for customization.
    *   Any necessary installation prerequisites (e.g., peer dependencies like `react-native-reanimated`).
2.  **Select a Component:** Identify the component that fits your needs.
3.  **Copy the Code:** Each component's documentation page will provide the relevant code snippet.
4.  **Paste into Your Project:** Integrate the copied code into your React Native application's codebase.
5.  **Install Dependencies:** Ensure any peer dependencies mentioned in the component's documentation (like `react-native-reanimated`, `react-native-gesture-handler`) are installed in your project.
6.  **Customize:** Adapt the component using its props to match your application's theme and requirements.

The documentation site is the primary resource for understanding how to utilize each component effectively.

## 🛠️ Technology

While the components are for **React Native**, the Native Motion documentation site itself is built with:

*   **Next.js:** For a fast and modern documentation experience.
*   **Tailwind CSS:** For styling the documentation.
*   **MDX:** For rich and interactive component documentation.
*   **TypeScript:** For robust and maintainable code.

Our React Native components are primarily built using:

*   **React Native**
*   **React Native Reanimated 3**
*   **React Native Gesture Handler**
*   Designed with compatibility for both **Expo** and standard React Native CLI projects in mind.

## 🤝 Contributing

We welcome contributions to Native Motion! Whether it's reporting a bug, suggesting a new component, improving documentation, or submitting a Pull Request, your help is greatly appreciated. Our goal is to build a high-quality, community-driven resource.

**How to Contribute:**

*   **Report Bugs or Request Features:** Please use the [GitHub Issues](https://github.com/your-username/native-motion/issues) tab.
*   **Code Contributions:**
    1.  Please read our [CONTRIBUTING.md](https://github.com/waleedcj/nativeMotion/blob/main/CONTRIBUTING.md) for details on our code of conduct, development setup, and the process for submitting pull requests.
    2.  Fork the repository.
    3.  Create your feature branch (`git checkout -b feature/NewAwesomeComponent`).
    4.  Make your changes and commit them (`git commit -m 'Add: NewAwesomeComponent with X functionality'`).
    5.  Push to your branch (`git push origin feature/NewAwesomeComponent`).
    6.  Open a Pull Request against our `main` (or `develop`) branch for review.
*   **Documentation Improvements:** Suggestions or PRs for improving the documentation are always welcome!

## 📜 License

This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details.

---

We hope Native Motion helps you build beautiful and engaging React Native applications faster!

nativeMotion

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README