This course has been updated! We now recommend you take the React Native, v2 course.
Transcript from the "Sweat Book App Overview" Lesson
[00:00:00]
>> [MUSIC]
[00:00:03]
>> Scott: So yesterday we ended with a bang. Lightning fast talk through Redux which probably confused more than it helped. So today we're actually gonna start with that and a better example is gonna make more sense. So, along with going over what we're going to be doing today. So, here is the app that we're gonna be making, actually and the links for it is actually in the slides.
[00:00:26] If you go to the slides, you click on this link and it will take to what I'm looking at here
>> Scott: Which is this design here. So the app that we're gonna be making today's is called Sweat Book and this is a fitness app that you can use to track your stuff in the gym.
[00:00:44] So basically that's it, but it's gonna cover a lot of things that we didn't talk about yesterday some different APIs and some different components that we're gonna use in [INAUDIBLE] native. So if you look at this design here, we notice we can see a few things and the design is important because it's gonna help us figure out one how to style the app to how to set up the routing.
[00:01:04] What type of navigation system we're gonna use and also how to set up our state management locally would like Redux. And so that's what the design does. So if we look at it, we know that we have like this one page here, which is like you can think of it like the home page of splash screen or whatever.
[00:01:20] And it is just talking about the last time you worked out the day it was on and you can just click this button here that says Start Workout. What that does is it brings you to this screen, and I intentionally left the tabs at the bottom here with no icons, no text on to leave it up to you, whatever you want to put on them.
[00:01:37] But this is just saying this is gonna be a tab interface and we want to be able to slide between these tabs or also tap the icons at the bottom to go to those tabs. So we wanna go to do that. But right now we have this little nap bar at the top that just says, Current Workout.
[00:01:50] And then because you don't have any exercises in your current workout, you can just hit the plus. But just by looking at this you can see that we need a few things other than tabs I just talked about, we also need things like track in the current workout, exercises being added.
[00:02:06] So you can kinda think of this stuff as you go and we build out our app and in this state stuff with Redux, so you can think about what reducers and stuff we might need for this application. So we click this, we get a modal that slides up, and then here it's immediately, it's gonna have this search bar up at the top.
[00:02:23] And you can start typing and then there's gonna be a fuzzy searcher there. I'm gonna have build out for you. But if you're feeling awesome, you can build out that fuzzy searcher yourself too, it's not that complicated, but that's gonna be built for you. You just have to build the components, but as you type this is gonna be a list of exercises that you can do.
[00:02:39] The app is already, gonna be populated with some exercises there for you. So you don't have to hard code these exercises in, they are already hard coded for you. And then after that, you can select an exercise or click this x button here and let's select an exercise and it'll bring you back to the screen where it will list your exercise.
[00:02:55] I did make a design for that cuz I wanna leave it up to you, how you want to display them on the page as well. I think your eyes are gonna be a little different there. But that's basically it. So you can hit x as well and it'll drop down a modal.
[00:03:05] So you can think of other possible screens as being a few swipes at a right it will show the history of all the exercises that you've ever done.
>> [SOUND].
>> Scott: Or if you go to the right even more, maybe there's a settings page where you can change units from pounds to whatever else you want to use and stuff like that.
[00:03:22] So there's a tons of options you can do that, we're just gonna do the basic thing to get started.