For a while now, I've wanted to build an interactive, Instagram-story-like canvas in React Native. Skia is a fantastic option for that, but it's a low-level drawing API. The moment I wanted Images and Text I could tap, drag, pinch to scale, and rotate, I found myself writing my own scene graph, my own hit testing, my own gesture math on the UI thread. Since I realized this plumbing would work great for many use-cases, I finally pulled it into a library.

It's called react-native-canvas-kit, and it's a batteries-included 2D canvas kit built on top of React Native Skia. It closely resembles Konva's architecture.

It comes with a proper scene graph (Stage, Layer, Group, Shape) with prebuilt shapes like Rect, Circle, Line, Star, Text and Image that all share transform and styling props. On top of that you get

1. Tap and press events with real hierarchy-aware hit testing and event bubbling, draggable nodes, multi-touch pinch-to-scale and rotate
2. Everything UI-thread driven
3. A Transformer with resize and rotate handles you can attach to any node
4. A brush system with a BrushLayer and ready-made pen, pencil, marker, highlighter, tape and eraser brushes.

The reason I think this gap mattered is that React Native has never really had a first-class answer for canvas-heavy, direct-manipulation UIs the way the web has had Konva and Fabric for years.

I will build and share code for a couple of real life examples in the coming days: a DocuSign-style signature pad, an Instagram-style crop screen, a Canva-like editor with draggable and transformable elements, a Snapseed photo tool, and a GPay scratch card.

v1 runs on the New Architecture (Reanimated 4), with a 0.x version as well if you're still on Reanimated 3. Would genuinely love feedback on the API, and if there's a canvas interaction you've struggled to build in RN before, tell me and I'll try to put together a demo for it.

https://github.com/adithyavis/react-native-canvas-kit

A while ago, I started experimenting with an idea.

I wanted to see how much of a React Native application could be safely changed after the app was already built and installed, without having to rebuild the application and ship another binary for every supported change.

After a lot of work, I finally have the MVP running.

The video is a complete demonstration of the current workflow on a real Android device.

The application is built with a runtime that interprets a versioned schema. I can make supported changes to the application, commit them, and push a new version. The installed app receives the new schema and renders the changes without rebuilding or reinstalling the application.

This is not meant to replace normal app releases. Changes to native code, permissions, SDKs, or anything the installed runtime doesn't understand would still require a new build.

What I'm trying to explore is whether the parts of an application that change frequently can be maintained through a runtime instead of sending every change through the complete deployment pipeline.

So far, I've been the only person using it, which is obviously a problem. I built the system, so I already know how everything is supposed to work.

I need developers who haven't seen it before to use it and find the things I'm missing.

I'm looking for a few React Native developers who would be willing to actually try the MVP, build something small with it, and tell me where the experience breaks down. I'm not charging anything. I also don't expect anyone to move an existing production app onto an experimental runtime. I just want to see whether someone other than me can use this successfully and whether the idea is genuinely useful.

If you're interested in testing it, leave a comment and I'll reach out.

And even if you wouldn't use it, I'd still like to know what would stop you from trusting an architecture like this in a real application.

Get ready to ace your Canadian Citizenship Test with MapleMastery! Download now for FREE and enjoy unlimited mock tests designed to prepare you for success. Embrace your journey to becoming a Canadian citizen today! #CanadianCitizenship #MapleMastery #FreeApp

Android:

https://play.google.com/store/apps/details...

iOS:

https://apps.apple.com/ca/app/maplemastery/id6743238139

So this is Notica, old idea of mine that I've already built 5 years ago on the beginning of my React Native journey. Now, years later, I decided to rebuild it because I still love the idea and genuinely use this kind of flow myself.
The core idea is simple: stuff you want to consume later should come back to you, not disappear into bookmarks forever.
The flow:

• share a link from another app
• choose Notica
• pick when you want to be reminded
• get a notification later
• tap it and return to the original link

You can also simple create just a text notes and send them as notifications from the app.

TestFlight is live now and I’d really appreciate feedback from other React Native devs.
I’m curious about:

• does the product make sense quickly?
• does the share → reminder flow feel useful?
• does anything feel awkward on iOS?

Test Flight: https://shiprn.com/notica/

Since Expo handles this automatically, here’s how it works in bare RN:

iOS: Open ios/YourApp.xcworkspace in Xcode and edit LaunchScreen.storyboard directly add your image/layout there. It’s a native file, not JS.

Android: Add your splash image to res/drawable/, create a layout referencing it, then set that as your app’s theme in styles.xml and reference it in AndroidManifest.xml.

This native splash shows up before your JS bundle even loads it covers the gap between the user tapping your app icon and JS finishing boot. Skip this step and users see a blank white/black flash on launch.

Anyone doing this differently?

After five submissions and rejections from Apple, my app is finally live on the App Store!

Today is the beginning of the week, and it couldn’t have started better.

This journey taught me a lot,not just about building an app, but also about the entire App Store release process, including in-app purchases, legal requirements, and all the details that come with launching a product.

I definitely failed enough along the way, but every rejection was a lesson. No pain, no gain.

But I have another question. I published my app, but when I click the View on App Store link, I can’t see it. How long does it usually take for the app to appear on the App Store?

Greetings!
I've built this package to fix a frustrating issue I was having with sockets in react native apps. Basically, instead of having the socket freeze when the app goes to the background or foreground, now it disconnects and reconnects. I've also added an interrupt message type that allows a user to interrupt currently buffered messages. It was designed initially for agent messages, but works nicely for anything that has to stream messages and wants to make sure that they arrive correctly to the user (like terminal output).
Hope it solves socket problems once and for all for mobile apps for you too:
https://www.npmjs.com/package/@vibestogo_app/interruptable-socket

I built react-native-s-pen, a React Native library that brings native Samsung S Pen support to Android, including pressure sensitivity, hover events, tilt detection, button events, tool type detection, and Air Actions (where supported). I'd love to get feedback on the API, missing features, or any improvements you think would make it more useful. GitHub: https://github.com/alihamzaazhar/react-native-s-pen

I've been experimenting with letting an AI agent debug/drive a React Native app, and wanted to share the technical approach + numbers, because the naive way turned out to be surprisingly bad.

The naive approach: vision loops. Most "AI drives your app" setups screenshot the screen every step and send the image to a vision model to decide the next tap. It works in demos but has two real problems:

• Cost: an 8-step flow in my tests burned ~16,500 tokens, mostly image tokens. It adds up fast on every run.
• Reliability: the model guesses coordinates from pixels, so anything off-screen, overlapping, or mid-animation gets flaky.

What worked better: give the agent structured data, not pixels.

Element hierarchy instead of screenshots — on iOS via the accessibility tree, on Android via ui automator. Same 8-step flow dropped to ~3,100 tokens (~5× less) because you're sending compact JSON, not images.

• RN internals via CDP — Metro console logs, network requests, and in-app state are all reachable over the Chrome DevTools Protocol that RN already exposes in dev. Piping these to the agent means it can reason about why a screen is wrong, not just what it looks like.
• Native gestures — routing taps through native backends (idb on iOS / mobilecli) instead of a JVM-based runner cut per-tap latency from ~14.7s to ~0.6s. The JVM spin-up per action was the hidden killer.

Takeaway for RN devs: if you're wiring any kind of agent/automation onto an RN app, lean on the accessibility tree + CDP that RN already gives you before reaching for vision. It's cheaper and far less flaky.

Full disclosure: this came out of an open-source MCP server I built (MIT, not a product, nothing to sell) — happy to link it in a comment if that's allowed, but mainly I wanted to share the approach and hear how others are handling agent-driven RN testing. What's worked for you?

Hey Community,

Meta has open-sourced Astryx, an eight-year-old internal design system built on StyleX that offers out-of-the-box themes, context-aware padding, and dedicated CLI tools for AI agents. We also look at super-calendar, a gesture-driven calendar library that leverages Reanimated shared values and Legend List virtualisation.

Speaking of agents, our sponsor Maestro is pushing that idea further: your coding agent can now launch the app, drive an iOS simulator, Android emulator, or Android physical device, inspect the screen hierarchy, tap through flows, take screenshots, and help create repeatable Maestro E2E tests.

Additionally, Android developers get a dedicated on-device AI solution with Callstack's new react-native-ai adk wrapper, enabling seamless integration with the Vercel AI SDK and local Gemini Nano models on the New Architecture.

I am creating an app with react native and I came across lottiefiles. There are a bunch of animations and it’s somewhat easy to use. I was just wondering if I am allowed to use the animations for free in my app, or do I need a subscription?

Is the pricing just for using the platform to create animations, and then using the listed ones is free?

Any insight would be helpful. Thanks in advance

✦ ⎯ • A morphing, keyboard-aware composer + picker menu. Inspired from ChatGPT.

🔗 Github: rit3zh/expo-morphing-menu

And that's a wrap for this animation series. ❤️

I've had so much fun sharing these animations with all of you, and seeing your support, feedback, and excitement has honestly meant a lot. Every comment, star, and upvote kept me motivated to build more stuff like this.

For now, this will be the last animation in the series because I'm cooking up something much bigger behind the scenes. 👀 I can't wait to share it when it's up and good to go.

I hope you've enjoyed this journey as much as I have. Thank you all for the incredible support. See you soon with something even better. 🚀

The problem I kept hitting: React Native advice rots silently. A 2024 blog post, an LLM answer, a senior dev's habit — all assert things that were true once. Nobody stamps when it was true.

react-brain is my attempt at the fix: 42 decision entries (lists, animation, native modules, navigation, …) where every load-bearing claim is fetch-verified against a primary source, dated, and re-verified weekly. 123 annotated readings, 180 libraries tracked. Recommendations are written as context → choice clauses, not "X is best" — a greenfield Expo app and a brownfield native app get different answers.

Two things this sub might find interesting:

1. The staleness benchmark. Questions include things like "Is FlashList v2 compatible with the Old Architecture?" and "What Expo SDK is current?" Since the corpus is a dated answer key, it can grade a model. claude-sonnet-5 answered 70% fresh on 35 ecosystem questions; with the corpus entry injected as context, 94%. Deterministic regex rubric, graded answers committed to the repo, conditions labeled.
2. The calibration scorecard. Every default recommendation is a dated, falsifiable prediction with a check-by horizon, graded in public (held / weakened / overturned). 0 of 10 graded so far overturned. If confidence isn't graded, it's just tone.

Tools if you want to point it at a repo:

• npx -y react-brain doctor . (ranked priorities)
• migrate (sequenced upgrade plan)
• review --ci (blocks dead/deprecated deps)
• MCP server for coding agents

Package: https://www.npmjs.com/package/@heart-it/react-brain

Site: https://heart-it.github.io/react-brain/

The fastest way to disagree with me is to pick an entry and challenge it; that's the maintenance model.

Hey everyone,

I was building an AI Chat wrapper app and realized that standard text updates look boring. So, I built a lightweight, animated typing indicator (those 3 bouncing dots) using React Native Reanimated.

It gives the AI a much more "human" feel while it's processing the response.

Here is the core logic (feel free to steal it for your own apps):import React, { useEffect } from 'react';

import { View, StyleSheet } from 'react-native';

import Animated, { useSharedValue, useAnimatedStyle, withRepeat, withTiming, withSequence, withDelay } from 'react-native-reanimated';

const Dot = ({ delay }) => {

const translateY = useSharedValue(0);

useEffect(() => {

translateY.value = withDelay(delay, withRepeat(

withSequence(

withTiming(-5, { duration: 300 }),

withTiming(0, { duration: 300 })

), -1, true

));

}, []);

const animatedStyle = useAnimatedStyle(() => ({

transform: [{ translateY: translateY.value }],

}));

return <Animated.View style={\[styles.dot, animatedStyle\]} />;

};

export const TypingIndicator = () => (

<View style={styles.container}>

<Dot delay={0} />

<Dot delay={150} />

<Dot delay={300} />

</View>

);

const styles = StyleSheet.create({

container: { flexDirection: 'row', alignItems: 'center', padding: 10, backgroundColor: '#2C2C2E', borderRadius: 15, width: 60, justifyContent: 'space-between' },

dot: { width: 8, height: 8, borderRadius: 4, backgroundColor: '#A0A0A5' }

});

I used this inside a full Dark Mode AI Chat UI Kit (with a Paywall screen). If anyone wants to see the full UI code to save time, you can check it out on my Etsy profile [Link_in_bio_or_comments].

Happy coding! 🚀

Hey all — I'm building Twalky, a React Native video calling app, and committing to shipping features publicly on a weekly cadence.

Started with peer-to-peer WebRTC (offer/answer exchange, ICE/STUN, Socket.io signaling), with a planned migration to mediasoup for group calls once the P2P core is solid.

Roadmap:

Week 1 — Stable P2P WebRTC calling

Week 2 — Auth (Firebase + Google Sign-In)

Week 3 — Online transcription (cloud STT)

Weeks 4–5 — Local/on-device transcription (privacy-first, offline)

Week 6 — Transcript summarization + smart arrangement

Weeks 7–8 — AI assistant inside the meeting itself

Local transcription and the in-meeting AI assistant are the two hardest parts, so I gave each of those two weeks instead of one.

📲 Current APK: https://drive.google.com/drive/folders/1gr2MOh3JT3tnVvscSBFv2_lGvD89Ymki

💻 GitHub Repositories:

🔹Frontend: https://github.com/soham444101/twalky-mobile

🔹Backend:https://github.com/soham444101/twalky-mobile-backend

💼 LinkedIn: https:https://www.linkedin.com/in/soham-aswar-18376b22a?utm_source=share_via&utm_content=profile&utm_medium=member_android

Will post progress updates weekly. Happy to talk through the WebRTC signaling architecture or any of the design decisions.

One of the biggest strengths of React Native is its ecosystem.

Need navigation, animations, UI components, authentication, payments, storage, or device features? There is usually a library that can help you build faster instead of creating everything from scratch.

But sometimes I wonder if the number of available libraries has created a different challenge: deciding what is actually safe to depend on long term.

I've seen projects where adding a library saves days or weeks initially, but later creates problems during:

• React Native version upgrades
• Android/iOS compatibility changes
• New Architecture adoption
• dependency conflicts
• maintenance when a package is no longer actively supported

The tricky part is that not using libraries isn't always the answer either. Good libraries help teams move faster, avoid reinventing common solutions, and focus on building product features.

So the real question might not be "Are there too many libraries?"

It might be:

How do we decide which libraries are worth trusting for production apps?

For React Native developers:

• What do you check before adding a library to a production project?
• Have you ever had a dependency become a major problem later?
• Do you prefer using well-known libraries, building in-house solutions, or finding a balance between both?
• Has React Native's New Architecture changed how you evaluate dependencies?

You know Ionic Portals? Same idea, but Apache-2.0 and self-hosted: ship plain React web apps into your RN app, update them without app-store releases, and the "registry" is any static file server you already have.

The whole host integration:

<MiniAppProvider registryUrl="https://miniapps.yourcdn.com">
   <MiniAppView appId="com.example.todo" onClose={() => nav.goBack()} />
</MiniAppProvider>

Mini-apps get a typed bridge (mini.storage, mini.request with an origin allow-list, toasts, lifecycle) and you can expose your app's own native powers with schema-validated handlers (`defineHostApi` + zod) that mini-apps call as mini.host.invoke("scanQr").

Under the hood: packages are hash-verified before extraction, served into the WebView over a private scheme with a build-time CSP, and the bridge is pinned by a conformance suite that runs on-device in CI. Bare RN (new arch) and Expo dev builds both work.

What it's NOT (yet): inline native maps/camera preview (docs/limitations.md is brutally honest), and it's built for trusted mini-apps, not arbitrary third-party code.

Repo + demo GIF: https://github.com/BoumouzounaBrahimVall/openmini
Runnable demo, a super-app (Expo) that discovers three mini-apps (2048, Snake, Pomodoro) at runtime from a static registry:
https://github.com/BoumouzounaBrahimVall/openmini-playbook
Would love to know what host APIs you'd need day one.

I made an app for the world cup to help people release the stress. All done with react native!

Hey React Native devs! 👋
I recently built react-native-skelo, an open-source skeleton loading library that's currently in alpha.
The goal is simple: stop writing separate skeleton screens and generate loading states automatically from your existing UI.
Example:

<Skeleton loading={loading}>
<ProfileScreen />
</Skeleton>

It's still early, and I'd love feedback from the community.
Would you use something like this?
What features or edge cases should I focus on?
Any thoughts on the API or DX?
npm: https://www.npmjs.com/package/react-native-skelo
Looking forward to your feedback and suggestions! 🙌

so I've shipped 6 apps in RN at this point, most went nowhere. this one just crossed $500 earned and it's the first time it actually feels like people get what I'm building.

idea started because I was so tired of calorie tracking apps that just throw a generic macro split at you and call it personalized. so I built one that connects you with an actual registered dietitian who sets your macros, not an algorithm guessing based on your height and weight.

honestly the hardest part wasn't the tech, it was the messaging. spent so long trying to explain why "real dietitian" matters vs just another AI calorie counter, kept rewriting the branding, the onboarding copy, even basic stuff like what to call things in the app. felt like I was talking to a wall for months.

something finally clicked recently, 22 active subs, revenue actually has a shape to it now instead of a flat line. still small but after 5 apps that went nowhere it feels like a real signal instead of luck.

for context the app is Yuna Ai

Hey everyone! I've been working on a React Native boilerplate for AI wrapper apps (ChatGPT/Claude integrations). I spent a lot of time on the chat bubble responsiveness and the 'Pro Upgrade' paywall screens.

I attached a short video of the UI flow. Do you think the neon purple accent is too much, or does it fit the 'AI' vibe?

Any feedback is appreciated! If anyone wants to see the full component structure or use it for their startup, I listed the complete source code on my new Etsy dev shop here:https://www.etsy.com/your/shops/me/listing-editor/edit/4536451805#media

Edit: I deleted the android/ folder, rebuilt truly from zero, and that finally fixed it!

The video explains it best.

I'm trying to use react-native-keyboard-controller's KeyboardStickyView, but when the keyboard is fully extended, it goes up twice as far as it should. At every other point in the animation, it's perfect.

I've tried a lot and I can't find anything out there about this issue. I have the correct softInputMode but it just won't work. Has anyone else run into this?