/react-native

React Native Projects

Primary LanguageTypeScript

react-native

Documentation

React Native Documentation

React Documentation

Expo Documentation

Node Documentation

TypeScript Handbook

The Practical Guide

Link to Course

  • Section 1: Getting Started
  • Section 2: React Native Basics
  • Section 3: Debugging React Native Apps
  • Section 4: Dive Deeper into Components, Layout, & Styling
  • Section 5: Building Adaptive User Interfaces
  • Section 6: React Native Navigation with React Navigation
  • Section 7: App-wide State Management with Redux & Context
  • Section 8: Time To Practice - The Expense Tracker App
  • Section 9: Handling User Input
  • Section 10: Sending HTTP Requests
  • Section 11: User Authentication
  • Section 12: Using Native Device Features (Camera, Location, & More)
  • Section 13: Building React Native Apps Without Expo
  • Section 14: Publishing React Native Apps
  • Section 15: Push Notifications
  • Section 16: Course Roundup

The Practical Guide Notes

My Notes from my Coursework

Projects

ExpenseTracker

A React Native + TypeScript application with which a user can add and manage expenses. Application is implemented with Tab Navigation between Recent and All Expenses as well as Stack Navigation between the screens for Viewing and Managing Expenses. A user can create, update, and delete an expense. An expense contains the amount in US dollars, a date, and a description. The ExpenseForm is implemented with input validation as well as validation feedback to the user.

Project Source Code

add-expense edit-expense deleting-expenses form-validation-add form-validation-edit form-validation-empty

Meals

A React Native + TypeScript application with which a user can browse a grid of food categories, select a category, view meals of that category, select a meal, and view a list of ingredients and steps to make this meal.

Project Source Code

meals-app-navigation favorites

GuessMyNumber

A React Native + TypeScript application in which a user chooses a number between 1 and 99, and provides hints (higher or lower) to the application trying to guess this number. Game is adaptable on both portrait and landscape modes.

Project Source Code

230772378-7a401063-3ba0-490b-b3c1-0d418c0d1122 230772395-c48288c8-4827-4e67-85f8-8906dcda24c6 230772398-d3621ae2-da52-448d-ab72-b3c80145b4f4 230821729-4a1963e5-cca7-4bec-ab62-2e16dda6867d

Goals

A simple React Native + JavaScript application in which a user can create a goal, view and scroll through their list of goals, and delete a goal by tapping on it.

Project Source Code

add-goals delete-goals