adrianhajdin / project_fitness_app

React Fitness Application

🌟 Become a top 1% Next.js 13 developer in only one course

🚀 Land your dream programming job in 6 months

Launch your development career with project-based coaching - https://www.jsmastery.pro

project_fitness_app's Issues

Error with: npm start

./src/index.js
Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './lib/rules/no-unused-expressions' is not defined by "exports" in C:\Users\msi\Downloads\Github\project_fitness_app\node_modules\eslint\package.json

App is getting closed after 1-2 second dont know why i followed full video

app renders for 1-2 seconds then it shows white screen please someone explain why this is happening

exersice.slice is not a function

invalid API key

exercises.slice is not a function

please check this code on exercise.js:32

error

it get error b/c Api how i fix it

Exercises.slice is not a function

I have seen other peope have the same issue: I am a new user to rapidAPI, so I don't believe the issue is that I have run out of requests. However, I did make a new account and change local IP to get a different key as suggested and still get the error. I do not know where to go from here. I have the rest of the project completed. below is the error I recieve:

ERROR
exercises.slice is not a function
TypeError: exercises.slice is not a function
at Exercises (http://localhost:3000/main.0eff7a31ea01d5c8367a.hot-update.js:61:38)
at renderWithHooks (http://localhost:3000/static/js/bundle.js:49655:22)
at updateFunctionComponent (http://localhost:3000/static/js/bundle.js:52537:24)
at beginWork (http://localhost:3000/static/js/bundle.js:54249:20)
at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:39247:18)
at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:39291:20)
at invokeGuardedCallback (http://localhost:3000/static/js/bundle.js:39348:35)
at beginWork$1 (http://localhost:3000/static/js/bundle.js:59222:11)
at performUnitOfWork (http://localhost:3000/static/js/bundle.js:58469:16)
at workLoopSync (http://localhost:3000/static/js/bundle.js:58392:9)

No routes matched location "/exercise/{exercise id}"

At firts my project was working, but now I received this error of no routes matched, I already try to fix it and checked the video comments but nobody knows what is happening.

Hira Fitness

Change alt value to "left-arrow" for LeftArrow component

Not really an issue, but just a change on alt value of img under the LeftArrow component. It should be "left-arrow" instead of "right-arrow".

const LeftArrow = () => {
  const { scrollPrev } = useContext(VisibilityContext);

  return (
    <Typography onClick={() => scrollPrev()} className="right-arrow">
      <img src={LeftArrowIcon} alt="left-arrow" />
    </Typography>
  );
}

Directional issue

These are not showing in horizontal

Scrolling Arrows not working

I have exactly copied the LeftArrow & RightArrow code but while clicking on the Arrows nothing happening.

props {name} doesnt work

In ExerciseVideos {name} props doesnt show up.

exercises.slice is not a function

i am getting the following error and my api is working

exercises.slice is not a function
TypeError: exercises.slice is not a function
at Exercises (http://localhost:3000/main.9ca945adc80ee5b1342b.hot-update.js:59:38)
at renderWithHooks (http://localhost:3000/static/js/bundle.js:48253:22)
at updateFunctionComponent (http://localhost:3000/static/js/bundle.js:51135:24)
at beginWork (http://localhost:3000/static/js/bundle.js:52847:20)
at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:37845:18)
at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:37889:20)
at invokeGuardedCallback (http://localhost:3000/static/js/bundle.js:37946:35)
at beginWork$1 (http://localhost:3000/static/js/bundle.js:57820:11)
at performUnitOfWork (http://localhost:3000/static/js/bundle.js:57067:16)
at workLoopSync (http://localhost:3000/static/js/bundle.js:56990:9)

trying to fetch the data at 54:00 but im getting a 404 not found and Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0

`const axios = require("axios");

export const exerciseOptions = {
method: "GET",
url: "https://exercisedb.p.rapidapi.com/exercises/bodyPartList",
headers: {
"X-RapidAPI-Key": "18a665e221mshf1d7bea141505c2p1564a3jsnaa88558458d8",
"X-RapidAPI-Host": "exercisedb.p.rapidapi.com",
},
};

export const fetchData = async (url, options) => {
const res = await fetch(url, options);
const data = await res.json();

return data;
};
`

not align as yours

hello sir i follow your tutorial but i have an issue that is very simple
the issue that ,the image is show in the downside of typography ? is that because your screen resolution are bigger than my screen resolution??

API is not working properly

idk why my API call only showing 2 or 3 result for only specific string and sometimes it even returning an empty array does anybody know how to fix this?

Arrow inside scrollbar is not working

Both left and right scroll button are not functional. I have checked on click is working but not the respective scroll functions. I have used same library having same version

Showing Error :- setExercises and setBodyPart

Too Many Requests and bodyPartsData is not iterable.

GET https://exercisedb.p.rapidapi.com/exercises 429 (Too Many Requests).

GET https://exercisedb.p.rapidapi.com/exercises/bodyPartList 403 (Forbidden).

Error fetching body parts data: TypeError: bodyPartsData is not iterable
at fetchExercisesData (SearchExercises.js:19:1).

GET https://exercisedb.p.rapidapi.com/exercises/bodyPartList 429 (Too Many Requests).

I've written in above why your errors are occuring, read it again

Detail.js (Objects are not valid as a React child)

Hi guys,
I am a beginner in React, this is my first project and am unable to resolve this issue. The site is functioning properly but after clicking on exercises for more details....I am getting this error . What changes should I be making to the Detail.js to resolve this issue

Thanks

I have leraned from your video to create a website , but its is totatly blank

I have created a website but is not showing the content , it is just showing a white blank page , please help me how to solve this error on my code .

exercisesData.filter is not a function at handleSearch

exercisesData.filter is not a function
at handleSearch

create exersices

populate exercises into firestore

I am getting a white screen and this errors

I am getting a white screen and this errors

Please help me to add the specific icons instead of only gym icon.

Please help me add specific icons instead of just the gym icon in the BodyPart.js. I'm having trouble adding icons like a back icon for back exercises, a chest icon for chest exercises, and so on for other body parts. Your assistance with this would be greatly appreciated.

Blank Screen after loading app!

Excellent tut! Went through the whole thing, paused and retyped whole code. I noticed I got a white blank screen near the end. I wanted to test different features to look at the code. I cloned the repo, inserted my rapid api key in .env and when I npm start it loads for a 1 second then goes to a blank white screen! Weirdly it seemed to work briefly a few days ago. So decided to start clean delete all folders, git clone and npm start (after npm install --legacy-peer-deps but now I have a blank screen immediately after loading(app appears for a second then goes blank white screen). I am tearing my hair out trying to figure out why this might be. Does anyone have this issue? The code hasn't changed and it is only a month. So I am at a loss!! Any help to why this might be would be amazing..

I did get these errors:

React Hook useEffect has a missing dependency:

Line 26:6:
React Hook useEffect has a missing dependency: 'setExercises'. Either include it or remove the dependency array. If 'setExercises'
changes too often, find the parent component that defines it and wrap that definition in useCallback react-hooks/exhaustive-deps

exercises.slice is not a function

when i click on the body part i get this error

tried to create new account on the rapidApi but still facing same issue.

exercises.slice is not a function
TypeError: exercises.slice is not a function
at Exercises (http://localhost:3000/static/js/bundle.js:428:38)
at renderWithHooks (http://localhost:3000/static/js/bundle.js:47733:22)
at updateFunctionComponent (http://localhost:3000/static/js/bundle.js:50615:24)
at beginWork (http://localhost:3000/static/js/bundle.js:52327:20)
at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:37325:18)
at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:37369:20)
at invokeGuardedCallback (http://localhost:3000/static/js/bundle.js:37426:35)
at beginWork$1 (http://localhost:3000/static/js/bundle.js:57300:11)
at performUnitOfWork (http://localhost:3000/static/js/bundle.js:56547:16)
at workLoopSync (http://localhost:3000/static/js/bundle.js:56470:9)

Module not found: Error: Package path ./dist/types is not exported from package D:\WD\react\gym_exercises\node_modules\react-horizontal-scrolling-menu

Compiled with problems:X

ERROR in ./src/components/HorizontalScrollbar.js 7:0-72

Module not found: Error: Package path ./dist/types is not exported from package D:\WD\react\gym_exercises\node_modules\react-horizontal-scrolling-menu (see exports field in D:\WD\react\gym_exercises\node_modules\react-horizontal-scrolling-menu\package.json)

What to do???

cannot destructure property

how should i solve this

Youtube exercise section is not getting displayed .

Even after following the steps mentioned in the video the youtube video section is not getting displayed but is showing on the console.

in exercises components lot's of error coming

Style MUI Buttons

Unable to style the buttons of material UI. Changing the color to the custom one seems to fail.
Using makes makestyles as a workaround.

Cannot read properties of videoId, thumbnails, etc

The search functionality is not working; it just keeps on searching. is that problem related to api

.env File

You have uploaded your .env file on github. Kindly remove your API Key. So that, no one can access that API for security.

bodyPartsData is not iterable

please check this code on SearchExercises.js: 18