Add Task UI | React Native School

Autoplay
Autocomplete

Previous Lesson Complete and Continue

React Native Beginner

Welcome

Course Outline (3:08)
Join Our Online Classroom!
Exercise: Meet The Community
Accessing Code

Online Resources for React & Javascript

Free Online Resources [Optional]

Introduction

focusTime Demo (2:00)
Introduction To Expo (1:13)
Exercise: focusTime On Your Phone
FocusTime On Our Phone (4:25)
Building On Mobile Phones (2:20)

Building using Expo

Our First React Native App (6:57)
Logo and Header For FocusTime (5:22)
Add Task UI (3:37)
Add Task Store State (5:21)
Add Task Input + Button (6:54)
Exercise: Code Cleanup (2:51)
Solution: Code Cleanup (6:30)
Select Timer Amount (4:28)
Accept User Options (4:57)
Touch Area (3:15)

Local Development

Transition to Local Development (1:38)
Local Developer Environment Setup (2:12)

macOS Environment Setup Part I

MAC: Node + VS Code Setup → Node + VS Code Setup (2:27)
MAC: Node + VS Code Setup (2:31)

Windows Environment Setup Part I

WINDOWS: Node + VS Code Setup (2:32)

Building using Local Environment

VS Code Settings (3:00)
Installing Expo Globally (2:00)
Initializing Our App (3:26)
Initializing Our App 2 (2:48)
App On iOS Device (1:48)
App On Android Device (1:47)
Reviewing The Steps (2:30)
Codebase Walkthrough (3:25)
Developer Workflow (2:47)
Developer Workflow 2 (0:30)
Copy Over Code, And Load On Device (8:14)
List Of Tasks (7:00)
Exercise: Task List (4:34)
Solution: Task List (9:35)
Debugging Your App (5:18)
Countdown Animation (3:07)
Countdown Animation 2 (3:38)
Countdown Animation 3 (7:58)
Countdown Animation 4 (8:37)
Display Remaining Time (6:28)
Stop Button (4:01)
Pause, Play Button (8:07)
Pause Button (2:31)
Pause Button 2 (4:53)
Play Button (5:07)
Exercise: Improving The Code (2:43)
Solution: Improving The Code (13:29)
Store Tasks (9:41)
Simulator Setup (1:49)

macOS Environment Setup Part II

MAC: Android Studio + XCode (2:24)
MAC: Android Studio Setup (3:32)
MAC: Android Studio Setup 2 (1:45)
MAC: Android Studio Setup 3 (1:46)
MAC: XCode Setup (1:52)
MAC: focusTime On iPhone Simulator (2:26)
MAC: focusTime On Android Simulator (2:47)

Windows Environment Setup Part II

WINDOWS: Android Studio Setup (1:17)
WINDOWS: Android Studio Setup 2 (1:40)
WINDOWS: Android Studio Setup 3 (2:05)
WINDOWS: Android Studio Setup 4 (1:57)
WINDOWS: Android Studio Setup 5 (2:13)
WINDOWS: focusTime On Android Simulator (1:41)

Where To Go From Here?

You did it!

Teach online with

Add Task UI

Lesson content locked

If you're already enrolled, you'll need to login.

Enroll in Course to Unlock