blog data

.env

@@ -1,7 +1,7 @@
 REACT_APP_US_ADDRESS="USA: 32 Oatgrass Dr, Grayson GA 30017"
 REACT_APP_US_PHONE="(415) 251 7583"
 REACT_APP_SUPPORT_EMAIL="support@myfit.ai"
-REACT_APP_YEAR=2023
+REACT_APP_YEAR=2025
 REACT_APP_ANDROID_URL="https://play.google.com/store/apps/details?id=com.mermsemr.myfit"
 REACT_APP_IOS_URL="https://play.google.com/store/apps/details?id=com.mermsemr.myfit"
 

.env.development

@@ -1,7 +1,7 @@
 REACT_APP_US_ADDRESS="USA: 32 Oatgrass Dr, Grayson GA 30017"
 REACT_APP_US_PHONE="(415) 251 7583"
 REACT_APP_SUPPORT_EMAIL="support@myfit.ai"
-REACT_APP_YEAR=2023
+REACT_APP_YEAR=2025
 REACT_APP_ANDROID_URL="https://play.google.com/store/apps/details?id=com.mermsemr.myfit"
 REACT_APP_IOS_URL="https://play.google.com/store/apps/details?id=com.mermsemr.myfit"
 

.env.production

@@ -0,0 +1,21 @@
+REACT_APP_US_ADDRESS="USA: 32 Oatgrass Dr, Grayson GA 30017"
+REACT_APP_US_PHONE="(415) 251 7583"
+REACT_APP_SUPPORT_EMAIL="support@myfit.ai"
+REACT_APP_YEAR=2025
+REACT_APP_ANDROID_URL="https://play.google.com/store/apps/details?id=com.mermsemr.myfit"
+REACT_APP_IOS_URL="https://play.google.com/store/apps/details?id=com.mermsemr.myfit"
+
+
+REACT_APP_APPSITE="https://users.myfit.ai/login"
+# " https://mermsemr.com"
+#REACT_APP_APPSITE="http://localhost:7012"
+
+# Social Media Links
+REACT_APP_FACEBOOK="https://www.facebook.com/profile.php?id=100066498622246"
+REACT_APP_TWITTER="https://twitter.com/fluxtra"
+
+
+REACT_APP_AUX_ENDPOINT="https://devapi.mermsemr.com/en/desktop/api/v2/myfit"
+REACT_APP_FORM_TIMEOUT=10000
+REACT_APP_MAX_MESSAGE_LENGHT=300
+REACT_APP_BLOGSITE="https://blog.mermsemr.com/"

.gitignore

@@ -1 +1,2 @@
-node_modules/*
+node_modules/*
+build/*

Dockerfile

@@ -13,15 +13,24 @@ WORKDIR /usr/src/app
 ENV PATH /usr/src/app/node_modules/.bin:$PATH
 ENV NODE_ENV=$NODE_ENV
 
+# install nginx
+RUN apk update
+RUN apk add nginx
+
 # install app dependencies
 COPY package.json ./
 
 COPY package-lock.json ./
 
+COPY nginx.conf ./
+
+COPY run.sh ./
+
 RUN npm install
 
 # add app
 COPY . ./
 
 # start app
-CMD ["npm", "start"]
+CMD /bin/sh ./run.sh
+

docker-compose.yml

@@ -1,7 +1,7 @@
 version: '3'
 services:
   myfit-www:
-    image: registry.myfit.ai/www-myfit:latest
+    image: registry.chiefsoft.net/www-myfit:latest
     build:
       context: .
       dockerfile: Dockerfile

nginx.conf

@@ -0,0 +1,29 @@
+worker_processes 1;
+
+events {
+  worker_connections 1024;
+}
+
+http {
+  access_log /var/log/nginx/access.log;
+  error_log  /var/log/nginx/error.log;
+
+  server {
+    gzip on;
+    listen 3000;
+    server_name localhost;
+    root /usr/src/app/build;
+
+    include /etc/nginx/mime.types;
+
+    location /nginx_status {
+      stub_status on;
+      access_log off;
+    }
+
+    location / {
+      try_files $uri $uri/ /index.html;
+    }
+  }
+}
+

package.json

@@ -18,8 +18,8 @@
     "axios": "^0.24.0"
   },
   "scripts": {
-    "start": "react-scripts start -e .env",
+    "start": "react-scripts start -e .env.development",
-    "build": "react-scripts build -e .env",
+    "build": "react-scripts build -e .env.production",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },

public/assets/css/style.css

@@ -1733,7 +1733,7 @@ iframe#youtubevideo {
     padding: 20px 100px;
     padding-bottom: 50px;
     position: relative;
-    z-index: 999999;
+    /* z-index: 999999; */
 }
 
 /* download app dark background */

run.sh

@@ -0,0 +1,15 @@
+#!/usr/bin/env sh
+set -e
+set -x
+
+export NODE_ENV="${NODE_ENV:-development}"
+
+if [ $NODE_ENV == "development" ]; then
+  # this runs webpack-dev-server with hot reloading
+  npm start
+else
+  # build the app and serve it via nginx
+  npm run build
+  nginx -g 'daemon off;' -c /usr/src/app/nginx.conf
+  nginx -c /usr/src/app/nginx.conf
+fi

src/assets/css/style.css

@@ -1758,7 +1758,7 @@ iframe#youtubevideo {
   padding: 20px 100px;
   padding-bottom: 50px;
   position: relative;
-  z-index: 999999;
+  /* z-index: 999999; */
 }
 
 /* download app dark background */

src/component/AboutUs/Main.js

@@ -16,8 +16,9 @@ const Main = ({brdcum}) => {
     const [ytShow , setytShow] = useState (false)
 
     // About us text variables
-    let innovativeDesc = 'The team at myFit by Fluxtra LLC works with you to achieve your health objectives without getting in your way. Do your health your way to get the best result for you and your family. We are you, always ready and always engaged with the users to help get the best out of our solution.'
+    let innovativeDesc = `The team at myFit by Fluxtra LLC works with you to achieve your health objectives without getting in your way. Do your health your way to get the best result for you and your family. We are you, always ready and always engaged with the users to help get the best out of our solution. 
-    'We work with you to achieve your health and fitness goals by providing solutions that fit your goals.'
+    We work with you to achieve your health and fitness goals by providing solutions that fit your goals.`
+
     let whyWeAreDiff = {
         desc:'We work with you to achieve your health and fitness goals by providing solutions that fit your goals.',
         secureDesc:"MyFit is built to keep your data secure and protect your privacy. Your data is encrypted and you are always in control of your information.",
@@ -251,4 +252,4 @@ const Main = ({brdcum}) => {
   )
 }
 
-export default Main
+export default Main

src/component/Footer/Main.js

@@ -1,5 +1,5 @@
 import { Link } from "react-router-dom";
-import { HashLink } from 'react-router-hash-link';
+import { HashLink } from "react-router-hash-link";
 import React from "react";
 import line from "../../assets/images/anim_line.png";
 import blueapp from "../../assets/images/appstore_blue.png";
@@ -14,33 +14,11 @@ const Main = ({ footer }) => {
         <footer>
           <div className="top_footer" id="contact">
             <div className="anim_line dark_bg">
-              <span>
+              {[...Array(9)].map((_, index) => (
-                <img src={line} alt="anim_line" />
+                <span key={index}>
-              </span>
+                  <img src={line} alt="anim_line" />
-              <span>
+                </span>
-                <img src={line} alt="anim_line" />
+              ))}
-              </span>
-              <span>
-                <img src={line} alt="anim_line" />
-              </span>
-              <span>
-                <img src={line} alt="anim_line" />
-              </span>
-              <span>
-                <img src={line} alt="anim_line" />
-              </span>
-              <span>
-                <img src={line} alt="anim_line" />
-              </span>
-              <span>
-                <img src={line} alt="anim_line" />
-              </span>
-              <span>
-                <img src={line} alt="anim_line" />
-              </span>
-              <span>
-                <img src={line} alt="anim_line" />
-              </span>
             </div>
             <div className="container">
               <div className="row">
@@ -55,7 +33,9 @@ const Main = ({ footer }) => {
                         {/* <Link to="#">
                           {process.env.REACT_APP_SUPPORT_EMAIL}
                         </Link> */}
-                        <a href={`mailto: ${process.env.REACT_APP_SUPPORT_EMAIL}`}>
+                        <a
+                          href={`mailto: ${process.env.REACT_APP_SUPPORT_EMAIL}`}
+                        >
                           {process.env.REACT_APP_SUPPORT_EMAIL}
                         </a>
                       </li>
@@ -73,7 +53,7 @@ const Main = ({ footer }) => {
                         </a>
                       </li>
                       <li>
-                        <a href ={process.env.REACT_APP_TWITTER}>
+                        <a href={process.env.REACT_APP_TWITTER}>
                           <i className="icofont-twitter"></i>
                         </a>
                       </li>
@@ -87,13 +67,12 @@ const Main = ({ footer }) => {
                       <li>
                         {/* <Link to="/">Home</Link> */}
                         <HashLink to="/#">Home</HashLink>
-
                       </li>
                       <li>
                         <Link to="/about">About us</Link>
                       </li>
                       <li>
-                        <Link to="/blog">Blog</Link>
+                        <Link to="https://blog.myfit.ai/">Blog</Link>
                       </li>
                       <li>
                         <Link to="/contact">Contact us</Link>
@@ -200,7 +179,9 @@ const Main = ({ footer }) => {
                         {/* <Link to="#">
                           {process.env.REACT_APP_SUPPORT_EMAIL}
                         </Link> */}
-                        <a href={`mailto: ${process.env.REACT_APP_SUPPORT_EMAIL}`}>
+                        <a
+                          href={`mailto: ${process.env.REACT_APP_SUPPORT_EMAIL}`}
+                        >
                           {process.env.REACT_APP_SUPPORT_EMAIL}
                         </a>
                       </li>
@@ -212,15 +193,15 @@ const Main = ({ footer }) => {
                       </li>
                     </ul>
                     <ul className="social_media">
-                     <li>
+                      <li>
-                          <a href={process.env.REACT_APP_FACEBOOK}>
+                        <a href={process.env.REACT_APP_FACEBOOK}>
-                            <i className="icofont-facebook"></i>
+                          <i className="icofont-facebook"></i>
-                          </a>
+                        </a>
                       </li>
                       <li>
-                          <a href ={process.env.REACT_APP_TWITTER}>
+                        <a href={process.env.REACT_APP_TWITTER}>
-                            <i className="icofont-twitter"></i>
+                          <i className="icofont-twitter"></i>
-                          </a>
+                        </a>
                       </li>
                     </ul>
                   </div>
@@ -329,7 +310,9 @@ const Main = ({ footer }) => {
                         {/* <Link to="#">
                           {process.env.REACT_APP_SUPPORT_EMAIL}
                         </Link> */}
-                        <a href={`mailto: ${process.env.REACT_APP_SUPPORT_EMAIL}`}>
+                        <a
+                          href={`mailto: ${process.env.REACT_APP_SUPPORT_EMAIL}`}
+                        >
                           {process.env.REACT_APP_SUPPORT_EMAIL}
                         </a>
                       </li>
@@ -347,7 +330,7 @@ const Main = ({ footer }) => {
                         </a>
                       </li>
                       <li>
-                        <a href ={process.env.REACT_APP_TWITTER}>
+                        <a href={process.env.REACT_APP_TWITTER}>
                           <i className="icofont-twitter"></i>
                         </a>
                       </li>
@@ -388,7 +371,7 @@ const Main = ({ footer }) => {
                         <Link to="#">Support</Link>
                       </li>
                       <li>
-                         <HashLink to="/#how_it_work">How it works</HashLink>
+                        <HashLink to="/#how_it_work">How it works</HashLink>
                       </li>
                       <li>
                         <Link to="/terms">Terms & conditions</Link>
@@ -404,7 +387,7 @@ const Main = ({ footer }) => {
                   <div className="try_out">
                     <h3>Let’s Try Out</h3>
                     <ul className="app_btn">
-                     <li>
+                      <li>
                         <a href={process.env.REACT_APP_ANDROID_URL}>
                           <img src={blueapp} alt="image" />
                         </a>
@@ -460,7 +443,9 @@ const Main = ({ footer }) => {
                         {/* <Link to="#">
                           {process.env.REACT_APP_SUPPORT_EMAIL}
                         </Link> */}
-                        <a href={`mailto: ${process.env.REACT_APP_SUPPORT_EMAIL}`}>
+                        <a
+                          href={`mailto: ${process.env.REACT_APP_SUPPORT_EMAIL}`}
+                        >
                           {process.env.REACT_APP_SUPPORT_EMAIL}
                         </a>
                       </li>
@@ -478,7 +463,7 @@ const Main = ({ footer }) => {
                         </a>
                       </li>
                       <li>
-                        <a href ={process.env.REACT_APP_TWITTER}>
+                        <a href={process.env.REACT_APP_TWITTER}>
                           <i className="icofont-twitter"></i>
                         </a>
                       </li>
@@ -519,7 +504,7 @@ const Main = ({ footer }) => {
                         <Link to="#">Support</Link>
                       </li>
                       <li>
-                          <HashLink to="/#how_it_work">How it works</HashLink>
+                        <HashLink to="/#how_it_work">How it works</HashLink>
                       </li>
                       <li>
                         <Link to="/terms">Terms & conditions</Link>
@@ -599,7 +584,9 @@ const Main = ({ footer }) => {
                         {/* <Link to="#">
                           {process.env.REACT_APP_SUPPORT_EMAIL}
                         </Link> */}
-                        <a href={`mailto: ${process.env.REACT_APP_SUPPORT_EMAIL}`}>
+                        <a
+                          href={`mailto: ${process.env.REACT_APP_SUPPORT_EMAIL}`}
+                        >
                           {process.env.REACT_APP_SUPPORT_EMAIL}
                         </a>
                       </li>
@@ -617,7 +604,7 @@ const Main = ({ footer }) => {
                         </a>
                       </li>
                       <li>
-                        <a href ={process.env.REACT_APP_TWITTER}>
+                        <a href={process.env.REACT_APP_TWITTER}>
                           <i className="icofont-twitter"></i>
                         </a>
                       </li>
@@ -657,7 +644,7 @@ const Main = ({ footer }) => {
                         <Link to="#">Support</Link>
                       </li>
                       <li>
-                         <HashLink to="/#how_it_work">How it works</HashLink>
+                        <HashLink to="/#how_it_work">How it works</HashLink>
                       </li>
                       <li>
                         <Link to="/terms">Terms & conditions</Link>
@@ -672,7 +659,7 @@ const Main = ({ footer }) => {
                   <div className="try_out">
                     <h3>Let’s Try Out</h3>
                     <ul className="app_btn">
-                     <li>
+                      <li>
                         <a href={process.env.REACT_APP_ANDROID_URL}>
                           <img src={blueapp} alt="image" />
                         </a>

src/component/Home/Main.js

@@ -16,6 +16,9 @@ import white from "../../assets/images/googleplay_white.png";
 import msg from "../../assets/images/message_icon.png";
 import shield from "../../assets/images/shield_icon.png";
 import screen from "../../assets/images/screen.png";
+import firstSlide from "../../assets/images/myfitscreenhome.png";
+import secondSlide from "../../assets/images/myfitscreenlogin.png";
+import thirdSlide from "../../assets/images/myfitscreenstartpage.png";
 import frame from "../../assets/images/mobile_frame_svg.svg";
 
 const Main = ({ setfooter, setnavbar, setbrdcum }) => {
@@ -56,33 +59,11 @@ const Main = ({ setfooter, setnavbar, setbrdcum }) => {
       <section className="banner_section home-banner">
         <div className="container">
           <div className="anim_line">
-            <span>
+            {[...Array(9)].map((_, index) => (
-              <img src={anim} alt="anim_line" />
+              <span key={index}>
-            </span>
+                <img src={anim} alt="anim_line" />
-            <span>
+              </span>
-              <img src={anim} alt="anim_line" />
+            ))}
-            </span>
-            <span>
-              <img src={anim} alt="anim_line" />
-            </span>
-            <span>
-              <img src={anim} alt="anim_line" />
-            </span>
-            <span>
-              <img src={anim} alt="anim_line" />
-            </span>
-            <span>
-              <img src={anim} alt="anim_line" />
-            </span>
-            <span>
-              <img src={anim} alt="anim_line" />
-            </span>
-            <span>
-              <img src={anim} alt="anim_line" />
-            </span>
-            <span>
-              <img src={anim} alt="anim_line" />
-            </span>
           </div>
           <div className="row">
             <div
@@ -103,37 +84,19 @@ const Main = ({ setfooter, setnavbar, setbrdcum }) => {
                 </p>
               </div>
               <ul className="app_btn">
-                  <li>
-                      <a href={process.env.REACT_APP_ANDROID_URL}>
-                        <img src={blueapp} alt="image" />
-                        <img className="white_img" src={whiteapp} alt="image" />
-                      </a>
-                  </li>
-                  <li>
-                      <a href={process.env.REACT_APP_IOS_URL}>
-                        <img src={blue} alt="image" />
-                        <img className="white_img" src={white} alt="image" />
-                      </a>
-                  </li>
-              </ul>
-
-
-              {/* <ul className="app_btn">
                 <li>
-                  <Link to="https://play.google.com/store/apps/details?id=com.mermsemr.myfit">
+                  <a href={process.env.REACT_APP_ANDROID_URL}>
-                    <img className="blue_img" src={blueapp} alt="image" />
+                    <img src={blueapp} alt="image" />
                     <img className="white_img" src={whiteapp} alt="image" />
-                  </Link>
+                  </a>
                 </li>
                 <li>
-                  <Link to="https://play.google.com/store/apps/details?id=com.mermsemr.myfit">
+                  <a href={process.env.REACT_APP_IOS_URL}>
-                    <img className="blue_img" src={blue} alt="image" />
+                    <img src={blue} alt="image" />
                     <img className="white_img" src={white} alt="image" />
-                  </Link>
+                  </a>
                 </li>
-              </ul> */}
+              </ul>
-
-
             </div>
             <div
               className="col-lg-6 col-md-12"
@@ -154,17 +117,17 @@ const Main = ({ setfooter, setnavbar, setbrdcum }) => {
                 >
                   <div className="item">
                     <div className="slider_img">
-                      <img src={screen} alt="image" />
+                      <img src={firstSlide} alt="image" />
                     </div>
                   </div>
                   <div className="item">
                     <div className="slider_img">
-                      <img src={screen} alt="image" />
+                      <img src={secondSlide} alt="image" />
                     </div>
                   </div>
                   <div className="item">
                     <div className="slider_img">
-                      <img src={screen} alt="image" />
+                      <img src={thirdSlide} alt="image" />
                     </div>
                   </div>
                 </OwlCarousel>

src/component/HomeMain/Download/Main.js

@@ -1,81 +1,97 @@
-import { Link } from 'react-router-dom'
+import { Link } from "react-router-dom";
-import React, {useState} from 'react'
+import React, { useState } from "react";
-import img from '../../../assets/images/anim_line.png'
+import img from "../../../assets/images/anim_line.png";
-import blueapp from '../../../assets/images/appstore_blue.png'
+import blueapp from "../../../assets/images/appstore_blue.png";
-import blue from '../../../assets/images/googleplay_blue.png'
+import blue from "../../../assets/images/googleplay_blue.png";
-import screen from '../../../assets/images/download-screen01.png'
+import screen from "../../../assets/images/download-screen01.png";
-import screen1 from '../../../assets/images/download-screen02.png'
+import screen1 from "../../../assets/images/download-screen02.png";
-
 
 const Main = () => {
-    const [animate, setanimate] = useState()
+  const [animate, setAnimate] = useState(false);
-   
+  const [purple, setPurple] = useState(false);
 
-    const [purple, setpurple] = useState()
+//   useEffect(() => {
-    window.addEventListener('scroll', function() {
+//     const handleScroll = () => {
-        const element = document.getElementsByClassName('free_text');
+//       const element = document.getElementsByClassName("free_text")[0];
-        const position = element[0].getBoundingClientRect();
+//       const position = element.getBoundingClientRect();
-        
-        if(position.top < window.innerHeight && position.bottom >= 0) {
-            const elm = document.getElementsByClassName("purple_backdrop");
-            elm[0].style.opacity = "1"; 
-        }else{
-            const elm = document.getElementsByClassName("purple_backdrop");
-            elm[0].style.opacity = "0"; 
 
-        }
+//       if (position.top < window.innerHeight && position.bottom >= 0) {
-    });
+//         document.getElementsByClassName("purple_backdrop")[0].style.opacity =
+//           "1";
+//       } else {
+//         document.getElementsByClassName("purple_backdrop")[0].style.opacity =
+//           "0";
+//       }
+//     };
+
+//     window.addEventListener("scroll", handleScroll);
+
+//     return () => {
+//       window.removeEventListener("scroll", handleScroll);
+//     };
+//   }, []);
 
   return (
     <>
-        <section className="row_am free_app_section review_freeapp" id="getstarted">
+      <section
-            <div className="container">
+        className={`row_am free_app_section review_freeapp ${
-                <div className={`free_app_inner aos-init ${animate && "aos-animate"}`} data-aos="fade-in" data-aos-duration="1500" data-aos-delay="100"> 
+          animate && "aos-animate"
-                    <div className="anim_line dark_bg">
+        }`}
-                        <span><img src={img} alt="anim_line" /></span>
+        id="getstarted"
-                        <span><img src={img} alt="anim_line" /></span>
+      >
-                        <span><img src={img} alt="anim_line" /></span>
+        <div className="container">
-                        <span><img src={img} alt="anim_line" /></span>
+          <div
-                        <span><img src={img} alt="anim_line" /></span>
+            className="free_app_inner"
-                        <span><img src={img} alt="anim_line" /></span>
+            data-aos="fade-in"
-                        <span><img src={img} alt="anim_line" /></span>
+            data-aos-duration="1500"
-                        <span><img src={img} alt="anim_line" /></span>
+            data-aos-delay="100"
-                        <span><img src={img} alt="anim_line" /></span>
+          >
-                    </div>
+            <div className="anim_line dark_bg">
-                    <div className="row">
+              {[...Array(9)].map((_, index) => (
-                        <div className="col-md-6">
+                <span key={index}>
-                            <div className="free_text">
+                  <img src={img} alt="anim_line" />
-                                <div className="section_title">
+                </span>
-                                    <h2>Let’s download free from apple and play store</h2>
+              ))}
-                                    <p>Instant free download from apple and play store. All you need is an iPhone or Android device to enjoy all personalized metrics for personal use. Welcome to myFit App.</p>
-                                </div>
-                                <ul className="app_btn">
-                                <li>
-                                    <a href={process.env.REACT_APP_ANDROID_URL}>
-                                    <img src={blueapp} alt="image" />
-                                    </a>
-                                </li>
-                                <li>
-                                    <a href={process.env.REACT_APP_IOS_URL}>
-                                    <img src={blue} alt="image" />
-                                    </a>
-                                </li>
-                                </ul>
-                            </div>
-                        </div>
-                        <div className="col-md-6">
-                            <div className="free_img">
-                                <img src={screen} alt="image" />
-                                <img className="mobile_mockup" src={screen1} alt="image" />
-                            </div>
-                        </div>
-                    </div>
-                </div>
             </div>
-        </section>
+            <div className="row">
-        <div className="purple_backdrop"></div>
+              <div className="col-md-6">
+                <div className="free_text">
+                  <div className="section_title">
+                    <h2>Let’s download free from apple and play store</h2>
+                    <p>
+                      Instant free download from apple and play store. All you
+                      need is an iPhone or Android device to enjoy all
+                      personalized metrics for personal use. Welcome to myFit
+                      App.
+                    </p>
+                  </div>
+                  <ul className="app_btn">
+                    <li>
+                      <a href={process.env.REACT_APP_ANDROID_URL}>
+                        <img src={blueapp} alt="image" />
+                      </a>
+                    </li>
+                    <li>
+                      <a href={process.env.REACT_APP_IOS_URL}>
+                        <img src={blue} alt="image" />
+                      </a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div className="col-md-6">
+                <div className="free_img">
+                  <img src={screen} alt="image" />
+                  <img className="mobile_mockup" src={screen1} alt="image" />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </section>
+      {/* <div className="purple_backdrop"></div> */}
     </>
-  )
+  );
-}
+};
 
-export default Main
+export default Main;

src/component/HomeMain/Interface/Main.js

@@ -1,82 +1,92 @@
-import OwlCarousel from 'react-owl-carousel'
+import OwlCarousel from "react-owl-carousel";
-import React from 'react'
+import React from "react";
-import img1 from '../../../assets/images/screen-1.png'
+import img1 from "../../../assets/images/myfitstartpage.png";
-import img2 from '../../../assets/images/screen-2.png'
+import img2 from "../../../assets/images/screen-2.png";
-import img3 from '../../../assets/images/screen-3.png'
+import img3 from "../../../assets/images/myfithomepage.png";
-import img4 from '../../../assets/images/screen-4.png'
+import img4 from "../../../assets/images/screen-4.png";
-import img5 from '../../../assets/images/screen-5.png'
+import img5 from "../../../assets/images/myfitloginpage.png";
 
 const Main = () => {
-
+  const screen_slider = {
-    const screen_slider = {
+    loop: true,
-        loop:true,
+    margin: 10,
-        margin:10,
+    nav: false,
-        nav:false,
+    autoplay: true,
-        autoplay: true,
+    smartSpeed: 1500,
-        smartSpeed: 1500,
+    center: true,
-        center: true,
+    dots: true,
-        dots: true, 
+    responsive: {
-        responsive:{
+      0: {
-            0:{
+        items: 2,
-                items:2
+      },
-            },
+      600: {
-            600:{
+        items: 3,
-                items:3
+      },
-            },
+      1000: {
-            1000:{
+        items: 5,
-                items:5
+      },
-            }
+    },
-        }
+  };
-    }
   return (
     <>
-        <section className="row_am interface_section">
+      <section className="row_am interface_section">
-            <div className="container-fluid">
+        <div className="container-fluid">
-                <div className="section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="300">
+          <div
-                    <h2>Beautiful <span>interface</span></h2>
+            className="section_title"
-                    <p>
+            data-aos="fade-up"
-                    myFit appends a fun yet simple process to keep you consistently<br/> motivated,engaged and moving again without any shrewdness.
+            data-aos-duration="1500"
-
+            data-aos-delay="300"
-                    </p>
+          >
+            <h2>
+              Beautiful <span>interface</span>
+            </h2>
+            <p>
+              myFit appends a fun yet simple process to keep you consistently
+              <br /> motivated,engaged and moving again without any shrewdness.
+            </p>
+          </div>
+          <div className="screen_slider">
+            <OwlCarousel
+              id="screen_slider"
+              {...screen_slider}
+              className="owl-carousel owl-theme owl-loaded owl-drag"
+            >
+              <div className="item">
+                <div className="screen_frame_img">
+                  <img src={img1} alt="image" />
                 </div>
-                <div className="screen_slider" >
+              </div>
-                    <OwlCarousel id="screen_slider" {...screen_slider} className="owl-carousel owl-theme owl-loaded owl-drag">
+              <div className="item">
-                        <div className="item">
+                <div className="screen_frame_img">
-                            <div className="screen_frame_img">
+                  <img src={img2} alt="image" />
-                                <img src={img1} alt="image" />
-                            </div>
-                        </div>
-                        <div className="item">
-                            <div className="screen_frame_img">
-                                <img src={img2} alt="image" />
-                            </div>
-                        </div>
-                        <div className="item">
-                            <div className="screen_frame_img">
-                                <img src={img3} alt="image" />
-                            </div>
-                        </div>
-                        <div className="item">
-                            <div className="screen_frame_img">
-                                <img src={img4} alt="image" />
-                            </div>
-                        </div>
-                        <div className="item">
-                            <div className="screen_frame_img">
-                                <img src={img5} alt="image" />
-                            </div>
-                        </div>
-                        <div className="item">
-                            <div className="screen_frame_img">
-                                <img src={img3} alt="image" />
-                            </div>
-                        </div>
-                    </OwlCarousel>
                 </div>
-            </div>
+              </div>
-        </section>
+              <div className="item">
+                <div className="screen_frame_img">
+                  <img src={img3} alt="image" />
+                </div>
+              </div>
+              <div className="item">
+                <div className="screen_frame_img">
+                  <img src={img4} alt="image" />
+                </div>
+              </div>
+              <div className="item">
+                <div className="screen_frame_img">
+                  <img src={img5} alt="image" />
+                </div>
+              </div>
+              <div className="item">
+                <div className="screen_frame_img">
+                  <img src={img2} alt="image" />
+                </div>
+              </div>
+            </OwlCarousel>
+          </div>
+        </div>
+      </section>
     </>
-  )
+  );
-}
+};
 
-export default Main
+export default Main;

src/component/HomeMain/Story/Main.js

@@ -33,7 +33,7 @@ const Main = () => {
                 </div>
                 <div className="row">
                   
-                {blogData.slice(1, 4).map((data, index) => (
+                { (blogData !== undefined) && (blogData?.length > 0) && blogData.slice(1, 4).map((data, index) => (
               <div
                 className="col-md-4"
                 key={index}>

src/component/Pages/Review/Main.js

@@ -6,6 +6,8 @@ import BGImg1 from "../../../assets/images/bread_crumb_bg_one.png"
 import BGImg2 from "../../../assets/images/bread_crumb_bg_two.png"
 import screen from '../../../assets/images/download-screen01.png'
 import screen1 from '../../../assets/images/download-screen02.png'
+import blueapp from "../../../assets/images/appstore_blue.png";
+import blue from "../../../assets/images/googleplay_blue.png";
 
 const Main = ({brdcum}) => {
 
@@ -362,4 +364,4 @@ const Main = ({brdcum}) => {
   )
 }
 
-export default Main
+export default Main

src/routes/index.js

@@ -17,46 +17,51 @@ import BlogSingle from "../component/Blog/BlogSingle/Main";
 import Terms from "../component/Terms/Main";
 import Privacy from "../component/Privacy/Main";
 
+/**
+ * Renders the appropriate component based on the current URL path.
+ * Manages the state of the navbar and footer components based on the current path.
+ * @returns {JSX.Element} The rendered components based on the current URL path.
+ */
 const Routing = () => {
-  const [homepage, sethomepage] = useState(false);
+  const [homepage, setHomepage] = useState(false);
+  const [footerpage, setFooterpage] = useState(false);
+  const [footer, setFooter] = useState({ f1: true });
+  const [navbar, setNavbar] = useState({ n1: true });
+  const [brdcum, setBrdcum] = useState({ n1: true });
   const location = useLocation();
 
   useEffect(() => {
     if (location.pathname === "/sign-in" || location.pathname === "/sign-up") {
-      sethomepage(false);
+      setHomepage(false);
     } else {
-      sethomepage(true);
+      setHomepage(true);
     }
   }, [location]);
 
-  const [footerpage, setfooterpage] = useState(false);
   useEffect(() => {
     if (location.pathname === "/sign-in" || location.pathname === "/sign-up") {
-      setfooterpage(false);
+      setFooterpage(false);
     } else {
-      setfooterpage(true);
+      setFooterpage(true);
     }
   }, [location]);
 
   useEffect(() => {
-    if (localStorage.getItem("navbar") === "darkhome") {
+    const navbarValue = localStorage.getItem("navbar");
-      setfooter({ f2: true });
+    if (navbarValue === "darkhome") {
-      setnavbar({ n3: true });
+      setFooter({ f2: true });
-      setbrdcum({ b2: true });
+      setNavbar({ n3: true });
-    } else if (localStorage.getItem("navbar") === "home") {
+      setBrdcum({ b2: true });
-      setfooter({ f1: true });
+    } else if (navbarValue === "home") {
-      setnavbar({ n2: true });
+      setFooter({ f1: true });
-      setbrdcum({ b1: true });
+      setNavbar({ n2: true });
+      setBrdcum({ b1: true });
     } else {
-      setfooter({ f1: true });
+      setFooter({ f1: true });
-      setnavbar({ n2: true });
+      setNavbar({ n2: true });
     }
   }, []);
 
-  const [footer, setfooter] = useState({ f1: true });
-  const [navbar, setnavbar] = useState({ n1: true });
-  const [brdcum, setbrdcum] = useState({ n1: true });
-
   return (
     <>
       {homepage && <Navbar navbar={navbar} />}
@@ -65,19 +70,19 @@ const Routing = () => {
           path="/"
           element={
             <Home
-              setfooter={setfooter}
+              setfooter={setFooter}
-              setnavbar={setnavbar}
+              setnavbar={setNavbar}
-              setbrdcum={setbrdcum}
+              setbrdcum={setBrdcum}
             />
           }
         />
         <Route
           path="/about"
-          element={<AboutUs setnavbar={setnavbar} brdcum={brdcum} />}
+          element={<AboutUs setnavbar={setNavbar} brdcum={brdcum} />}
         />
         <Route
           path="/review"
-          element={<Review setnavbar={setnavbar} brdcum={brdcum} />}
+          element={<Review setnavbar={setNavbar} brdcum={brdcum} />}
         />
         <Route path="/contact" element={<Contact brdcum={brdcum} />} />
         <Route path="/faq" element={<Faq brdcum={brdcum} />} />
@@ -88,7 +93,6 @@ const Routing = () => {
         <Route path="/blogdetails/:id" element={<BlogSingle brdcum={brdcum} />} />
         <Route path="/terms" element={<Terms brdcum={brdcum} />} />
         <Route path="/privacy" element={<Privacy brdcum={brdcum} />} />
-
       </Routes>
       {footerpage && <Footer footer={footer} />}
     </>

src/vendors/service/siteService.js

@@ -7,7 +7,8 @@ class SiteService {
   }
   // Blog Data {Get}
   blogData(id) {
-    return this.getAuxEnd("/blogdata", null);
+    //myfit
+    return this.getBlogEnd("/myfit", null);
   }
 
   // Country Data {GET}
@@ -56,13 +57,34 @@ class SiteService {
       });
   }
 
+  getBlogEnd(uri, reqData) {
+    const endPoint = "https://blogdata.chiefsoft.net/blogdata" + uri;
+    return Axios.get(endPoint)
+        .then((response) => {
+          // console.log(response);
+          // res = response;
+          // console.log("~~~~~~~ Toks2 GET ~~~~~~~~");
+          return response;
+        })
+        .catch((error) => {
+          if (error.response) {
+            //response status is an error code
+            console.log(error.response.status);
+          } else if (error.request) {
+            //response not received though the request was sent
+            console.log(error.request);
+          } else {
+            //an error occurred when setting up the request
+            console.log(error.message);
+          }
+        });
+  }
   postAuxEnd(uri, reqData) {
     const endPoint = process.env.REACT_APP_AUX_ENDPOINT + uri;
     return Axios.post(endPoint, reqData)
       .then((response) => {
         console.log(response);
-        // res = response;
+        // res = response
-        console.log("~~~~~~~ Toks2 POST ~~~~~~~~");
         return response;
       })
       .catch((error) => {