Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialAF Content
21,460 PointsWhy can't I view React app in browser?
I set it up exactly as the video is telling me to, but for some reason when my app runs in the browser I see the React logo and then a message underneath that says "Edit src/App.js and save to reload." Instead of actually seeing the app in the browser.
Did I do something wrong or miss a step? I've rewatched the video a thousand times and can't seem to figure out what the problem is.
William Wei Luan Ting
4,254 PointsI seem to remember having a similar issue when I started with React. I can't seem to remember the exact solution I did for this. If you post your code it will help. But here are my exact steps I use to setup a react environment from scratch.
Install Node.js Install VisualStudio Code from vs code's terminal install react by tying ins "npm install -g create-react-app" from any directory you can then type in "create-react-app my-app" a folder named my-app will be created, navigate to this directory and then type in "npm start"
if you do all the steps above it should work.
michael williams
19,492 Pointsit sounds like your code is working just fine. when you run npm start at first that is your first thing you see in react. when you run create-react-app you see the react logo and edit src/App.js next you need to delete the stuff inside of App.js and add your own content inside of App.js you import your components, and add them to the App.js file
import React from 'react';
import Header from './components/Header';
class App extends React.Component {
render() {
return (
<div>
<Header />
</div>
)
}
export default App;
something similar to this... to kick it off. best of luck.
2 Answers
Johnny Austen
Front End Web Development Techdegree Graduate 35,494 PointsSo my solution to this was to create the app, remove all files and folders within the scoreboard folder created by create-react-app, replace them with the project files, then run npm install, and then npm start.
Nancy Melucci
Courses Plus Student 36,143 PointsI tried this and it identified my first react component as an unexpected token. (<header>)
I love Treehouse tutorials but so often the installs of additional software or other crucial IDE/software/files goes off the rails locally, and then you can't really follow along by doing the coding. It makes me sad. Really.
Nancy Melucci
Courses Plus Student 36,143 PointsUpdate: I gave up on using npm-create-react and just started using my Atom IDE and local development server from the first tutorial. I would like to use this method (above) but I don't want to spend hours figuring out how to make it work when I can just keep on the tutorial.
Dane Parchment
Treehouse Moderator 11,077 PointsDane Parchment
Treehouse Moderator 11,077 PointsCan I see your code? It's possible you are editing the wrong file, and so you aren't seeing the results change.