I would like to know if there's a way to use create-react-app offline rather than have it download files from the internet everytime. Doing this, seems like a huge waste of bandwith, and time, as internet speed is very slow and expensive where i reside.
Now there is an NPM package for that it called create-react-app-offline
Installation :
npm i - g create-react-app-offline
Usage :
crao -n <app-name>
For more informations on GitHub
Every-time you do npm i, it also checks for updated packages and updates your package.json . The app can be made offline but your node modules will be downloaded ( they are added to git ignore) if you upload them to git.
If net is really an issue there then I'd suggest getting a pen drive or something where you can upload your files and access them without re-downloading
I found a npm package called create-react-app-offline which initializes the react project offline. And I checked it myself.
Here's the link
Create React App Offline Package
Just install it globally and run the crao -n <app_name>
Related
I have a react(specifically NextJS) web app running on a Linux Azure Web App Server. I have it deployed and working correctly via GitHub Actions. However, I'm having issues finding the most efficient way to deploy the node_modules.
Here's what I've tried.
I've ran the install and build within GitHub Actions and deployed the package as a zip artifact. However, the file was huge due to the node_modules and takes 10+ minutes to deploy.
I've created a postDeploy script to run after deployment that runs an npm install. Not sure if this is the best way to go about it so I reverted this.
For the startup command, I have azure running npm run start:prod. I thought about changing this to npm install && npm run start:prod . I'm not sure if this is a good idea either
What I've settled on so far is I just manually get on the server and run npm install after a deployment. This won't work for CI/CD though.
I've read that azure kudu supposedly detects package.json within the wwwroot folder and will automagically install dependencies but I haven't seen this work, nor could I find any documentation on it. So far, my best idea seems to be to change my startup command to run an install before starting the app but I'm not sure.
Any advice?
There shouldn't be a big difference between GitHub Action and Azure DevOps in that terms. But what should you do actually on your pipeline is run npm run build command and publish only produced output.
Please take a look here how it looks on Azure DevOps.
It's my first experience with react and as stated in official docs, I was trying out create-react-app to create my first react app.
But I notice that it takes around 15-20 minutes to get finished( even though I have good internet connection) and once it was completed, I noticed the space taken by the newly created folder to be around 165-170 MB.
Isn't there any quicker way to get started with react as the above mentioned method probably installs some modules that are never going to be used.
Thank You.
I also faced the same problem when i first started learning react. What i did was i manually configured webpack to bundle my code. And then i created central node_modules folder in particular place. So anytime i want start a react project i just create a symlink to the node_modules folder. And also if i want install a new package, i go the central folder and install it, so the package will be available in the node_modules folder and for any of my project that may need it. That way i only need to install a package once not every time i want to use it for a new project.
But recently i found a package manager called pnpm. Instead of downloading a package anytime need to install it, pnpm maintains a central cache of packages such that anytime you want to install a package, it just creates a symlink(or junction in windows) (similar to what i used to do).
Conclusion
In conclusion i would recommend you to just configure a bundler (vite is cool) by yourself and use pnpm to install packages. You can read more about pnpm on there website
I'm new to yarn, nodejs and react apps. I've tried running the Sizzy app and it works on my local XAMPP server if I first run yarn start in the cmd terminal and then access via http://localhost:3033, but after a while I have to rerun the same command. I've tried yarn build and then navigating to the build directory but that just loaded a page with a header, it didn't have the same functionality. And the contents of the build directory looks very similar to the contents of the public directory anyway.
I've had a look at this SO post and this one but still unsure why I need to run yarn start everytime.
UPDATE:
I'm still not sure how node, react, and electron fit together and why each is required, much research and learning still to do! Rather than a 'react app' I believe I'm looking at an 'Electron app'. I think if I run the command npm run package-win then I think I should get an exe file and some dlls. But how to instead setup for running on an Apache web server without having to start using the command line, or would you just have to build it with different architecture?
Starting to get a vague understanding from reading this.
If you used the npx create-react-app <app-name> then you just have to change the "start" script in the package.json file as "serve -s build". Run yarn add serve to add For deployment, Heroku is a good choice. Create a Heroku app and connect your git repo to the newly created app. Then go to the deploy tab and deploy your branch.
I have been trying to deploy my create-react-app on a server but have been unable to do so. I created a homepage field in the package.json as instructed and set it to the https://... domain address. Then I ran npm run build and created the build file. I am finding resources sparse online, instructing me what to do after. Running npm start just runs from the root directory, not displaying anything. The source shows and index.html file which paths are stuck at the root. I am wondering what I need to do to run/deploy the build(production). I have tried downloading the npm package serve, but this seems to do the same as npm run, if not worse. I feel like I am only moving in the opposite direction, and would love some assistance. Thank you.
You need to run npm build.
This creates files in the build folder.
These files you then need to take and put them in a folder that is served by a web server.
You can use Nginx, Apache, IIS or any other production ready web server.
You have an IT department, ask them where exactly you need to put your files.
I am presently reading Manning's AngularJS in Action by Lukas Ruebbelke
The introductory part suggests,
Because you’re pulling files from a CDN, you’ll need to run
Angello Lite(the application name) from a web server. There are a few ways to do this, but one of the easiest ways is to use the npm package serve.
The steps for installing Angello Lite are as follows:
■ Install Node.js. You can find all of the information to do that at http://
nodejs.org/.
■ Install the serve package by running npm install -g serve from the command
line.
■ Download Angello Lite from GitHub, using the URL given above, and place it
on your local machine in a directory named angello-lite.
■ Navigate to the angello-lite directory from the command line and run serve.
■ Go to http://localhost:3000 in your browser to see the application.
Does learning Angular JS require previous exposure to node and git?
If I have Apache Tomcat already configured on my local m/c, what is the procedure to start with it?
Furthermore, just to keep in sync with the author, I installed git and then cloned a dir onto my local m/c from github.
Then i install node.js and Install the serve package by runningnpm install -g servefrom the command line.
Unfortunately when i navigate to the angello-lite directory from the command line and run serve, it shows me
where angello-lite is the repository where the application resides?
Any suggestions on how to configure successfully?
I have no idea regarding node.js and git. Do i really need to learn
these to begin with AngularJS then.
No, that's not a requirement. You don't even need a web server. You can have your static HTML files locally or use some online service like plnkr. Obviously if you need to work with dynamic data then you will need a web server. At some point you might want to start making AJAX calls in order to fetch some dynamic data from your server backend.
If I have Apache Tomcat already configured on my local m/c, what is
the procedure to start with it?
Just add an HTML page to the root of your website, open your favorite browser and invoke this page.
You don't need those tools to learn Angular - you can download latest package from the AngularJS website (both for development and for production).
Node.js and Git may be necessary to pull and build packages from the NPM, run tasks and many more great features, but just to learn Angular all you need is its code.