#learningjs

The React website (https://reactjs.org/docs/add-react-to-a-website.html) lists a couple of ways to add React to a web app that differ from the manual shell script specified in Stoyan Stefanov’s book (https://amzn.to/2YIJD27), which is the book I used to learn React a while ago. Unfortunately, updates to React and Babel prevent the original shell script in that book from working.

I still think it’s worth knowing what’s going on in the compile / bundle process rather than having it all hidden away with the two methods on the React website, so let me show you a way to update the script so that it works with React apps today.

Create the following shell script called build.sh (or whatever you want). Also, change the css bundling to fit your particular director structure, and the name of the js app file to whatever you use. The echo date line is just to see the finished time in the terminal. 

And add the dependencies to your package.json.

Now run npm install to get everything installed, but remember this installs things locally in your project folder, not globally, so Babel and Browserify won’t run on the command line (as your project folder isn’t in your $PATH variable). So add your build shell script to the the “scripts” section of package.json.

Then, to run it, navigate to your project folder in your Terminal and type npm run build. This will run the shell script and find the executables in the appropriate places in your node_modules folder. Old school build method!

Hope this helps! Follow my blog for more tips and insights!

Disclosure of material connections: Some of the links in the post above are “affiliate links”. This means if you click on the link and purchase the item, I will receive an affiliate commission. Regardless, I only recommend products or service I use personally and believe will help you out! I am disclosing this to comply with Federal Trade Commission 16 CFR 255. 

Hi!

As was telling you in the last post, our website is nearly done. I am now learning about Data Types in JavaScript and even though I know HTML I am not very confident in going into the “deep” database of our website because I don’t want to ruin it.

What I found very interesting though is the fact that I am starting to understand some things and commands in the website. Which I think it’s pretty great! Because I can imagine me one year before seeing my boyfriend (he is frontend and backend developer) as he was building something on the web and I was completely fascinated by all of the lines and things and did not know what he is doing at all.