I have plesk(windows) hosting. I want to host MERN app on it. I am able to add nodejs app on it but cant add react app. i have database on mongodb atlas.
I cant even set custom variables on it.
on hosting nodejs app "/" res.send("running") works fine but no other route work. and cant even see my react app.
Anyone has any idea how can i host it to Plesk.
If you have VPS hosting you can try the below steps.
Open the file manager and check for the folder create-react-app. Add the following .htaccess to your public folder.
Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]
Run npm run-script build
FRP the entire contents of the build directory to your Linux server on Plesk
If you have a shared hosting service, you may not host MERN app.
I've created a react app with the following folder structure
-public
--dist
---bundle.js
---styles.css
--index.html
--images
-server
--server.js
-src
--components
--app.js
-.babelrc
-package.json
-webpack.config.js
I want to upload it to cPanel. Is that possible? Would I also need to upload the node_modules/ folder?
here is a link to my repo: https://github.com/theoiorga/react-expensify-app
step 1:"homepage": ".", -->add this on package.json file
step 2 : npm run build --> this will create a build folder.
step 3 : make a .htaccess it will look like this
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule . /index.html [L]
</IfModule>
step 4 : now take all the files in build folder plus your htaccess and drop them in the desired domain or subdomain
Follow the steps to deploy your React website on CPanel
Step(1) : Under your local project directory run this command "npm
run build" or "yarn build" then "build" directory will be created. This directory contains the bundle of all static files with dependencies which you can directly copy onto your production server.
Step (2) : Go to inside the "build" folder and select all files and compress or make a Zip then upload in cpanel it will work.
Note: for react app no need to upload whole projects we need to deploy only "build" directory.
To Deploy React App on Cpanel/Server. Please follow the Steps
Step 1) Go to Package.json file and add this Property "homepage":"http://yourdomain.com" and paste your domain within it. Like
Step 2) Now build the App using npm run build
In your project directory it will create a build folder and it will contain all your static files for project. Zip all files and upload on your cpanel directory where your website run.
Step 3) Create an .htaccess file and Place it on root directory. And paste the below code in .htaccess file.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule . /index.html [L]
</IfModule>
Now Run your Project. It will Work.
Thanks
I had the same issue recently. As a newbie to React, I have deployed my app to Heroku many times, as part of the React course. However, I wanted to deploy to my own shared server (CPanel), to learn how it is done. But also to use my hosting to host other apps I code.
Anyway, What Kallayya and Sumit mentioned above both needs to be done. There is also a great step by step information here.
NB. If you did not use something like 'npx create-react-app' to create the app (boilerplate) then, you will not get a 'Build' folder.
My initial boilerplate was created from scratch as part of the course. So I was initially confused about why I was not getting a Build folder. Then I realised that 'Build' folder is created if the app was created with e.g. 'npx create-react-app' or 'yarn create react-app'. I had used 'npx create-react-app' to start another project. In the new project, I was able to get a Build folder. Hence, my realisation.
So if you run a build and you don't get a Build folder (as mentioned above). Then the files to deploy to live will be the content in the 'public' directory on your local site. (If you have env setup for production and development, then you may need to build for production e.g. yarn build:prod).
Now follow the same process in the step by step link, above. However, upload the content from your 'public' directory in your local site, to the public_html folder on your remote hosting server. Create and upload your .htaccess file as shown on the page of the above link. Now view your site at your relevant domain.
Following the steps in the above link, I was able to deploy to my Shared hosting and view my app at my domain. It works perfectly fine. Haven't seen any issues yet.
I hope this will be helpful to others.
I resolved it by implementing the following steps
Step 1
Add the following in package.json
"homepage": "."
Step 2
Add the following in the public/index.html above meta: description
<script type="text/javascript"> document.write("<base href='//" + document.location.host + "' />"); </script>
Step 3
Build your App using npm run build
Step 4
Upload files inside /build folder to the server using any file transfer tool
Step 5
Create and add the following in .htaccess
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule . /index.html [L]
</IfModule>
Just upload your local public folder to your hosting public_html folder
Make sure your hosting provider supports Node.js that you will see on CPanel.
The company I use is Namecheap and they just added Node.js runtime environment to CPanel.
Contact your hosting company and ask them if they support Node.js
I’m agree with the fact that you should have a dedicated or VPS hosting, because you will need to have control to the command line.
What I would suggest you to do, apart of what has been mentioned in other comments (accessing the cPanel via SSH and install node and npm, etc), you should upload the files using GitHub or BitBucket.
When you do it this way it will be even easier to keep updating your web app every time you need.
I imagine you have ssh access. If you do install NodeJS via SSH and then upload your files, it will be better if you do it on your public_html. Not only the build but the whole project. I would do it using git.
When you have you files up you will have to install npm and in your client folder you have to install your client, because just uploading the node_modules folders won't work.
You should install forever and run forever node server.js, that will make the server run even when you close the terminal
I hope I explained myself.
I have a hosting plan with siteground and I can host as many websites as I want with that plan.
Hosting a react app with siteground was super easy once I figured it out.
I got a good chunk of what I know by reading this thread, so if you want visuals you can look to the top answer.
Step 1) Add "homepage":".", to the object in your package.json file.
Step 2) In your terminal run npm run build
Step 3) Add a .htaccess file to your build folder with the following code:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule . /index.html [L]
</IfModule>
Step 4) Use a file manager to upload all of the files from your build folder including your .htaccess file to the public folder on the server. I used FileZilla, but you can use the built in file manager or SSH keys. If you don't know how to make an FTP user, go here.
Siteground specific instructions:
Step 5) Navigate to the site tools for the desired website. (You can even use a temporary domain for this).
Step 6) Install an SSL certificate in Security > SSL Manager. (You can use the free one. Take note of the expiration date.)
Step 7) Enforce HTTPS by going to Security > HTTPS Enforce and turn it on.
That should work! Send questions if you have any.
I have no affiliation with siteground or any company. I am a freelance web developer that is developing my react skills
React applications are built on Node.js and do not work out of the box on Cpanel.
I am assuming you are working with a Linux server. To deploy your react app, you need to do the following.
Make sure you have root assess to the server. That is only possible if you are working with a VPS or dedicated hosting and not shared hosting.
Log into your account using SSH
Install node.js and npm on the server
Upload your build files to the server
Run the command to start your app in production.
These steps look easy but are a bit complicated. If you are a newbie who just started working on react, I will advise you not to bother yourself with these steps. You can easily get your react app working in less than 10 mins with a cloud service like Heroku for free too.
I have my working worpress domains, subdomain and alias working normally and locate at root web server "www/".
htpps://domain.com
htpps://domain.net
htpps://en.domain.net
Later I decide to install a support web application in same server in folder "www/support/".
Setting this support app I needed to set one domain or subdomain, and I set "support.domain.com".
After last step I realise that all the following URL's could access to the support app:
htpps://domain.com/support
htpps://domain.net/support
htpps://en.domain.net/support
htpps://support.domain.com/support
htpps://support.domain.net/support
Since this support app doesn't work correctly with differents domains or subdomains from the main one that was set initially ( that was: "support.domain.com" ), I'm trying to redirect all to one unique subdomain: "support.domain.com".
The file ".htaccess" locate in support app folder ("www/support/.htaccess") still empty, all rewrite rules I try didn't worked, due my low knowledge.
How could I redirect all accessible URL's to only one "support.domain.com"?
or
Block all access to this folder "www/support/index.php" that are not "support.domain.com"?
I found and try lots of similar questions but none work correctly or give too many redirections.
in support.htaccess, you can use the following rule
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} -f
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.+ http://support.domain.com/ [L]
After several time pass over, I finally locate the problem, double quotes was “ instead of "
This small details was creating problem in every .htaccess file in my host, after this correction all working correctly and it reach support/.htaccess now.
A site I've been working on, which has been working fine on my local dev and live dev environments is giving me issues when I try to deploy it to a live server (the client wants to host it with their existing hosting provider).
I uploaded the site to the server and updated the database config as I have done many times before on both my and other's servers without issue. This time, however, I was presented with:
SilverStripe Framework requires a $databaseConfig defined.
When I removed the .htaccess file from the root folder, the site appeared, however, all the URLs appeared like so:
www.domain.com/index.php/page_name
After a few searches, I came across a solution to the index.php issue; to add the following to my _config file
Director::setBaseURL('/');
I did this and the URL's appeared correctly, however navigating to them would give me a 404.
I reinstated the htaccess file and narrowed it down to this block:
RewriteCond %{REQUEST_URI} ^(.*)$
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !\.php$
RewriteRule .* framework/main.php?url=%1 [QSA]
When this is in place, I get the database config error mentioned above, when it's not there, my urls produce 404s
Does anyone have any insight as to what can be going on here? I've had a lot of back and forth with the host and he's not very knowledgable and can't offer any advice and I'm no genius when it comes to this side of things.
I'll assume you are using SilverStripe 3.1+ so the Director config could/should be placed in your YAML config file (the static will be deprecated):
Director:
alternate_base_url: '/'
Although this helps mainly on issues with base_tag.
The main ModRewrite issue might however be solved by adding a RewriteBase:
RewriteEngine On
RewriteBase '/'
You can use '/' or the folder SS is installed in if not the public root. This is usually automatically handled by the SilverStripe installer by checking $base = dirname($_SERVER['SCRIPT_NAME']); and other little things. Check install.php5 line 1483, you might be able to use this to figure out your RewriteBase.
If that doesn't work, try a fresh install instead of copying to the server your local install.
Do you use a _ss_enviroment.php to define your database config details? I had a similar experience like from in a project i migrated from SS 2.4 to 3.1.2.
Set this in your site _config.php
// Use _ss_environment.php file for configuration
//Please note that your system should have a file, _ss_environment.php, with database connectivity data,
require_once("conf/ConfigureFromEnv.php");
global $database;
$database = '';
I hope this helps
I want to set up a blog on my current domain at
http://www.ashrobbins.com/folder/
and use htaccess so that it can be reached by simply going to
http://folder.ashrobbins.com
The rewrite I currently have in my .htaccess is below.
RewriteRule ^blog$ blog.php [L,NC]
But I get a page not found when I go to folder.ashrobbins.com in my browser...
You must setup ashrobbins.com in your host to serve content from a local folder, and add a 'folder' folder inside it.
And also setup folder.ashrobbins.com in your host to serve content from another local folder. As I can see, you haven't setup folder.ashrobbins.com nd therefore you receive that error.
It seems you are creating a new site and doesn't know how to do it. If it's new, just setup subdomain.ashrobbins.com and put your site on it. If there's nothing already served in ashrobbins.com/folder/ just don't mess with it.