Course's logo Course
pro
APIs, Authentication and Tanstack Query
14 videos 1 hrs 36 mins 16 July 2023

Course Decription

Delve into the heart of modern app development with our comprehensive course, “Working with APIs, Authentication and Tanstack Query.” Learn how to seamlessly integrate APIs, implement secure JWT authentication, and handle data efficiently with Tanstack Query in a React Native app.

What will I learn?

  • 🔥 Build a React Native app with Expo Router around an API, with JWT authentication for secure user access.
  • 🔐 Handle JWT storage with Expo and React Context, securing user sessions and enhancing the user experience.
  • ⚡️ Leverage the power of Tanstack Query to efficiently fetch and manage data from APIs.
  • 📸 Upload and display images from the API, enriching your app’s user interface.

Unleash the power of the web in your mobile app development. Enroll in “Working with APIs, Authentication and Tanstack Query” now and build secure, data-rich applications with React Native and APIs today!

start course start course

💪 Getting Started

About the Course

What are we building in this course, and what will you learn? Let's take a quick look at the course and all objectives!

2 min
view

API Setup

You will need an API for this course, and can select between hosted or self hosting.

2 min
view

App Setup with Expo Router

We set up the Expo app and files for the Expo Router v2.

9 min
view

🔐 Authentication

Building the Login UI

Let's set up our login and registration forms so we can easily connect them to the API later.

10 min
view

Using a React Auth Context

In this video, we'll install Axios and create a React Context to manage authentication.

13 min
view

Working with JWT and Expo Store

In this video, we'll install the Expo Secure Store package and use it to store our JWT token

6 min
view

Protecting Pages with Expo Router

Now we can protect the pages that we want to be private using our context.

11 min
view

⚡️ Tanstack Query

Setting up Tanstack Query

We prepare our API calls and add Tanstack to our app.

6 min
view

Queries and Mutations

Let's dive into Queries and Mutations of Tanstack and how to use them.

8 min
view

Creating a FlatList of Todos

To display our items we now set up a cool FlatList component.

8 min
view

Update and Delete Items

Now we will add the ability to update and delete items and again use mutations.

7 min
view

🗳️ File Upload

Capturing Images

To upload files to our API we first need to capture some images.

4 min
view

Image Upload to the API

Now we put everything we learned together to build our API upload functions.

6 min
view

Displaying Remote Images with Authentication

Finally we need to display images from the API with authentication.

4 min
view