I am trying to host a pre-existing react website on 101domains.com using wordpress and reactpress, but I am currently stuck in Manual Mode for reactpress. I have uploaded my build folder to wordpress, but I cannot start the server to host the react app. Here is the error:
Currently you are in Manual Mode, (this means, you can create React apps only in your command line) because:
Your WordPress installation needs access to "npm 6" or higher to create React apps from the admin interface. However you can go to the app directory and use create-react-app from there.
I am trying to figure out how to give WordPress access to npm, but I am new to WP, so I am quite lost. Any advice would be nice!
To use ReactPress with an existing create-react-app. You need to build it with ReactPress on a local WordPress system. I recommend localWP.
Install ReactPress there, copy your whole create-react-app into the apps directory, add a page slug from the WP admin and update the dev environment.
Then build your React app from the command line. Now you can push that build to your live website. There you must choose the identical page slug for your React app. Then it should show under your chosen page slug.
Related
I want to ask on how can I host my react app. It is a 3d product configurator.
I tried to host it on AWS Amplify but the 3d models doesnt load
If you want to host an application on aws amplify you have to create a build version of your app (assuming that it works already without any start issues meaning that you have a functional react app created with the command npx create-react-app).
Usually your react app runs on local host and it's basically like a test/development version of your app. When you take it into aws it really wants a build version of your app. The build command will generate everything you need for this. Navigate to your react application folder and
Run the command
npm run build
This will create a folder that you can send to aws amplify.
When you go to the aws amplify site it'll ask you if you would like to build a website or host a website.
Select host and then it'll ask if you would like to push it from a repository like github. For now lets just skip it and keep the deployment as simple as possible. Deploy without git for now.
Next, we want to click on drag and drop so that you can manually select the file build folder that your npm run build command generated.
Look for the build folder that was generated and drag that folder into the aws area. You don't actually have to click the 'choose files button'. Sometimes the box glitches and won't let you drag anything outside of the box. So what you can do is just open up your directories and manually find that build file in your folders. Drag it from there to the aws zone at the bottom of the screen.
Give your AWS app a name and env name.
From there you can deploy. Once you deploy it'll give you a site address. Also before you make your build, be sure that all of the packages you need are installed. I had an issue where my axiom commands were not working because I had not installed it prior to pushing my build.
So if your project depends on a certain npm package to run your .gltf files make sure that it is installed on your application. You should see it inside the node modules folder (in your apps local directory not the aws one).
I think AWS uses the node modules folder to generate everything your project needs (But I am not 100% sure of this). But it didn't work prior to me installing the package and pushing the build folder again to aws via drag and drop.
There are better ways to do this but this is what worked for me! Hope this helps to at least get your site up and running. Also hope it helps with any package issues that might have been happening with your 3d models. This is about as far as I can take you. Good luck!
I’m working on a project. In this project, I'm creating a React user interfaces to enter data. So now, I only can run the React project with npm start. That mean I need code to run the project
Is there any way to deploy my project locally? I mean, I need a way to run the React project without use of code. I need to deploy only on my local PC.
You can do this following:
Build your react project
Use server and visit your url. ex: localhost:8887
You can use Web Server for Chrome for server.
Consider checkbox:
If you check those checkboxes, others can access your site.
I am new to React. I have created a simple React application. I wanted to explore deployment and hosting options for React. I have worked previously in Angular and it can be deployed in IIS. can we do the same for React. Please enlighten me.
According to your description, I suggest you could follow below steps to host or publish the application to IIS.
1.Open cmd and locate your react application folder
2.Build the project to production folder.
npm run build
3.Open IIS management console and create a new web sites and use the build path as the physical path. for example: D:\ReactAppTest\my-app\build
Notice: You should pay attention to your port number.
4.Then you could use that port number to access your react application. For example: http://localhost:9965/
Generic: What kind of services must a hosting vendor provide in order to make it possible to have a React app hosted?
More Specific: If I create a website with React and React Router, is it possible to deploy it by just uploading the bundled output folder? This could be for example a dist folder containing index.html, bundle.js and an images folder.
Could this be as simple as deploying a simple web page (like one built with plain HTML, CSS and JS)?
Sure just do: npm run build
and you will have a folder with the static files. Upload those with your choice of file transfer method and set the permissions to the web host appropriately.
100% Working Example.
React App Hosting in Firebase .
You can read this blog
Host Your React Web App in few minutes.
Command runnning in Wrong sequence =>
firebase login
firbase init
firebase deploy
npm run build
Command runnning in Correct sequence =>
firebase login
firbase init
npm run build
firebase deploy
So I have a website and I want to deploy some of my projects on my portfolio website like mywebsite.com/first-project.html
I already ran npm run build so I have a build version with the static files and I put it on my website but the react index.html isn't return anything the div id of root is empty.
I have seen tutorial of deploying them through surge and github pages. I don't want to do that, I want it on my own website. How can I achieve this?
Edit:- I forgot to mention the projects I created are through the npm create-react-app method and I have run the static build through serve -s build on my local computer. I just want to do the same on my website.
Edit2:- In the future if I am creating a react based website with the intention of hosting on my own domain, what kind of groundwork should I lay to make it easier? Any node packages or routing or set up? Also would you recommend create-react-app for this purpose if not what method would you recommend?