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 trialSharad Shivmath
14,446 PointsWhere does the program begin when you hit 'npm start'?
Hi,
When you hit 'npm start', which file does it execute first? App.js is just a module. Looks like index.js sort of brings everything together.
I checked the registerServiceWorker.js file. There are a bunch of functions defined in the file.
I have no idea what is happening when you hit npm start. All I know for now is that somehow bundle.js gets created and gets included in the HTML file. But, I don't know how.
Can someone please explain what's happening?
Thanks, Sharad
1 Answer
Ari Misha
19,323 PointsHiya there! I was watching this vid on Google developer's channel on youtube like couple of hours ago ,and it was about PWAs(progressive web apps) and its toolings and how browsers handles 'em behind the scenes. There was a section of 5 minutes where they explained the power of Service Workers and Web Packs. and React. So basically Service Worker is the script file which wrap up your offline browsing, offline caching, push notification, smart browsing and so much more. Its considered like future of web apps. Its like having your own mobile app but on browser instead. Currently React is a very exciting prospect and very active project in the IT industry.
Now about npm start, this command executes your server in development mode. I mean when you're developing on local machine, you do need dev server right? If you dont wanna use the power of create-react-app , you can always eject from it. More experienced developers use web packs and babel-cli to configure their projects in their own way. With this way , you're in control of whats going on in your app. Whereas with create-react-app you're not in control of whats going on the behind the scenes.
Now regarding bundle.js, as the name suggests , it bundles all the assets in one file in production environment. Remember when i told you about Service workers and caching, bundle.js makes it possible to cache a certain component of your app for offline caching and faster performance of your app. I gotta say i was really impressed with everything about React. I mean dont ya?
~ Ari
Sharad Shivmath
14,446 PointsHi Ari,
Thanks for the detailed explanation. I already have an understanding of what you said.
I'm just looking for the file in create-react-app that has the entry point for 'npm start', and I cannot find it anywhere in the files.
Ari Misha
19,323 PointsSharad Shivmath Yeah you wont find one! Thats the thing with create-react-app , it all happens behind the scenes. Most of the React developers choose Expressjs for their backend server. Even if you're working with create-react-app , there will be a time when you're gonna have to choose your backend server in production environment.
~ Ari
Adam McGrade
26,333 PointsAdam McGrade
26,333 PointsIf you look in /node_modules/react-scripts/scripts/ you will see the various script files that have been mapped to the npm commands in the your project's package.json, In the /node_modules/react-scripts/scripts/start.js file, is the boilerplate code required for building the project and starting the development server.