React App not working

Glitch Help
1

I am trying to create my first React app in glitch but having issues. Here is the error that I get:

failed to start application on iron-hushed-wallflower.glitch.me

** This is most likely because your project has a code error.**
** Check your project logs, fix the error and try again.**

Here’s the code:

This code works in a different environment.

Any help would be much appreciated.

2

It’s work for me!

3

Are you saying the link I provided, the code renders in the browser?

4

Hey! Your components folder needs to be under src. Also then make sure your route to People.js is correct - use one dot before the slash since you’re no longer going outside the folder to retrieve it:

import People from "./components/People";
5

I made those changes but now I don’t get any error, only a blank screen. Any ideas?

6

I would try changing the repository url link in package.json to match your site. I don’t know how much that matters but that could be it. Then also try going into your Tools > Terminal and just type refresh. I don’t see any issues with your code…If none of that works, you can add me as a collaborator and I can take a closer look!

7

I don’t anything about React but if this is from a template I would guess the odds that it throws an error are minimal.

I always recommend reducing the app to it’s bare essentials and getting it to run before adding things that could go wrong. So if the People thing is something you added I would remove it temporarily.

One of the people, “Jane”
defines an image at

www.utsa.edu/financialaffairs/budget/imgs/female_avatar.png

but such an image does not exist, any chance that is the issue?

1 Like
8

Hi, there are a couple of issues with your code. I remixed your app, and you can find the code at Glitch :･ﾟ✧ and the demo at https://rural-flashy-holly.glitch.me.
The changes I made were:

  • adding an index.html: at the moment, vite doesn’t know what to do with your code. This makes sure it actually serves a file.
  • renaming .js files to .jsx: otherwise vite doesn’t know that they’re jsx files and raises a syntax error

I didn’t fix the image not existing.
Hopefully this helps - happy glitching!

2 Likes
9

Looks like @Pufferfish101007 figured it out, but I wanted to add that the .jsx extension is what Vite prefers. If you use something like Create React App for a starter, it will install .js files by default. Both are correct. But you’re more likely to see .js in any example code or tutorial.

2 Likes
10

Thank you all so much for your help. @Pufferfish101007 's solution worked! @christina , thanks for hanging in there with me. much appreciated.! :slight_smile:

2 Likes
11

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.