I Built a Dashboard That Tracks My Whole Life with Claude (Complete 10-Min Build)

Added: 2026-05-25

[00:00:00]So in this video we are going to be making the dashboard from complete scratch. I have a new computer and currently what we have up to date on episode 3. And if you see my content, my reels, we are going to be building this from scratch. No money involved besides Claude of course. But let's make this thing and I'm going to make this as simple as I can and this should be very fun to make. All right, so we have the dashboard here and we are going to make this basically in 10 minutes summing up episode 1 and 3 all together for new viewers and anyone that had any issues I think this will be a lot easier. We have the day tracker. This goes from 8:00 a.m. to 12:00 a.m. You can easily change it by VS code or I think I'm going to add an option to change this as well.

[00:00:39]And then we have our to-do list which is something like do our homework.

[00:00:44]Let's say we have to do homework today.

[00:00:46]We'll add it, we can prioritize it and we can check it. And we also can say make a TikTok.

[00:00:53]So we want to do this and we can add it up here or put it down, prioritize it, check it, whatever we want to do.

[00:01:00]And once you check it, it'll also have this green cool thing up here and we can see our day streak of completing our goals. And let's say for our homework we can't do it tonight and we just want to move it down. We'll say push remaining to tomorrow. And then for tomorrow we will have this goal. And we can also add goals for tomorrow. Let's say we have back day tomorrow, sauna. So we can add this here and then tomorrow this will be on our goals list which is pretty cool.

[00:01:23]And for the health section we have our supplements which I added something with AI where it knows almost every single supplement that you would take. So let's say we want to take creatine, it'll be right here and it automatically knows usually 5 g. You can change this. Let's say we'll take it at lunch time and we are running low or we can check it off, anything like that.

[00:01:42]And let's say for the morning we're taking L-theanine 200 mg.

[00:01:47]It automatically knows the morning, we can delete all these as well.

[00:01:51]And if you don't do it in time, it'll start to flash red and it'll let you know you missed it. If you don't do it by 10:00 a.m., you can obviously change this as well. And then we also can add something like magnesium glycinate, something we would take at night, and we can just say 400 mg at Let's say we're running low or something, and we can check all this off.

[00:02:11]And for the water tracker, this is something that took me a while to make.

[00:02:14]It is pretty cool because you can adjust it to yourself in the settings icon. And lb, whatever, kg. We'll say we weigh 70 kg. We're 19 years old, and we're male.

[00:02:23]We work out for 10 hours or train 10 hours a week.

[00:02:27]We take 300 mg of caffeine, and we are on Concerta 18 mg. And we are also on stimulants like Vyvanse. Let's say we take 18 of these, or 18 mg of these. And we'll just say done.

[00:02:42]And then this automatically knows that we should drink nine water bottles a day, and everything is in this water bottle.

[00:02:47]And I just uploaded the ml and figured it out, and I put it in here. So, for your water bottle, you can just do this, or let's say you drink out of a glass, you can do that as well. And you can also do an ounces or ml, however you would want to do it.

[00:02:59]And then we'll just say done. Drink water. Everything tracks in the last 14 days. We can also see why we're drinking 4 L of water per day. Yeah, that's pretty much it. Also, I made this stay at the top because something about the water is not every time you're not going to want to navigate to health and scroll down, so I just added it here. So, let's say we're going to add some water. We just drank two water bottles, so now that's four. Automatically updated. And something I can't show right now is that we have a fat tracker or a muscle gain tracker. So, it basically tracks your weights and the amount of weight you go up every day. So, let's say tomorrow you weigh 70 kg and you went up. So, let's say your bench press was 60 kg, you went up to 65, and you gained a kg.

[00:03:40]It'll calculate this and tell you, "Yeah, maybe the weight you gained was most likely muscle." Or if it's a muscle, and this UI will be right here as well.

[00:03:48]And we can also add progress photos.

[00:03:50]Just add them from your library, take the photo on your phone, and we can compare them. Obviously, this was the same day, so there's no comparison.

[00:03:57]And we also have settings here where we can add our gym schedule. Let's say we're doing push, pull, legs, rests. You can obviously remove and do all this stuff with it, so I'll just add a rest day. And then we can do LB or KG. And then also, we might have three gyms we're going to. We might have one. So, we can add a gym, we can edit the name of these gyms. And let's say for our home gym, we do DB press. And this is for both most likely, so we'll just say maybe 25 each arm and 6 to 8 increment, usually two or 2.5. We'll say two here.

[00:04:26]And we'll see our rep range. We want to do 6 to 8 for progressive overload, obviously. And let's say that we just did seven reps here. And then we do it again, we do eight reps, and we can see we're going up as well. And it says, "You hit eight reps, time to add 2 KG.

[00:04:40]Expect 6 to 7 next session." This is just an overall view of how you're going to do if you add 2 KG. And you can also change the increments as well. You can always edit, like here, if I want to change the increment to three or two or whatever, we can do that. Everything in your workout is automatically tracked here, two sets. And when you're done, you just mark your workout done, and it'll be in your past workouts tomorrow as well.

[00:05:01]And the cool thing here is that you have progress photos, your weight tracked, so you can really see what you're doing.

[00:05:06]And yeah, just mess around with this, and this should be very beneficial to your gym. And you can also do this on your phone. Everything updates to your phone. And also, up in the top right, we have the net worth section. And I already messed with this a little bit, but let's say we have a stock one account, and there's 5,000 USD in there.

[00:05:23]We'll see the pie chart starts to formulate, we'll see 1% of our net worth. And we'll see all this data here.

[00:05:28]And let's say we have a stock account with $40,000. This will be updated to our pie chart, we'll see the graph go up. And let's say we have Bitcoin, 20,000, or cash, or whatever other asset we would have, we can say 6,000 here.

[00:05:43]And then now we see our net worth, everything is updated, and we can change the currency or whatever we would want to change or delete or something. And then we have subscriptions. So, let's say we have a cloud subscription, and it is $200 a month, and it every single 23rd, let's say that it will charge you.

[00:06:00]And we can also auto deduct this, so we know that $200 will be taken out of our account every 23rd. So, every time that this happens, we'll automatically be auto deducted, so we can stay on our finances and not have to manually do it.

[00:06:10]And we'll add it, and obviously it's going to start to flash red after 5 days cuz so, you know that the money's not going to be automatically taken out of your account, of course. And we can add or edit anything.

[00:06:19]And then for orders, let's say that we just bought an iPhone, and it was 1,000 USD. And we'll say we bought this today, and we can also see it's 1.41% of our net worth, and we can also deduct this from our star one, for example, automatically. Or let's say we bought a laptop for 5,000 USD that is going to come in 5 days. We can also add this and deduct it from our Vanguard, let's say.

[00:06:43]We'll be able to know when it's going to come and stuff, which is pretty cool, in 5 days. And let's say we have a wish list. We really want to buy a BMW, and this is, let's say, 500k USD. We can see that this is 76.92% of our net worth.

[00:06:56]Let's say we want another BMW that is very expensive, 200,000. Like, this is like a bucket list goal. We'll see that this would be 384.62% of our net worth. We obviously can't buy it. Just to have overall view of what we want, we can track what we want. Maybe we'll forget that we wanted something and come back to it. All of this is just very good to stay organized with your finances because we know how subscriptions are and how they can, you know, just take money out of your account without you realizing. And this can also motivate you to make more money by seeing it go up, seeing your pie chart, and just having an overall view.

[00:07:26]Also, for recent activity, we can see that everything will be taken out. Um we bought an iPhone and a laptop, so it's automatically taken out of whatever account we took it out of.

[00:07:35]And yeah, so this is everything that we have. Let me know if you have any questions or something isn't working in this tutorial, and let's build this in like 10 minutes. So, go to my link in description or search up Visual Studio Code or VS Code and we're just going to download it. The button will be right here. And then we're just going to open the file, of course. And then when we open the file, we're just going to see this. Move it to your applications.

[00:07:56]Also, for Windows, it will be the same thing. And then you're just going to open VS Code down here. You can click this twice, open, of course. And now it is officially on our computer. And some things we're going to want to do first is, of course, download Cloud Code. So, we're going to click these four squares right here.

[00:08:12]And then we're just going to search up Cloud, which is already installed. So, if you don't have it, I'll just uninstall it real quick. Delete this section and this section.

[00:08:21]And then click this Cloud button.

[00:08:24]And then click new set.

[00:08:26]And then now we're just going to sign in with our Cloud AI subscription. And you can also run Pro or whatever subscription you have, as long as you're paying money, this will work. So, we're just going to sign in.

[00:08:38]All right. So, now that we have VS Code set up, we don't actually fully have it set up yet, but let's make this into our Versal. So, the first thing we're going to do is go to my yt-1, um, first link in the in the description, and we are just going to fork it. So, click this fork button.

[00:08:56]Create new fork.

[00:08:58]And then we are just going to call it.

[00:09:00]Remember this file name? We're just going to call it row.

[00:09:04]And then now this is forked to our own GitHub account. So, the first thing we're going to do now is open a new window in VS Code, and we are going to open up Cloud, of course, in a new session.

[00:09:18]And we also have to sign up with our GitHub account that we forked this to.

[00:09:22]So, we're going to click this icon accounts icon right here. And then we're going to click this and then click backup and sync settings.

[00:09:30]And then click sign in and we are going to sign up with our GitHub. And then we're just going to continue with our GitHub account and authorize, but now our GitHub is connected here and we also need to connect it to our source control. And we are just going to click the clone repository, clone from GitHub and allow.

[00:09:49]And then authorize this as well.

[00:09:54]And then you might need to verify. And then now we are authorized and we will see our new row right here that we created that we forked. And we're just going to click this and select repository destination.

[00:10:09]And then open.

[00:10:11]And then trust. Yes, I trust the authors.

[00:10:15]And now we're just going to open up Claude, new session, exit out.

[00:10:21]And we are going to open up the terminal, view, terminal.

[00:10:27]You are going to need to type this code um into your terminal first so you can install Git as well. So we're just going to copy this in and I already have it downloaded so it'll say something like this, but if you don't have it downloaded it'll direct you to download it and that's all you need to do.

[00:10:41]And the next thing we're going to do is go to our And the next thing we're going to do is we are going to go to our forked GitHub and we are just going to copy this to clipboard at the HTTPS.

[00:10:53]And we are going to say Git clone and then copy and paste this in here.

[00:10:57]And then we are going to say CD and then row or whatever you named your thing. So here, I named my forked GitHub repo row. So whatever you named it, you're just going to say the same thing and enter. And now we are just going to add new project in Vercel and then we will see our row right here that we just created and we'll just click import. If this is your first time using Vercel, there's just going to be a button here to sign up with your GitHub and just click that and authorize and then you'll be directed to this screen and you're just going to import.

[00:11:31]And then you don't have to change any settings here. Just click deploy. And then now we're just going to open this.

[00:11:36]We're going to see our dashboard. And to make sure that we can make changes with no problem, we're just going to say change my dashboard to Rowan or whatever your name is. So, we'll say Rowan's dashboard. Say push to get. And then now it is fully updated to Rowan's dashboard. And now we can make changes and um I had to backtest this. So, sorry that I'm in a different location. But, let's get to the rest of the stuff and this will be very easy. So, So, now we're going to sign in with Superbase and we're just going to connect it with our GitHub account, of course.

[00:12:12]So, go to sign up. Continue with GitHub.

[00:12:15]And then just authorize with your GitHub account. And then all of this should just be normal and we're just going to create. And then we're going to go back Okay, so now when Superbase is open, we're going to go back to my SQL GitHub repo, which you'll find in the description below, the first one.

[00:12:34]And we're just going to go into the SQL and we're going to copy and paste this whole thing and go back to Superbase SQL editor show V and then run. And then it should say success, no rows returned if everything is good. So, after the SQL, we're going to go to the VS code prompt in the same GitHub repo. Copy and paste this. And we're just going to have to put two keys in, which is very simple.

[00:12:57]Um I can also make this a bit bigger.

[00:13:00]And we're just going to go to the search bar and type in URL. And then we're just going to copy the URL and then we're just going to replace it with the paste link. And we are going to type in keys, get API keys, and then just copy the publishable key.

[00:13:16]And then we're going to replace that with the paste right here. And then we're just going to push it and we're going to see the SQL third. I'm sorry it's called this, it makes it a bit confusing. But, all we're going to do is copy and paste this whole thing, and we're just going to put it into our VS code, and then we're going to say push.

[00:13:34]Okay, to add this to our phones, we can always use it. I have my phone pulled up right here.

[00:13:39]And, we're just going to go to Safari or whatever web browser, and we are just going to copy and paste this URL into our phone.

[00:13:46]Enter. And then now we have our complete dashboard set up here.

[00:13:50]I can tell that we do have some UI issues, but we'll fix that in a second.

[00:13:54]And, what we're going to do is just click the three lines, and we're going to say share, [snorts] and then view more, add to home screen. We'll see that we have it here, and we'll just click it, and it is fully accessible on our phone. Let's go back to my Git repo, and go here, and copy and paste this prompt, and say push. So, control V, and then say push at the end. I already did this, so I don't need to again. And then, the UI should be fixed, but I think we should go back and not make the tabs at the top. I think it's a little bit tricky, and it shouldn't be this way, so we'll change this right now. So, the first thing I noticed when I'm back testing my app on my phone, is that we noticed that, you know, in the finance section, it does look, you know, very good with the bars at the bottom. I think this is what it should be.

[00:14:38]And then, maybe we should just leave the finance section at the top up here.

[00:14:42]So, I think this is what we're going to do.

[00:14:44]And, I will currently right now just make and edit this, and then this will be in the Git repo, and then y'all can just copy and paste this prompt in yourself, and it'll change for you.

[00:14:54]Okay, so I have my phone pulled up here, and this is what it should look like from the phone with the new fixes.

[00:15:00]Um, the connection for some reason is absolutely terrible, but we have the bars here. We have our finance section in the top right, and we can go back this way, and we are just going to control V, and then say push. That's it.

[00:15:13]I already have this obviously changed to mine, but that's all you're going to do to get the exact same look of my phone. Okay, so one more thing for Superbase is that you're going to have to do a gym fix.

[00:15:24]I'm really sorry for this, but all you're going to have to do is just copy and paste gym fix one to VS Code and just deploy it. And then once this is done, we're just going to go to gym fix two and we're going to copy and paste this whole thing, go to our Superbase, go to our SQL where we did the first one, add a new one, copy and paste it in here, run run query. Then it should say success no rows returned if everything is good.

[00:15:48]Yep, so everything is good here. And also make sure that this is done. So, all changes were applied and it says nothing here because I've already done this, of course, and this will fix everything. So, now let's just back test this real quick. All right, so now that we've done this, we're just going to delete the current dashboard that we have made and we're just going to go into Safari and once more we're just going to copy and paste this link.

[00:16:12]So, YT final and then we're just going to share a few more, add to home screen and then name it whatever we want to name it, YT app. Let's name it that.

[00:16:21]And then now it's going to be open on our phone. And let's just test how um the photos are. So, let's take a photo.

[00:16:30]And we'll see how this updates to our new dashboard. And then now we can see our picture from our phone and our computer and we'll just make sure by uploading just a random screenshot in here just to make sure that we can also see this on our phone. And now we can also see with our phone that it is crossed. So, now everything works and let's just fix one more thing. This is completely optional, by the way. I just don't want you guys to have, you know, this messed up goals tab. So, we're just going to fix this real quick and this will be the last GitHub repo and then we are done. And then um just very simple, we'll just go into the last UI fix in my GitHub repo, copy and just paste it into our cloud code and this will fix how this looks on the phone. And yeah. So, this is it for the video and now everyone is caught up, and I think this is a you know um very more simple, so you don't have to watch all three episodes and go back and forth with everything.

[00:17:25]I'm sorry if this video seemed a little, you know, like you had to go back and do some stuff, but I promise that everything we did here is necessary, and I just want to thank y'all for watching.

[00:17:35]And we have more coming. We're going to be working with this dashboard from now on, and we are going to be adding a bunch of cool stuff. Um my next video, which I'm working on currently right now, is a health tracker that is paired with your phone.

[00:17:47]So, your phone basically knows when you're sleeping based off your alarm and when you're on it and stuff, so you can easily put this in your dashboard without a Fitbit or whatever you would use, an Apple Watch, Whoop.

[00:17:58]And it could track your sleep, and this can go into a lot of things into our dashboard that could help us with our overall life. So, we're going to be working on this in the next video, and I just want to thank y'all so much for watching, and bye.