DEV Community: Kumar Saurav

React Native Expo Router: Build Swiggy-Style Nested Tabs

Kumar Saurav — Thu, 06 Mar 2025 07:28:38 +0000

Create This Movie App UI with React Native Expo Router!

Kumar Saurav — Tue, 04 Mar 2025 10:16:47 +0000

Master React Native UI design with this movie app tutorial! Learn how to use Expo Router for smooth navigation, create eye-catching tabs, and implement a clean, dark mode aesthetic. By the end, you'll have the skills to build beautiful UIs for any app.

💻 https://github.com/dieselsaurav/rn-exp-movie-app

Expo Router Tutorial: Protected Routes, Tabs, and App Structure 🚀

Kumar Saurav — Thu, 13 Feb 2025 08:46:52 +0000

Learn how to use Expo Router for navigation in your React Native apps! 📱 This tutorial covers essential concepts like protected routes for secure content 🔒, implementing smooth tab navigation 🧭, and structuring your application for scalability 🧱. Perfect for beginners and intermediate developers.

What you'll learn

Setting up Expo Router
Implementing protected routes (for login/authentication)
Creating tab navigation
Structuring your app for maintainability
Best practices for Expo Router navigation

Who is this tutorial for?

This tutorial is designed for React Native developers who want to learn how to use Expo Router for navigation. Whether you're a beginner or have some experience, you'll find this tutorial helpful.

Video Tutorial

https://youtu.be/wfw0ghdy2K8?si=EmWLknDaQHSFQRm5

Code Repository

The complete code for this tutorial is available on GitHub:

https://github.com/dieselsaurav/rn-expo-supabase

Key Concepts Covered

Protected Routes

We'll explore how to protect certain routes in your app, ensuring that only authenticated users can access them. This is crucial for securing sensitive content.

Tab Navigation

Tab navigation is a common UI pattern for mobile apps. This tutorial will show you how to implement smooth and efficient tab navigation using Expo Router.

App Structure

A well-structured app is essential for maintainability and scalability. We'll discuss best practices for organizing your Expo Router project.

Why Expo Router?

Expo Router simplifies navigation in React Native apps, offering a declarative and intuitive approach. It integrates well with Expo and provides features like file-based routing, which makes development a breeze.

Get Started

Watch the video tutorial and clone the GitHub repo to start building your own apps with Expo Router!

Feedback and Questions

I'd love to hear your feedback and answer any questions you have. Feel free to leave a comment below! 👇

Animated Tabbar | React Navigation 5 | Reanimated 2

Kumar Saurav — Mon, 21 Sep 2020 21:49:51 +0000

React Native Module | Bridges

Kumar Saurav — Sun, 13 Sep 2020 12:23:03 +0000

Coding Dribbble Design in React Native | Blurred TabBar

Kumar Saurav — Sun, 06 Sep 2020 18:43:17 +0000

React Native app from scratch | Part 8 Center Button TabBar

Kumar Saurav — Fri, 07 Aug 2020 06:54:36 +0000

React Native app from scratch | Part 7 FlatList Infinite Scroll & Navigation Stack

Kumar Saurav — Tue, 28 Jul 2020 20:26:21 +0000

React Native app from scratch | Part 6 Recipe List & Profile Styling

Kumar Saurav — Wed, 22 Jul 2020 22:19:11 +0000

React Native app from scratch | Part 5 Custom Font and Styling

Kumar Saurav — Sat, 18 Jul 2020 19:32:26 +0000

React Native app from scratch | Part 4 SVG and Theme

Kumar Saurav — Wed, 24 Jun 2020 21:10:17 +0000

React Native app from scratch | Part 3 Custom Hooks

Kumar Saurav — Sun, 14 Jun 2020 22:15:39 +0000