{"id":9330,"date":"2024-10-11T11:07:43","date_gmt":"2024-10-11T11:07:43","guid":{"rendered":"https:\/\/metaschool.so\/articles\/?p=9330"},"modified":"2024-12-09T04:23:17","modified_gmt":"2024-12-09T04:23:17","slug":"ai-powered-personal-fitness-coach","status":"publish","type":"post","link":"https:\/\/metaschool.so\/articles\/ai-powered-personal-fitness-coach\/","title":{"rendered":"AI-Powered Personal Fitness Coach Using GPT-4"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_56_1 ez-toc-wrap-left counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title \" >Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/metaschool.so\/articles\/ai-powered-personal-fitness-coach\/#Setting_up_the_environment\" title=\"Setting up the environment\">Setting up the environment<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/metaschool.so\/articles\/ai-powered-personal-fitness-coach\/#Creating_our_backend\" title=\"Creating our backend\">Creating our backend<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/metaschool.so\/articles\/ai-powered-personal-fitness-coach\/#Setting_up_the_user_interface\" title=\"Setting up the user interface\">Setting up the user interface<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/metaschool.so\/articles\/ai-powered-personal-fitness-coach\/#Explore_more_on_Metaschool\" title=\"Explore more on Metaschool\">Explore more on Metaschool<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/metaschool.so\/articles\/ai-powered-personal-fitness-coach\/#FAQs\" title=\"FAQs\">FAQs<\/a><\/li><\/ul><\/nav><\/div>\n\n<p>Artificial Intelligence is changing how we think, operate, and act with machines. Here we will build an AI-powered personal fitness coach who can tailor a personalized workout plan based on your lifestyle, future goals, and current fitness level. It is possible in this era of Artificial Intelligence without leaving your home. An AI-powered personal fitness coach can generate personalized workout plans using GPT-4, a remarkable language model from OpenAI.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" src=\"https:\/\/i.giphy.com\/media\/v1.Y2lkPTc5MGI3NjExYzI3eDhsOGtqcmMwbHhkbTVjc2ptbnhia2ZoMndwMGljZWt5dG5jYyZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw\/TTPi3fB9F5Aqs\/giphy.gif\" alt=\"Fitness Freak meme\"\/><\/figure>\n<\/div>\n\n\n<p>In this article, we&#8217;ll build an AI-powered personal fitness coach who can be a fun workout buddy throughout your fitness journey. The making of an AI-powered personal fitness coach can be a game changer in your life. It can enable a vast majority of users to start their journey having no clue about where to start from. While some people take help from Google for their fitness plan others may follow trending YouTube channels. But usually, these sources offer one generic plan for everyone. This is where the problem starts because every human has a unique body, different goals, and strengths or weaknesses as compared to others.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" src=\"https:\/\/i.giphy.com\/media\/v1.Y2lkPTc5MGI3NjExenQ5ODRpcGFjeWU2YTJtMDU5bnpveDh6bWk1aXNscWtyaWY4ZHgzZCZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw\/bPfljwCtTPBYI\/giphy.gif\" alt=\"Same plan not for everyone meme\"\/><\/figure>\n<\/div>\n\n\n<p>To solve this problem, we need personalized assistance. This is where AI comes to the rescue to support you in your fitness journey! An AI-powered personal fitness coach can recommend a workout plan based on your input like age, weight, and fitness level. Seems cool, right? Let&#8217;s get into it and start building it from scratch.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" src=\"https:\/\/i.giphy.com\/media\/v1.Y2lkPTc5MGI3NjExNjNhOGFjZ3czMnVwNXZqbzkzeng5N2c3bDBzNHJhbjNibmhmN2VoNCZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw\/6oPX2tXHiVtkefifPi\/giphy.gif\" alt=\"Meme to start development\"\/><\/figure>\n<\/div>\n\n\n<p>Let\u2019s walk through each step to make it easy for you to follow.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Setting_up_the_environment\"><\/span>Setting up the environment<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Alright, buddy, the first thing we need to do is to set up a development environment. We need to set up an environment that is suitable for AI integration and web application development. We\u2019re going to use Flask for our web framework, trust me it&#8217;s super easy to use, and Python as a background programming language. We\u2019re going to use Flask to create a simple web app that will interact with GPT-4 API. Have you ever heard of Flask earlier? If don\u2019t, no worries.<\/p>\n\n\n\n<p>Flask is a web framework that supports us when we just want to get things done. It is a lightweight web framework to create the web interface. We\u2019ll be using the Flask server to run our application on top of our local server. To ensure we can use Python and Flask seamlessly, let\u2019s first install these on our system.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Install Python and Flask<\/h3>\n\n\n\n<p>Firstly we need to ensure Python is installed on our system. Use the terminal to check if it is already installed by running the following command on our terminal.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"python --version      \n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #A6E22E\">python<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #AE81FF\">--version<\/span><span style=\"color: #F8F8F2\">      <\/span><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>If you see a version number just pops up, congrats, you\u2019re good to go. If it\u2019s not installed, don\u2019t panic, head over to <a href=\"https:\/\/www.python.org\/\" target=\"_blank\" rel=\"noopener\">python.org<\/a> and download it on your system.<\/p>\n\n\n\n<p>Once it is sorted, now open your terminal and create a new project directory as follows:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"mkdir fitness-coach\ncd fitness-coach\n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #A6E22E\">mkdir<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">fitness-coach<\/span><\/span>\n<span class=\"line\"><span style=\"color: #66D9EF\">cd<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">fitness-coach<\/span><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>Now let\u2019s install Flask and OpenAI, the backbone of our system as follows.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"pip install flask openai\n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #A6E22E\">pip<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">install<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">flask<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">openai<\/span><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Initialize the OpenAI API<\/h3>\n\n\n\n<p>Now let&#8217;s bring the brain of our system\u2014The OpenAI API. To use OpenAI\u2019s API, we\u2019ll need to sign up over the <a href=\"https:\/\/auth.openai.com\/authorize?issuer=auth0.openai.com&amp;client_id=DRivsnm2Mu42T3KOpqdtwB3NYviHYzwD&amp;audience=https%3A%2F%2Fapi.openai.com%2Fv1&amp;redirect_uri=https%3A%2F%2Fplatform.openai.com%2Fauth%2Fcallback&amp;device_id=79f0c5cc-7af3-44c6-92af-a27fb1360484&amp;screen_hint=signup&amp;max_age=0&amp;scope=openid+profile+email+offline_access&amp;response_type=code&amp;response_mode=query&amp;state=TFRnMWxoVDNaUzRYTHNjT1lCRG41aXhaSDVVSzRZdkNJLUwyZFZOa3pTbA%3D%3D&amp;nonce=UH5yeXZyZGZpaktGbXVTcEVuR0EubWNuRzQ4WDh3cW4yTUk3ZjNESk9WZQ%3D%3D&amp;code_challenge=dmp6f15OrXFYmTbE8i5zJUHzaMmlp1lVKXSirfX43GU&amp;code_challenge_method=S256&amp;auth0Client=eyJuYW1lIjoiYXV0aDAtc3BhLWpzIiwidmVyc2lvbiI6IjEuMjEuMCJ9&amp;flow=control\" target=\"_blank\" rel=\"noopener\">OpenAl platform<\/a> and create an account. After signing in, move towards the API keys section and generate a new key. Keep this key safe because it&#8217;s your golden ticket to access the GPT models.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"1082\" style=\"aspect-ratio: 1920 \/ 1082;\" width=\"1920\" autoplay loop muted src=\"https:\/\/metaschool.so\/articles\/wp-content\/uploads\/2024\/10\/signup_openai-ezgif.com-cut-online-video-cutter.com_.mp4\" playsinline><\/video><\/figure>\n\n\n\n<p>If you face any difficulty during the signup and API key generation follow this <a href=\"https:\/\/metaschool.so\/articles\/openai-api-key\/\">guide to use OpenAI API<\/a> to learn more about OpenAI API\u2019s. We also need to ensure our API is not exposed throughout the creation process.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Securing our OpenAI API<\/h3>\n\n\n\n<p>Once you get an OpenAI\u2019s AP, now it&#8217;s time to ensure the API key remains secured throughout the process. To securely use our API, we can set it as an environment variable. We need to create a <code>.env<\/code> file in our project directory by using the following command:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"# For Mac users\necho &quot;OPENAI_API_KEY=your_api_key_here&quot; &gt; .env\n\n# For Windows users\necho OPENAI_API_KEY=your_api_key_here &gt; .env.    # Using Command Prompt\n\necho &quot;OPENAI_API_KEY=your_api_key_here&quot; &gt; .env.  # Using PowerShell\n\n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #88846F\"># For Mac users<\/span><\/span>\n<span class=\"line\"><span style=\"color: #66D9EF\">echo<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">&quot;OPENAI_API_KEY=your_api_key_here&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #F92672\">&gt;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">.env<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #88846F\"># For Windows users<\/span><\/span>\n<span class=\"line\"><span style=\"color: #66D9EF\">echo<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">OPENAI_API_KEY=your_api_key_here<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #F92672\">&gt;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">.env.<\/span><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #88846F\"># Using Command Prompt<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #66D9EF\">echo<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">&quot;OPENAI_API_KEY=your_api_key_here&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #F92672\">&gt;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">.env.<\/span><span style=\"color: #F8F8F2\">  <\/span><span style=\"color: #88846F\"># Using PowerShell<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>In these commands replace <code>your_api_key_here<\/code> with your actual API key and execute the respective command based on your system preference.<\/p>\n\n\n\n<p>To ensure our application can read this API key. We can use <code>python-dotenv<\/code> package to manage this process as follows:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"pip install python-dotenv\n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #A6E22E\">pip<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">install<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">python-dotenv<\/span><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>In this way, we can keep it secret, just like you don\u2019t tell anyone about your cheat meals. \ud83c\udf55\ud83d\ude1c<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Creating_our_backend\"><\/span>Creating our backend<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>In our project folder, create a new Python file called <code>app.py<\/code>. We can create it using the following command:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"# For Mac user\ntouch app.py\n\n# For Windows user\necho. &gt; app.py  # Using command prompt\nNew-Item -Path app.py -ItemType File # Using PowerShell \n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #88846F\"># For Mac user<\/span><\/span>\n<span class=\"line\"><span style=\"color: #A6E22E\">touch<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">app.py<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #88846F\"># For Windows user<\/span><\/span>\n<span class=\"line\"><span style=\"color: #66D9EF\">echo<\/span><span style=\"color: #F8F8F2\">. <\/span><span style=\"color: #F92672\">&gt;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">app.py<\/span><span style=\"color: #F8F8F2\">  <\/span><span style=\"color: #88846F\"># Using command prompt<\/span><\/span>\n<span class=\"line\"><span style=\"color: #A6E22E\">New-Item<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #AE81FF\">-Path<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">app.py<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #AE81FF\">-ItemType<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">File<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #88846F\"># Using PowerShell <\/span><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>This file will serve as the brain of our operations. Open <code>app.py<\/code> and add the following code:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"from flask import Flask, render_template, request\nimport openai\nfrom dotenv import load_dotenv\nimport os\n\n# Load environment variables from .env file\nload_dotenv()\nopenai.api_key = os.getenv(&quot;OPENAI_API_KEY&quot;)\n\napp = Flask(__name__)\n\n@app.route('\/')\ndef index():\n    return render_template('index.html')\n\n# Route to handle form submission and generate the workout plan\n@app.route('\/generate_plan', methods=['POST'])\ndef generate_plan():\n    # Collecting user input from the form\n    user_data = {\n        &quot;age&quot;: request.form.get('age', ''),\n        &quot;weight&quot;: request.form.get('weight', ''),\n        &quot;goal&quot;: request.form.get('goal', ''),\n        &quot;fitness_level&quot;: request.form.get('fitness_level', ''),\n        &quot;workout_frequency&quot;: request.form.get('workout_frequency', '')\n    }\n\n    # Generating the workout plan using GPT-4\n    try:\n        plan = generate_workout_plan(user_data)\n    except Exception as e:\n        # Handle any errors that occur during the OpenAI API call\n        plan = f&quot;Error generating workout plan: {str(e)}&quot;\n\n    # Rendering the result in the same HTML page\n    return render_template('index.html', plan=plan)\n\ndef generate_workout_plan(user_data):\n    # Creating a prompt for GPT-4 based on user input\n    messages = [\n        {&quot;role&quot;: &quot;system&quot;, &quot;content&quot;: &quot;You are an AI-driven fitness coach.&quot;},\n        {&quot;role&quot;: &quot;user&quot;, &quot;content&quot;: f&quot;Create a personalized weekly workout plan for the following individual:\\\\n\\\\n&quot;\n                                     f&quot;Age: {user_data['age']}\\\\n&quot;\n                                     f&quot;Weight: {user_data['weight']} kg\\\\n&quot;\n                                     f&quot;Goal: {user_data['goal']} (e.g., weight loss, muscle gain, endurance)\\\\n&quot;\n                                     f&quot;Fitness level: {user_data['fitness_level']} (e.g., beginner, intermediate, advanced)\\\\n&quot;\n                                     f&quot;Workout frequency: {user_data['workout_frequency']} times per week.\\\\n\\\\n&quot;\n                                     &quot;Provide day-wise workout plan with warm-ups, exercises, sets, reps, and advice for motivation and recovery.&quot;}\n    ]\n\n    # Using OpenAI's GPT-4 chat model to generate the workout plan\n    response = openai.ChatCompletion.create(\n        model=&quot;gpt-4&quot;,  # Specify the chat model\n        messages=messages,\n        max_tokens=300,  # Adjust the token size based on the complexity of the response\n        temperature=0.7  # Creative freedom for GPT-4\n    )\n\n    # Extracting the workout plan from GPT-4's response\n    workout_plan = response['choices'][0]['message']['content'].strip()\n    return workout_plan\n\nif __name__ == &quot;__main__&quot;:\n    app.run(debug=True)\n\n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F92672\">from<\/span><span style=\"color: #F8F8F2\"> flask <\/span><span style=\"color: #F92672\">import<\/span><span style=\"color: #F8F8F2\"> Flask, render_template, request<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F92672\">import<\/span><span style=\"color: #F8F8F2\"> openai<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F92672\">from<\/span><span style=\"color: #F8F8F2\"> dotenv <\/span><span style=\"color: #F92672\">import<\/span><span style=\"color: #F8F8F2\"> load_dotenv<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F92672\">import<\/span><span style=\"color: #F8F8F2\"> os<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #88846F\"># Load environment variables from .env file<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">load_dotenv()<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">openai.api_key <\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\"> os.getenv(<\/span><span style=\"color: #E6DB74\">&quot;OPENAI_API_KEY&quot;<\/span><span style=\"color: #F8F8F2\">)<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">app <\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\"> Flask(__name__)<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #A6E22E\">@app.route<\/span><span style=\"color: #F8F8F2\">(<\/span><span style=\"color: #E6DB74\">&#39;\/&#39;<\/span><span style=\"color: #F8F8F2\">)<\/span><\/span>\n<span class=\"line\"><span style=\"color: #66D9EF; font-style: italic\">def<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">index<\/span><span style=\"color: #F8F8F2\">():<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #F92672\">return<\/span><span style=\"color: #F8F8F2\"> render_template(<\/span><span style=\"color: #E6DB74\">&#39;index.html&#39;<\/span><span style=\"color: #F8F8F2\">)<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #88846F\"># Route to handle form submission and generate the workout plan<\/span><\/span>\n<span class=\"line\"><span style=\"color: #A6E22E\">@app.route<\/span><span style=\"color: #F8F8F2\">(<\/span><span style=\"color: #E6DB74\">&#39;\/generate_plan&#39;<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #FD971F; font-style: italic\">methods<\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\">[<\/span><span style=\"color: #E6DB74\">&#39;POST&#39;<\/span><span style=\"color: #F8F8F2\">])<\/span><\/span>\n<span class=\"line\"><span style=\"color: #66D9EF; font-style: italic\">def<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">generate_plan<\/span><span style=\"color: #F8F8F2\">():<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #88846F\"># Collecting user input from the form<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    user_data <\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #E6DB74\">&quot;age&quot;<\/span><span style=\"color: #F8F8F2\">: request.form.get(<\/span><span style=\"color: #E6DB74\">&#39;age&#39;<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #E6DB74\">&#39;&#39;<\/span><span style=\"color: #F8F8F2\">),<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #E6DB74\">&quot;weight&quot;<\/span><span style=\"color: #F8F8F2\">: request.form.get(<\/span><span style=\"color: #E6DB74\">&#39;weight&#39;<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #E6DB74\">&#39;&#39;<\/span><span style=\"color: #F8F8F2\">),<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #E6DB74\">&quot;goal&quot;<\/span><span style=\"color: #F8F8F2\">: request.form.get(<\/span><span style=\"color: #E6DB74\">&#39;goal&#39;<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #E6DB74\">&#39;&#39;<\/span><span style=\"color: #F8F8F2\">),<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #E6DB74\">&quot;fitness_level&quot;<\/span><span style=\"color: #F8F8F2\">: request.form.get(<\/span><span style=\"color: #E6DB74\">&#39;fitness_level&#39;<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #E6DB74\">&#39;&#39;<\/span><span style=\"color: #F8F8F2\">),<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #E6DB74\">&quot;workout_frequency&quot;<\/span><span style=\"color: #F8F8F2\">: request.form.get(<\/span><span style=\"color: #E6DB74\">&#39;workout_frequency&#39;<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #E6DB74\">&#39;&#39;<\/span><span style=\"color: #F8F8F2\">)<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    }<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #88846F\"># Generating the workout plan using GPT-4<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #F92672\">try<\/span><span style=\"color: #F8F8F2\">:<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        plan <\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\"> generate_workout_plan(user_data)<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #F92672\">except<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #66D9EF; font-style: italic\">Exception<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #F92672\">as<\/span><span style=\"color: #F8F8F2\"> e:<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #88846F\"># Handle any errors that occur during the OpenAI API call<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        plan <\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #66D9EF; font-style: italic\">f<\/span><span style=\"color: #E6DB74\">&quot;Error generating workout plan: <\/span><span style=\"color: #AE81FF\">{<\/span><span style=\"color: #66D9EF; font-style: italic\">str<\/span><span style=\"color: #F8F8F2\">(e)<\/span><span style=\"color: #AE81FF\">}<\/span><span style=\"color: #E6DB74\">&quot;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #88846F\"># Rendering the result in the same HTML page<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #F92672\">return<\/span><span style=\"color: #F8F8F2\"> render_template(<\/span><span style=\"color: #E6DB74\">&#39;index.html&#39;<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #FD971F; font-style: italic\">plan<\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\">plan)<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #66D9EF; font-style: italic\">def<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">generate_workout_plan<\/span><span style=\"color: #F8F8F2\">(<\/span><span style=\"color: #FD971F; font-style: italic\">user_data<\/span><span style=\"color: #F8F8F2\">):<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #88846F\"># Creating a prompt for GPT-4 based on user input<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    messages <\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\"> [<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        {<\/span><span style=\"color: #E6DB74\">&quot;role&quot;<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #E6DB74\">&quot;system&quot;<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #E6DB74\">&quot;content&quot;<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #E6DB74\">&quot;You are an AI-driven fitness coach.&quot;<\/span><span style=\"color: #F8F8F2\">},<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        {<\/span><span style=\"color: #E6DB74\">&quot;role&quot;<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #E6DB74\">&quot;user&quot;<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #E6DB74\">&quot;content&quot;<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #66D9EF; font-style: italic\">f<\/span><span style=\"color: #E6DB74\">&quot;Create a personalized weekly workout plan for the following individual:<\/span><span style=\"color: #AE81FF\">\\\\<\/span><span style=\"color: #E6DB74\">n<\/span><span style=\"color: #AE81FF\">\\\\<\/span><span style=\"color: #E6DB74\">n&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                                     <\/span><span style=\"color: #66D9EF; font-style: italic\">f<\/span><span style=\"color: #E6DB74\">&quot;Age: <\/span><span style=\"color: #AE81FF\">{<\/span><span style=\"color: #F8F8F2\">user_data[<\/span><span style=\"color: #E6DB74\">&#39;age&#39;<\/span><span style=\"color: #F8F8F2\">]<\/span><span style=\"color: #AE81FF\">}\\\\<\/span><span style=\"color: #E6DB74\">n&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                                     <\/span><span style=\"color: #66D9EF; font-style: italic\">f<\/span><span style=\"color: #E6DB74\">&quot;Weight: <\/span><span style=\"color: #AE81FF\">{<\/span><span style=\"color: #F8F8F2\">user_data[<\/span><span style=\"color: #E6DB74\">&#39;weight&#39;<\/span><span style=\"color: #F8F8F2\">]<\/span><span style=\"color: #AE81FF\">}<\/span><span style=\"color: #E6DB74\"> kg<\/span><span style=\"color: #AE81FF\">\\\\<\/span><span style=\"color: #E6DB74\">n&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                                     <\/span><span style=\"color: #66D9EF; font-style: italic\">f<\/span><span style=\"color: #E6DB74\">&quot;Goal: <\/span><span style=\"color: #AE81FF\">{<\/span><span style=\"color: #F8F8F2\">user_data[<\/span><span style=\"color: #E6DB74\">&#39;goal&#39;<\/span><span style=\"color: #F8F8F2\">]<\/span><span style=\"color: #AE81FF\">}<\/span><span style=\"color: #E6DB74\"> (e.g., weight loss, muscle gain, endurance)<\/span><span style=\"color: #AE81FF\">\\\\<\/span><span style=\"color: #E6DB74\">n&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                                     <\/span><span style=\"color: #66D9EF; font-style: italic\">f<\/span><span style=\"color: #E6DB74\">&quot;Fitness level: <\/span><span style=\"color: #AE81FF\">{<\/span><span style=\"color: #F8F8F2\">user_data[<\/span><span style=\"color: #E6DB74\">&#39;fitness_level&#39;<\/span><span style=\"color: #F8F8F2\">]<\/span><span style=\"color: #AE81FF\">}<\/span><span style=\"color: #E6DB74\"> (e.g., beginner, intermediate, advanced)<\/span><span style=\"color: #AE81FF\">\\\\<\/span><span style=\"color: #E6DB74\">n&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                                     <\/span><span style=\"color: #66D9EF; font-style: italic\">f<\/span><span style=\"color: #E6DB74\">&quot;Workout frequency: <\/span><span style=\"color: #AE81FF\">{<\/span><span style=\"color: #F8F8F2\">user_data[<\/span><span style=\"color: #E6DB74\">&#39;workout_frequency&#39;<\/span><span style=\"color: #F8F8F2\">]<\/span><span style=\"color: #AE81FF\">}<\/span><span style=\"color: #E6DB74\"> times per week.<\/span><span style=\"color: #AE81FF\">\\\\<\/span><span style=\"color: #E6DB74\">n<\/span><span style=\"color: #AE81FF\">\\\\<\/span><span style=\"color: #E6DB74\">n&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                                     <\/span><span style=\"color: #E6DB74\">&quot;Provide day-wise workout plan with warm-ups, exercises, sets, reps, and advice for motivation and recovery.&quot;<\/span><span style=\"color: #F8F8F2\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    ]<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #88846F\"># Using OpenAI&#39;s GPT-4 chat model to generate the workout plan<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    response <\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\"> openai.ChatCompletion.create(<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #FD971F; font-style: italic\">model<\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #E6DB74\">&quot;gpt-4&quot;<\/span><span style=\"color: #F8F8F2\">,  <\/span><span style=\"color: #88846F\"># Specify the chat model<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #FD971F; font-style: italic\">messages<\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\">messages,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #FD971F; font-style: italic\">max_tokens<\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #AE81FF\">300<\/span><span style=\"color: #F8F8F2\">,  <\/span><span style=\"color: #88846F\"># Adjust the token size based on the complexity of the response<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #FD971F; font-style: italic\">temperature<\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #AE81FF\">0.7<\/span><span style=\"color: #F8F8F2\">  <\/span><span style=\"color: #88846F\"># Creative freedom for GPT-4<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    )<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #88846F\"># Extracting the workout plan from GPT-4&#39;s response<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    workout_plan <\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #F8F8F2\"> response[<\/span><span style=\"color: #E6DB74\">&#39;choices&#39;<\/span><span style=\"color: #F8F8F2\">][<\/span><span style=\"color: #AE81FF\">0<\/span><span style=\"color: #F8F8F2\">][<\/span><span style=\"color: #E6DB74\">&#39;message&#39;<\/span><span style=\"color: #F8F8F2\">][<\/span><span style=\"color: #E6DB74\">&#39;content&#39;<\/span><span style=\"color: #F8F8F2\">].strip()<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #F92672\">return<\/span><span style=\"color: #F8F8F2\"> workout_plan<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F92672\">if<\/span><span style=\"color: #F8F8F2\"> __name__ <\/span><span style=\"color: #F92672\">==<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">&quot;__main__&quot;<\/span><span style=\"color: #F8F8F2\">:<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    app.run(<\/span><span style=\"color: #FD971F; font-style: italic\">debug<\/span><span style=\"color: #F92672\">=<\/span><span style=\"color: #AE81FF\">True<\/span><span style=\"color: #F8F8F2\">)<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>Let\u2019s pause and understand what\u2019s happening inside <a href=\"http:\/\/app.py\" target=\"_blank\" rel=\"noopener\"><code>app.py<\/code><\/a> file. We started by importing some packages like <code>Flask<\/code> for our web framework and <code>openai<\/code> for interacting with the GPT-4 model. We load our API key from the environment variables using <code>dotenv<\/code>. Following setting up our web routes, we initialized two routes <code>\"\/\"<\/code> for displaying the homepage and <code>\"\/generate_plan\"<\/code> to process the information gathered from the form, passing it to GPT-4, and displaying the workout plan.<\/p>\n\n\n\n<p>Once our backend is completed, let&#8217;s talk about the form that will gather information from the user.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Setting_up_the_user_interface\"><\/span>Setting up the user interface<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Fitness apps usually have a sleek and simple interface as no one likes a complicated form. Let\u2019s try to keep it clean, just like our well-balanced diet. \ud83d\udcaa<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">HTML structure<\/h3>\n\n\n\n<p>Inside our project folder, create a new folder named <code>templates<\/code>. Inside this new folder, create an HTML file named <code>index.html<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"mkdir templates\ntouch templates\/index.html\n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #A6E22E\">mkdir<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">templates<\/span><\/span>\n<span class=\"line\"><span style=\"color: #A6E22E\">touch<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">templates\/index.html<\/span><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>Following is the HTML code used to set up our form. Here it allows users to input their information.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"<!DOCTYPE html&gt;\n<html lang=&quot;en&quot;&gt;\n<head&gt;\n    <meta charset=&quot;UTF-8&quot;&gt;\n    <meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;\n    <title&gt;AI Fitness Coach<\/title&gt;\n    <link rel=&quot;stylesheet&quot; href=&quot;{{ url_for('static', filename='style.css') }}&quot;&gt;\n<\/head&gt;\n<body&gt;\n    <div class=&quot;container&quot;&gt;\n        <h1&gt;AI-Driven Fitness Coach<\/h1&gt;\n        <form action=&quot;\/generate_plan&quot; method=&quot;POST&quot;&gt;\n            <label for=&quot;age&quot;&gt;Age:<\/label&gt;\n            <input type=&quot;number&quot; id=&quot;age&quot; name=&quot;age&quot; required&gt;\n\n            <label for=&quot;weight&quot;&gt;Weight (in kg):<\/label&gt;\n            <input type=&quot;number&quot; id=&quot;weight&quot; name=&quot;weight&quot; required&gt;\n\n            <label for=&quot;goal&quot;&gt;Fitness Goal:<\/label&gt;\n            <select id=&quot;goal&quot; name=&quot;goal&quot; required&gt;\n                <option value=&quot;Weight Loss&quot;&gt;Weight Loss<\/option&gt;\n                <option value=&quot;Muscle Gain&quot;&gt;Muscle Gain<\/option&gt;\n                <option value=&quot;Endurance&quot;&gt;Endurance<\/option&gt;\n            <\/select&gt;\n\n            <label for=&quot;fitness_level&quot;&gt;Fitness Level:<\/label&gt;\n            <select id=&quot;fitness_level&quot; name=&quot;fitness_level&quot; required&gt;\n                <option value=&quot;Beginner&quot;&gt;Beginner<\/option&gt;\n                <option value=&quot;Intermediate&quot;&gt;Intermediate<\/option&gt;\n                <option value=&quot;Advanced&quot;&gt;Advanced<\/option&gt;\n            <\/select&gt;\n\n            <label for=&quot;workout_frequency&quot;&gt;Workout Frequency (times per week):<\/label&gt;\n            <input type=&quot;number&quot; id=&quot;workout_frequency&quot; name=&quot;workout_frequency&quot; required&gt;\n\n            <button type=&quot;submit&quot;&gt;Get Personalized Workout Plan<\/button&gt;\n        <\/form&gt;\n\n        <!-- Display the generated workout plan --&gt;\n        {% if plan %}\n            <div class=&quot;plan-result&quot;&gt;\n                <h2&gt;Your Personalized Workout Plan<\/h2&gt;\n                <pre&gt;{{ plan }}<\/pre&gt;\n            <\/div&gt;\n        {% endif %}\n    <\/div&gt;\n<\/body&gt;\n<\/html&gt;\n\n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F8F8F2\">&lt;!<\/span><span style=\"color: #F92672\">DOCTYPE<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">html<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">&lt;<\/span><span style=\"color: #F92672\">html<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">lang<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;en&quot;<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">&lt;<\/span><span style=\"color: #F92672\">head<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    &lt;<\/span><span style=\"color: #F92672\">meta<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">charset<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;UTF-8&quot;<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    &lt;<\/span><span style=\"color: #F92672\">meta<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">name<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;viewport&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">content<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;width=device-width, initial-scale=1.0&quot;<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    &lt;<\/span><span style=\"color: #F92672\">title<\/span><span style=\"color: #F8F8F2\">&gt;AI Fitness Coach&lt;\/<\/span><span style=\"color: #F92672\">title<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    &lt;<\/span><span style=\"color: #F92672\">link<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">rel<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;stylesheet&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">href<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;{{ url_for(&#39;static&#39;, filename=&#39;style.css&#39;) }}&quot;<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">&lt;\/<\/span><span style=\"color: #F92672\">head<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">&lt;<\/span><span style=\"color: #F92672\">body<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    &lt;<\/span><span style=\"color: #F92672\">div<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">class<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;container&quot;<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        &lt;<\/span><span style=\"color: #F92672\">h1<\/span><span style=\"color: #F8F8F2\">&gt;AI-Driven Fitness Coach&lt;\/<\/span><span style=\"color: #F92672\">h1<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        &lt;<\/span><span style=\"color: #F92672\">form<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">action<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;\/generate_plan&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">method<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;POST&quot;<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">for<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;age&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Age:&lt;\/<\/span><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">input<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">type<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;number&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">id<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;age&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">name<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;age&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">required<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">for<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;weight&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Weight (in kg):&lt;\/<\/span><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">input<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">type<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;number&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">id<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;weight&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">name<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;weight&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">required<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">for<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;goal&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Fitness Goal:&lt;\/<\/span><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">select<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">id<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;goal&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">name<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;goal&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">required<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                &lt;<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">value<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;Weight Loss&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Weight Loss&lt;\/<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                &lt;<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">value<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;Muscle Gain&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Muscle Gain&lt;\/<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                &lt;<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">value<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;Endurance&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Endurance&lt;\/<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;\/<\/span><span style=\"color: #F92672\">select<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">for<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;fitness_level&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Fitness Level:&lt;\/<\/span><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">select<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">id<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;fitness_level&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">name<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;fitness_level&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">required<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                &lt;<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">value<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;Beginner&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Beginner&lt;\/<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                &lt;<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">value<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;Intermediate&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Intermediate&lt;\/<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                &lt;<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">value<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;Advanced&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Advanced&lt;\/<\/span><span style=\"color: #F92672\">option<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;\/<\/span><span style=\"color: #F92672\">select<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">for<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;workout_frequency&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Workout Frequency (times per week):&lt;\/<\/span><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">input<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">type<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;number&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">id<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;workout_frequency&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">name<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;workout_frequency&quot;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">required<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">button<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">type<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;submit&quot;<\/span><span style=\"color: #F8F8F2\">&gt;Get Personalized Workout Plan&lt;\/<\/span><span style=\"color: #F92672\">button<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        &lt;\/<\/span><span style=\"color: #F92672\">form<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        <\/span><span style=\"color: #88846F\">&lt;!-- Display the generated workout plan --&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        {% if plan %}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;<\/span><span style=\"color: #F92672\">div<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #A6E22E\">class<\/span><span style=\"color: #F8F8F2\">=<\/span><span style=\"color: #E6DB74\">&quot;plan-result&quot;<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                &lt;<\/span><span style=\"color: #F92672\">h2<\/span><span style=\"color: #F8F8F2\">&gt;Your Personalized Workout Plan&lt;\/<\/span><span style=\"color: #F92672\">h2<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">                &lt;<\/span><span style=\"color: #F92672\">pre<\/span><span style=\"color: #F8F8F2\">&gt;{{ plan }}&lt;\/<\/span><span style=\"color: #F92672\">pre<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">            &lt;\/<\/span><span style=\"color: #F92672\">div<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">        {% endif %}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    &lt;\/<\/span><span style=\"color: #F92672\">div<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">&lt;\/<\/span><span style=\"color: #F92672\">body<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">&lt;\/<\/span><span style=\"color: #F92672\">html<\/span><span style=\"color: #F8F8F2\">&gt;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>The HTML structure provides dropdown-based 5 input fields, which will allow users to enter their data into our AI-powered personal fitness coach just like the following.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"187\" src=\"https:\/\/metaschool.so\/articles\/wp-content\/uploads\/2024\/10\/AI_driven-Fitness-Coach-1-1024x187.png\" alt=\"Basic HTML app structure\" class=\"wp-image-9334\" srcset=\"https:\/\/metaschool.so\/articles\/wp-content\/uploads\/2024\/10\/AI_driven-Fitness-Coach-1-1024x187.png 1024w, https:\/\/metaschool.so\/articles\/wp-content\/uploads\/2024\/10\/AI_driven-Fitness-Coach-1-300x55.png 300w, https:\/\/metaschool.so\/articles\/wp-content\/uploads\/2024\/10\/AI_driven-Fitness-Coach-1-768x140.png 768w, https:\/\/metaschool.so\/articles\/wp-content\/uploads\/2024\/10\/AI_driven-Fitness-Coach-1-1536x281.png 1536w, https:\/\/metaschool.so\/articles\/wp-content\/uploads\/2024\/10\/AI_driven-Fitness-Coach-1-2048x374.png 2048w, https:\/\/metaschool.so\/articles\/wp-content\/uploads\/2024\/10\/AI_driven-Fitness-Coach-1-1320x241.png 1320w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>You know how important appearance is for any app, right? We need to ensure our AI-powered personal fitness coach provides good aesthetics that motivate you to keep going. In the next section, we\u2019re going to add some life-using colors to our AI-powered personal fitness coach.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">CSS based styling<\/h3>\n\n\n\n<p>Let\u2019s style our boring webpage by playing with some colors around it. First, let&#8217;s create a folder in the project directory named as <code>static<\/code>, and inside it create a file called <code>style.css<\/code> using the following:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"mkdir static\n# For MAC users\ntouch static\/style.css\n\n# For windows users\ncd static\necho. &gt; style.css  # Using command prompt\nNew-Item -Path style.css -ItemType File # Using PowerShell \n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #A6E22E\">mkdir<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">static<\/span><\/span>\n<span class=\"line\"><span style=\"color: #88846F\"># For MAC users<\/span><\/span>\n<span class=\"line\"><span style=\"color: #A6E22E\">touch<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">static\/style.css<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #88846F\"># For windows users<\/span><\/span>\n<span class=\"line\"><span style=\"color: #66D9EF\">cd<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">static<\/span><\/span>\n<span class=\"line\"><span style=\"color: #66D9EF\">echo<\/span><span style=\"color: #F8F8F2\">. <\/span><span style=\"color: #F92672\">&gt;<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">style.css<\/span><span style=\"color: #F8F8F2\">  <\/span><span style=\"color: #88846F\"># Using command prompt<\/span><\/span>\n<span class=\"line\"><span style=\"color: #A6E22E\">New-Item<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #AE81FF\">-Path<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">style.css<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #AE81FF\">-ItemType<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">File<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #88846F\"># Using PowerShell <\/span><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>Once <code>styles.css<\/code> file is created paste the following code inside it:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"body {\n    font-family: Arial, sans-serif;\n    background-color: #f5f5f5;\n    margin: 0;\n    padding: 0;\n}\n\n.container {\n    width: 60%;\n    margin: 50px auto;\n    background-color: white;\n    padding: 20px;\n    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);\n    border-radius: 8px;\n}\n\nh1 {\n    text-align: center;\n    color: #333;\n}\n\nform {\n    display: flex;\n    flex-direction: column;\n    gap: 15px;\n}\n\nlabel {\n    font-weight: bold;\n}\n\ninput, select, button {\n    padding: 10px;\n    font-size: 16px;\n    border: 1px solid #ddd;\n    border-radius: 5px;\n}\n\nbutton {\n    background-color: #28a745;\n    color: white;\n    border: none;\n    cursor: pointer;\n}\n\nbutton:hover {\n    background-color: #218838;\n}\n\n.plan-result {\n    margin-top: 20px;\n    padding: 15px;\n    background-color: #e9ecef;\n    border-left: 5px solid #28a745;\n}\n\n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F92672\">body<\/span><span style=\"color: #F8F8F2\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">font-family<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #66D9EF\">Arial<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #66D9EF\">sans-serif<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">background-color<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">#f5f5f5<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">margin<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">0<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">padding<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">0<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #A6E22E\">.container<\/span><span style=\"color: #F8F8F2\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">width<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">60<\/span><span style=\"color: #F92672\">%<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">margin<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">50<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #66D9EF\">auto<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">background-color<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #66D9EF\">white<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">padding<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">20<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">box-shadow<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">0<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #AE81FF\">0<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #AE81FF\">10<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #66D9EF\">rgba<\/span><span style=\"color: #F8F8F2\">(<\/span><span style=\"color: #AE81FF\">0<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #AE81FF\">0<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #AE81FF\">0<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #AE81FF\">0.1<\/span><span style=\"color: #F8F8F2\">);<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">border-radius<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">8<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F92672\">h1<\/span><span style=\"color: #F8F8F2\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">text-align<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #66D9EF\">center<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">color<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">#333<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F92672\">form<\/span><span style=\"color: #F8F8F2\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">display<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #66D9EF\">flex<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">flex-direction<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #66D9EF\">column<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">gap<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">15<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F92672\">label<\/span><span style=\"color: #F8F8F2\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">font-weight<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #66D9EF\">bold<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F92672\">input<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #F92672\">select<\/span><span style=\"color: #F8F8F2\">, <\/span><span style=\"color: #F92672\">button<\/span><span style=\"color: #F8F8F2\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">padding<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">10<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">font-size<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">16<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">border<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">1<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #66D9EF\">solid<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #AE81FF\">#ddd<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">border-radius<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">5<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F92672\">button<\/span><span style=\"color: #F8F8F2\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">background-color<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">#28a745<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">color<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #66D9EF\">white<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">border<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #66D9EF\">none<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">cursor<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #66D9EF\">pointer<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #F92672\">button<\/span><span style=\"color: #A6E22E\">:hover<\/span><span style=\"color: #F8F8F2\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">background-color<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">#218838<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #A6E22E\">.plan-result<\/span><span style=\"color: #F8F8F2\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">margin-top<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">20<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">padding<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">15<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">background-color<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">#e9ecef<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">    <\/span><span style=\"color: #66D9EF; font-style: italic\">border-left<\/span><span style=\"color: #F8F8F2\">: <\/span><span style=\"color: #AE81FF\">5<\/span><span style=\"color: #F92672\">px<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #66D9EF\">solid<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #AE81FF\">#28a745<\/span><span style=\"color: #F8F8F2\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F8F8F2\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>This code provides a new modern and clean look. We have used containers to center align the overall design and use some padding to ensure our interface is user-friendly.<\/p>\n\n\n\n<p>Now that we\u2019ve set up the front end and back end of the AI-powered personal fitness coach, it\u2019s time to test it out by running our applications in the upcoming section.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Running our application<\/h2>\n\n\n\n<p>Now it&#8217;s time to run our application and utilize our AI-powered personal fitness coach in action.<\/p>\n\n\n\n<p>Start our Flask development server by running the following command:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#272822\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"python app.py\n\" style=\"color:#F8F8F2;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki monokai\" style=\"background-color: #272822\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #A6E22E\">python<\/span><span style=\"color: #F8F8F2\"> <\/span><span style=\"color: #E6DB74\">app.py<\/span><\/span>\n<span class=\"line\"><\/span><\/code><\/pre><\/div>\n\n\n\n<p>It will start the server and launch the app at <a href=\"http:\/\/127.0.0.1:5000\/\" target=\"_blank\"><code>http:\/\/127.0.0.1:5000\/<\/code><\/a>. You\u2019ll see the interface of our AI-powered personal fitness coach. Enter all the inputs, click on \u201cGet Personalized Workout Plan\u201d and a personalized workout plan is provided in no time, thanks to the power of OpenAI!<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"1194\" style=\"aspect-ratio: 1920 \/ 1194;\" width=\"1920\" autoplay loop muted src=\"https:\/\/metaschool.so\/articles\/wp-content\/uploads\/2024\/10\/App.mp4\" playsinline><\/video><\/figure>\n\n\n\n<p>Congratulations! You\u2019ve built a simple but powerful AI-powered personal fitness coach. It is tailored to your specific goals and needs. The powerful GPT-4 model allows you to create a highly customized plan without the need to hire a personal trainer or go through tons of online resources to design one for yourself.<\/p>\n\n\n\n<p>Whether you\u2019re a seasoned fitness freak or someone just getting started on your fitness journey, this AI-powered personal fitness coach is your workout buddy, ready to help you crush your goals.\ud83c\udfcb\ufe0f\u200d\u2640\ufe0f<\/p>\n\n\n\n<p>So, what are you waiting for, Ace through your AI fitness coach and start making the gains today. If you want to take this project to the next height, here are a few suggestions:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Track the progress of the users, show them their progress over time, and use animations to keep them motivated.<\/li>\n\n\n\n<li>Convert this web app to a mobile app using frameworks like Flutter or React Native.<\/li>\n\n\n\n<li>Integrate videos with the app, along with the generated exercises provide them with the videos as well.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Explore_more_on_Metaschool\"><\/span>Explore more on Metaschool<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>If you found building an AI-powered personal fitness coach helpful, you might be interested in exploring more hands-on projects and courses to expand your skills. Check out our other resources on <a href=\"https:\/\/metaschool.so\/courses\/\">Metaschool<\/a>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/metaschool.so\/courses\/build-a-yebot-with-openai-api\"><strong>Build a YeBot with OpenAI API<\/strong><\/a>: Learn how to create a sophisticated chatbot using OpenAI\u2019s powerful API, perfect for enhancing your understanding of AI-driven applications.<\/li>\n\n\n\n<li><a href=\"https:\/\/metaschool.so\/articles\/build-a-sentiment-analysis-tool\/\">How to Build a Sentiment Analysis Tool Using AI<\/a>: Dive into building a <a href=\"https:\/\/metaschool.so\/articles\/nltk-sentiment-analysis\/\">sentiment analysis<\/a> tool is a perfect solution to the never-ending task of manually sorting hundreds of comments and trying the understand the sentiment of your users.<\/li>\n<\/ul>\n\n\n\n<p>Explore these courses and more to continue your journey in AI on the Metaschool platform!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"FAQs\"><\/span>FAQs<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<div id=\"rank-math-faq\" class=\"rank-math-block\">\n<div class=\"rank-math-list \">\n<div id=\"faq-question-1728627085513\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \"><strong>What kind of fitness goals can the AI-powered personal fitness coach support?<\/strong><\/h3>\n<div class=\"rank-math-answer \">\n\n<p>The AI-powered personal fitness can provide tailored plans for various goals like muscle gain, weight loss, or endurance improvement as per your specific needs.<\/p>\n\n<\/div>\n<\/div>\n<div id=\"faq-question-1728627101166\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \"><strong>Can I update my workout plan if my fitness goals or frequency changes with time?<\/strong><\/h3>\n<div class=\"rank-math-answer \">\n\n<p>Absolutely! We can cover such cases. you can input new data such as updated fitness level, frequency, or goals. Our AI-powered personal fitness coach can generate fresh and personalized plans accordingly.<\/p>\n\n<\/div>\n<\/div>\n<div id=\"faq-question-1728627128783\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \"><strong>How many workouts per week does the AI-powered personal fitness coach recommend?<\/strong><\/h3>\n<div class=\"rank-math-answer \">\n\n<p>An AI-powered personal fitness coach can generate plans based on your preferred workout frequency, You can specify it when submitting your data.<\/p>\n\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":20,"featured_media":11103,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","footnotes":""},"categories":[344],"tags":[371,363,370],"class_list":["post-9330","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-artificial-intelligence","tag-ai-powered","tag-artificial-intelligence","tag-fitness-coach"],"_links":{"self":[{"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/posts\/9330","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/comments?post=9330"}],"version-history":[{"count":4,"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/posts\/9330\/revisions"}],"predecessor-version":[{"id":11100,"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/posts\/9330\/revisions\/11100"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/media\/11103"}],"wp:attachment":[{"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/media?parent=9330"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/categories?post=9330"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/metaschool.so\/articles\/wp-json\/wp\/v2\/tags?post=9330"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}