7 Days of Code - React Native
Plan and build the entire app in 7 days! Use Javascript and React (React Native) to achieve that. No 3rd party dep used.
What is React Native?
React Native is an open-source framework by Facebook for building cross-platform mobile apps using JavaScript and React. It allows developers to use a single codebase to create native-like experiences on iOS and Android, making it efficient and cost-effective.
What application will you create?
Activity tracker application. A user can create, manage, and track activities.
Is this course right for me?
Yes, If you want to learn how to set goals and create the entire app in 7 days. Also, it would be best if you had an understanding of Javascript or React JS. This course is not for complete beginners.
Day 1: Setting Up and Adding Animations
On the first day, we'll start building our app layout using React Native. We'll focus on making it look good and add animations to activate and deactivate activities. By the end of the day, you'll have a visually appealing foundation for your mobile app.
Day 2: Making Things Work and Saving Progress
Day two is about making the app do things – activating and deactivating activities. We'll also learn to save our work, so even if we close the app, it remembers what we did. This ensures a seamless experience for users who want to pick up where they left off.
Day 3: Keeping Track of Time
On the third day, we'll learn how to track time in our app. We'll use a simple method to measure how long we spend on each activity, providing valuable insights into time management for users.
Day 4: Adding New Activities
Day four is all about adding new activities to our app. We'll create a way for users to put in information about a new activity, and it will show up in the app. This enhances the app's versatility, allowing users to customize their experience.
Day 5: More Details about Activities
On the fifth day, we'll make a page that shows more details about an activity when you tap on it. You can also delete activities from this page. This ensures users have a comprehensive view of their activities and the ability to manage them easily.
Day 6: Editing and Deleting Activities
Day six focuses on making our app better. We'll add a way to edit activity details and confirm if you want to delete an activity. This additional functionality enhances the user's control and interaction with the app.
Day 7: Wrapping Up with a Tutorial
The last day is a big one! We'll create a tutorial to show people how to use our app in three simple steps: starting activities, stopping them, and checking the details. This tutorial not only concludes our course but equips users with a clear understanding of how to navigate and maximize the app's features.
Javascript or other OOP language basics needed!
Preview
FREE PREVIEWRequirements
FREE PREVIEWHow to approach the lectures
FREE PREVIEWStart Planning
Planning Addition
Day 1 - Intro
FREE PREVIEWSetup Project
FREE PREVIEWActivity item and timer
Home screen
Data and Flat list
Place the content to the top
Add variables and container padding
Override Text
Highlight View
Row and more stylings
Timer color and Status Panel
Pan handler Animation
Spring to original position
Day 2 - Intro
FREE PREVIEWMonitor gesture state
FREE PREVIEWActivation callback
Async storage
Check if storage enabled
Activate item
Visual activation change
One activation at the time
Save data to storage
Loading dots animation
Loading dots improvements
Day 3 - Intro
FREE PREVIEWTick function
FREE PREVIEWAccumulate time
Stop timer
Check for previous item
Display timer
Store updated time
UX Improvements
Handle browser refresh
Handle mobile device saving
Day 4 - Intro
FREE PREVIEWFlow Modal
FREE PREVIEWAdd input to modal
Reusable button
Get new item data
Display error and disable button
Close and show the modal
Add new item
Max width of container
Add button icon
Disable scroll
Day 5 - Intro
FREE PREVIEWItem detail screen
FREE PREVIEWFull screen modal
Detail screen layout
Handle double click
Set focused item
Pass time into detail
Delete Button Style
Day 6 - Intro
FREE PREVIEWEditing Mode
FREE PREVIEWItem edit works
Fix button position
Prompt modal
Prompt handler functions
Delete works
Display current date
Day 7 - Intro
FREE PREVIEWTutorial Screen
FREE PREVIEWStepping
Preview Item
Swiping right, get stuck
Animation restart
Handle step 2
Preview item activity
Timeout to restart state
Step 3 Double tap
Disable controls
Hide tutorial
Store watch status to storage
Course End
Filip Jerga
Every video contains a discussion where you can create a post describing an issue. The instructor usually responds within 1 business day.
Within 30 days of the purchase, you can ask for a full refund. No questions asked. Your happiness is our priority.
Of course not! Every lecture is committed (explained in the introduction section). You can start watching at any lecture. Just download the correct version of the project attached to lecture resources.
Single Course Access
$19.00
Access to this course only.
Get started nowMonthly Membership
$19.00 / month
Cancel Anytime!
Get started nowAnnual Membership
$190.00 / year
Cancel Anytime!
Get started now