the landing page and all other pages are developed in react, one page developed in angular. How to route to the angular page from the react page or How to configure server config files to handle the request accordingly.
got stuck for the last 2 days, your help will be appreciated.
Related
I have a build a React website and hosted in Hosting er. When i go to website and open another page and refresh, it's showing "Oops, looks like the page is lost." How i will resolve this bug? Is this problem with routing in React?
I need fully functional website like when i run in my system. But when hosted the pages are not working properly.
The reason the website shows 404 is because in react all routes go to the index.html to render the components. But in a standard hosting it will look for a HTML file in the route's directory which doesn't exist in a React Application. Hence we configure our hosting service to redirect all request to the root index.html.
In your case since you have hosted on Hostinger you may use the follwoing guidelines to make updates to your .htaccess.
Official Guidelines from Hostinger:
https://www.hostinger.in/tutorials/what-is-react#How_to_Deploy_a_React_Application_on_Hostinger
I am very new to react and trying to build an app with a react front end and MVC/web API backend. I am running into an issue.
All I've done is created a sample ASP.NET core web app with react, based on the included Visual Studio template. dotnet new react. I've made no other changes to this code.
This app is currently deployed to an Azure app service at: https://examplemvcreact.azurewebsites.net/
Expected: If I visit the url https://examplemvcreact.azurewebsites.net/weatherforecast, I would expect, the weatherforecast controller is called, and its data returned.
Actual result: I get what appears to be a blank index page, with the header rendered correctly.
However, I also notice: that if I do a full refresh, control+f5, on the url https://examplemvcreact.azurewebsites.net/weatherforecast , it DOES in fact hit the controller and give me the data.
Can anyone help me understand how this routing is working? Locally, I don't have this issue.
thank you!
It was the service worker. I removed the import and call in my index.js file, and my mvc calls are now going back to the server as expected.
Hi I am working on a project where I am using Laravel routing and AngularJs routing at the same time but the problem is when I reload the specific page laravel routing get active and angularjs routing get deactive.
So how to prevent the pages to go for laravel routing while refesh the page?
As Iron Router introduction in https://github.com/EventedMind/iron-router,
Iron Router is a routing package for Meteor. It makes single page apps.
However, I don't understand how it works.
In Angularjs or Backbonejs, each route contains a hashtag, for example
example.com/#about
example.com/#service
I can understand that this is just one page example.com. The hashtag indicates that although there are two different URLs, both of them are still example.com but at different states. If we navigate from example.com/#about to example.com/#service, we are still in the same page which is example.com and only part of the layout is changed.
In Iron Router, the routes do not contain hashtag, for ex
example.com/about
example.com/service
To me, the two URLs represent two totally different states. If we navigate from example.com/about to example.com/service, we have to refresh the page and load new page from the beginning.
So the question is How Iron Router renders single page web app, what is its mechanism?
Building a single page application without a hashtag needs some routing rules implemented at web server level. Not sure how Iron Router does it, but if
example.com/about
example.com/service
pointing to same page, there should be some routing on server which says, route example.com/* to index.html or some thing like that. Also Single Page Applications without hashtag has some compatibility issues in older IE browsers, keep a tab on that.
I am trying to load a yeoman angular app only once the user hits a specific page inside of express (e.g. '/dashboad').
The end goal is to have multiple static front pages on express without using angular. Then I would use the angular routes/ application once a user has logged in.
I have successfully followed Yeoman inside ExpressJS
but this boots up angular right from the start and does not allow routing to any express html pages.
We already chatted about this in person, but the answer here is to not have your Angular app be the base route in Express. You would have separate routes in Express for each of the static pages and finally one route for the Angular page. For example:
/ => /index.html
/dashboard/ => /dashboard.html (this is the Angular app)
/faq/ => faq.html
As long as the Angular app script is not loaded outside the one Angular route, everything will work as you expect.