Building A Web App With AI: Part 3

Well I finally reached a point where I can call this project done. It's not perfect, but it's functional. It does exactly what I need it to do and that's enough. I can now reveal what I've been working on. It's a web app for fitness enthusiasts who need help creating a daily meal plan.

What's The Problem?

This came about because I see lots of general advice for people who want to reach a certain weight. There are usually four things you need to take into account whether you are gaining or losing weight:

1. Your target calories for the day.
2. The amount of protein to consume in a day (usually in grams).
3. The amount of carbohydrates to consume in a day (usually in grams).
4. The amount of fats to consume in a day (usually in grams).

If you can get those four things aligned then you should be able to reach your weight goal.

The problem is that the rest is left up to you. Figuring out what foods to eat to meet all those targets can be a challenge. It can take a lot of experimentation and research if you don't know where to start.

Wouldn't it be nice if someone could at least give you a meal template to start with? How about a daily meal plan that gave you examples of what to eat for breakfast, lunch and dinner that would meet your daily targets? Well that's what my app does. I called it Fit Food Bot because the original name I had in mind was already taken. You can check it out here:

https://fitfoodbot.com/

What Was The Final Step?

In my last installment, I was left with a functional app but it was still in GitHub and I needed a way to deploy it so anyone could use it. I know there are several services available for hosting a web app but I already have an Azure account so I figure I'd start there.

As it turns out, I found a tutorial that showed me how to transfer a Streamlit app straight from GitHub to Azure. And it was super easy.

There was a little bit of setup involved but I found it very easy to get the web app service created and connect it to my GitHub repository. The only issue I ran into was I had specify the port for the web app to use. I won't go into the details here because this isn't meant to be a tutorial but suffice it to say that I was able to figure it out after some experimentation. One really nice thing about using Azure is that I was able to register a custom domain name and associate that with my web app all from the Azure portal. By default, Azure assigns all web apps a URL that looks like this: https://<your web app name>.azurewebsites.net.

Another cool thing about using Azure is that it automates what's known as CI/CD (continuous integration/continuous deployment). That means that every time I make a change in my code on the GitHub repository, the web app gets automatically rebuilt and redeployed to the site.

What Did I Learn?

As I come to the third, and final, installment in this series, I can reflect on what I've learned in this process. I started this project to see how easy it would be create a web application from scratch and have it leverage ChatGPT. Here's what I found out:

1. ChatGPT is a great place to start but it won't give you all the answers. There was some troubleshooting and research I still had to do on my own to get the web app working. Still, it provided a lot of code that I could start with.
2. Don't get stuck on a certain methodology. I really wanted to build the web app from scratch but that would have taken a lot longer. Once I gave myself permission to use Streamlit, the process went by much quicker.
3. Leverage the tools that are available. I could have done all the development on my laptop and then figured out a way to manually upload the code to a web site. Instead, I used GitHub's Codespaces to write and test the code. I then used the Azure web app service to integrate directly with GitHub to get the web app deployed.

What's Next?

I'm not sure what I will build for my next project. But one this is certain, it's a lot easier than it used to be. And you don't need to be a seasoned programmer to leverage modern tools that will make the process go much faster.