React Native With Typescript – The Portfolio Project

Course Curriculum

Chapter 1: Basics of TypeScript

Lecture 1: What is TypeScript?

Lecture 2: Environment Set Up & First Taste of Typescript

Lecture 3: Basic Types in JavaScript

Lecture 4: Type Inference

Lecture 5: Basic Rules to Define Types

Lecture 6: Types for Objects and Arrays

Lecture 7: Type Keyword & Optional Type

Lecture 8: Functions

Lecture 9: Interface

Lecture 10: Generic Types

Lecture 11: Any Types

Chapter 2: How Do I Think

Lecture 1: How did I came up with the idea?

Lecture 2: Before I Start Coding

Lecture 3: How do I Design My Apps

Chapter 3: Environment Setup

Lecture 1: Setting Up Environment

Lecture 2: Running MyFirstApp

Lecture 3: How to Fix Bug – UI Not Responding

Lecture 4: Run on Real Device

Chapter 4: React Native & Typescript

Lecture 1: Initializing RN Project With TS

Lecture 2: React Native & Typescript

Lecture 3: Custom Code Snippets

Chapter 5: Home Screen

Lecture 1: Creating Home Screen

Lecture 2: Using Icons

Lecture 3: Missing Types & App Titles

Lecture 4: Future Proof Button Component

Lecture 5: Let's Install Image Picker

Lecture 6: Taking User Permission

Lecture 7: Capturing Image

Lecture 8: Let's Refactor

Lecture 9: Selecting Image From Device

Chapter 6: Navigation

Lecture 1: Adding Navigation

Lecture 2: Let Me Explain

Lecture 3: Custom Theme

Lecture 4: Navigating to ImageEditor

Lecture 5: Reading Route Params

Chapter 7: Image Editor UI

Lecture 1: Header

Lecture 2: A Bit Advance Refactor

Lecture 3: Moving Back

Lecture 4: Background for Image Editor

Lecture 5: Passport Size Image

Lecture 6: Editor Tools – Selector Buttons

Lecture 7: Let's Refactor Again

Lecture 8: UI for Image Info

Lecture 9: Compressor Slider

Chapter 8: Adding Logics to Image Editor

Lecture 1: Selecting Image For Second Time

Lecture 2: The Confirm Modal

Lecture 3: The Confirm Modal Part 2

Lecture 4: Important: Manual Back Handler

Lecture 5: Handling Back Press Manually

Chapter 9: Logics – Native Module

Lecture 1: Why Native Module?

Lecture 2: Opening Project inside Android Studio

Lecture 3: Creating & Connecting Native Module

Lecture 4: Calling Native Function (Code)

Lecture 5: Adding Types to Native Module

Lecture 6: Adding Promises

Lecture 7: Getting Image Size

Lecture 8: Rendering Image Size

Lecture 9: The Logic Before Code

Lecture 10: Compressing Image

Lecture 11: Resolving Object

Lecture 12: Compressing Image From React Native

Lecture 13: Fixing The issue

Lecture 14: Updating Slider Value

Lecture 15: Updating Compressed Percentage

Lecture 16: What was the bug?

Lecture 17: Fixing The Bug

Lecture 18: Updating Image Size

Lecture 19: Rendering Compressed Image

Lecture 20: Rendering Correct Image

Lecture 21: Breaking The Loop

Lecture 22: Reseting The Old States

Lecture 23: Loading Animation

Lecture 24: Saving The Image

Lecture 25: Will it work?

Lecture 26: Let's Hunt Down The Bug

Lecture 27: Rendering Done Animation

Lecture 28: Fixing Animation

Chapter 10: Bugs

Lecture 1: Permission Related Bugs

Lecture 2: Updating Camera Permission

Lecture 3: Required Permission Alert

Lecture 4: Opening App Settings

Lecture 5: Fixing Navigation Without Image

Lecture 6: How Can We Save Without Permission?

Lecture 7: File Read & Write Permission

Chapter 11: Publishing The App

Lecture 1: Creating Launcher Icon

Lecture 2: Adding Launcher Icon

Lecture 3: Adding Splash Screen

Chapter 12: Bonus

Lecture 1: What after this?