I have used angularjs framework for front-end and asp net mvc for back-end to develop my web app. As you know angularjs has a major flaw when it comes to SEO. There are some solutions like using phantomjs to create snapshots of website and serve it to search bot instead of original website. But I don't like it that way. I've recently introduced to the concept of isomorphic web apps and if I'm not mistaken it is possible to pre-render angularjs apps on server and then serve the rendered html to client. All solutions I've found was for other frameworks. Like Rendr (https://github.com/rendrjs/rendr) or angularjs-server (https://github.com/saymedia/angularjs-server). Also there is a library called NodeServices (https://github.com/aspnet/NodeServices) that do the trick but it's written in Asp.net core and angular 2 universal that I use neither of them. Is there any library doing the same work for asp.net and angular?
Thanks in advanced.
As stated here How do search engines deal with AngularJS applications?
Google now execute javascript when crawling the web. The problem is that a there's no standard, ,you can't assume that any search engine will correctly crawl your web application when is client-side rendered.
Related
In ASP.NET Core 2.2 it was rather straightforward to have an ASP.NET Core website with React front-end and working server-side rendering - since SSR was supported out-of-the-box in the ASP.NET Core+React template, which internally run the NodeServices to executed the javascript using node.
However with ASP.NET Core 3.1 things are not so easy anymore, mainly because the SpaServices and NodeServices classes are declared as obsolete and will be removed with .NET 5, according to this link. So no javascript execution with node from C# anymore.
Now, besides the information, that the server-side rendering suggested in ASP.NET Core 2.2 is now obsolete, the only suggestion how to go forward I found is from above article:
To enable features like server-side prerendering and hot module reload please refer to the documentation for the corresponding SPA frameworks.
But if I understand correctly, to have react-based server-side rendering, I need to have a node.js server which will perform the rendering on the server-side.
Does that mean, that if I want to have an ASP.NET Core 3.1 website with a React front-end with SSR - I should have one ASP.NET Core project for the WebAPI, and another separate Node.JS project for the front-end with SSR?
And then deploy them on two separate Azure AppServices?
Is that the recommended architecture for ASP.NET Core + React projects?
I came across exactly the same problem. It took me a few weeks to create a new set up where frontend is separate from the backend.
I published the prepared boilerplate on GitHub and wrote a blog posts that explains how to enable server-side rendering with ASP.NET Core and React in details. The solution is a combination of CRA (Create React App), Storybook for CRA and a standard ASP.NET Core MVC template.
To make a long story short I built my custom asp-prerender-module and asp-prerender-data attributes. They communicate with an Express server based on Node.js to get the rendered HTML. Thereafter the HTML served to the browser gets "hydrated" with actions.
After spending some time researching, that are the current options:
Live on .NET Core 3.1 with the NodeServices with an obsolete flag
Create separate projects for back-end (asp.net) and front-end (node.js)
Fork/copy NodeServices and maintain by myself
Hope that a there will be a community driven fork of the NodeServices in the comming months before .NET 5 release were it will be removed eventually
You can use a new library to invoke JS from .net which is
https://github.com/JeringTech/Javascript.NodeJS
You can use SSR on .net with the above library Razzle described here:
https://dev.to/pruttned/integrating-react-into-asp-net-core-using-razzle-with-all-the-goodies-like-ssr-routing-code-splitting-and-hmr-part-1-2-34g8
BUT at the time of writing I find that there is no information on how to deploy such an application.
Reactjs is working on the Server component to stream partially rendered UI in the form of JSON data to clientside. https://github.com/reactjs/rfcs/blob/2b3ab544f46f74b9035d7768c143dc2efbacedb6/text/0000-server-components.md
I think for future integration of Server component, it needs a native NodeJS process to handle server rendering.
I have worked in ASP.NET CORE MVC, before.
What are all the advantages in using ReactJS over ASP.NET CORE?
Would not that additional library & its components, slow down the page
load, comparing plain Razor Views?
I tried web search, I am unable to get proper answers.
If you have independent apps in PC,Phones tablet,etc,you could just use React and core web api which is front-end and back-end separation.
By using Angular/React with api in server side:
1.You eliminate process of generating HTML in server side and you save CPU.
2.API produces small payload (json) and Razor (html) would be much larger in size, constant full page reloads and postback round trip. so API and SPA save bandwidth.
3.API and SPA could have different versioning, scaling and deployment scenarios.
4.By using API you can support mobile app too and if you start by Razor you may need api in future.
Below are some opinions on using Angular/React or razor:
1.Razor supports mobile,and both are optimized and fast in their own way. Razor optimizes code by not using a tree like MVC does. React is client side so it doesn't really use a tree, but also optimizes data in the HTML to an extent.
2.Angular (or React) is far superior in terms of performance.The model-binding aspects of Angular is a gigantic advantage of server-side rendering. Using Razor(or server side rendering in general) does, however, lend itself to better overall integrity as far as data goes and it makes for a better transition of data from front-end to back-end.
See ASP.NET Core 2.0 Razor vs Angular/React/etc
What are all the advantages in using ReactJS over ASP.NET CORE?
ReactJS is high performance and rapid development client side framework, you can use it throw asp.net core or any other server side framework to handle client side operations.
Would not that additional library & its components, slow down the page
load, comparing plain Razor Views?
ReactJS designed to be a single page application, and this kind of apps is more faster than multiple page applications, also ReactJS processing the DOM in different and smarter way.
If you want to use ReactJS in asp.net core you must keep in mind that asp.net core is the api part just to return the data (json or xml) or to receive your ajax request to post data.
All clients side parts will handled by ReactJS, no razor views, you can have only one to reference your reacts application or simply you can reference it using plain html page.
I need to write a simple app which will work in a cloud where I can store data about clients and it will be avaiable from Windows and Android and I assume it has to be a website.
What is the difference between ASP .NET Web Forms Applcation and ASP .NET Web Forms Site? Which one should I use?
Web Form Site is nothing more than previously called Website projects where you work with webpages which is just small php like (with Razor/aspx) script files which render as html.
Webform is more like a component oriented framework. Web Form Site or WebSite should only be used for small projects or if the project needs to be compile in C#/VB both language. Also if you want to put your all source code in web-server then it can be used. On contrary with WebForm application you don't need to put code base files to run the projects - you'd be better off only putting scripting .aspx files.
This has been explained in detail in the following question:
ASP.NET Web Site or ASP.NET Web Application?
Also, you can check out the differences between the two here:
MSDN
Regarding your first question if your app is native or hybrid then you need REST(WebApi in .net world) which any app can access natively regardless of the device and will meet your needs of the "cloud".
If you what you want is a website instead that is "viewable" by mobile devices you may want to make your website "responsive" and you can look at various bootstraps templates that can help you with that.
Regarding your second question I think it has no bearing nor it will make any difference in creating a mobile app which project type you use.
I know in ASP.NET MVC you can have mobile views and do things like Index.mobile.cshtml and _Layout.mobile.cshtml and the server knows to serve these views/pages to mobile devices rather than Index.cshtml and _Layout.cshtml, but can this also be done in plain ASP.NET websites (not using MVC)?
Note : I am using razor syntax in the plain ASP.NET website.
Thanks in advance.
-- Lee
UPDATE :
To clarify, I am aware of the various browser detection methods. My question is specifically about whether mobile views in the form Index.mobile.cshtml are available in plain ASP.NET.
UPDATE (Functionality now included in ASP.NET latest release announced 18th February 2013) :
Talk of the devil.. this is now possible in a recent release..
Scroll down the page to the heading 'ASP.NET Web Forms Enhancements'
http://weblogs.asp.net/scottgu/archive/2013/02/18/announcing-release-of-asp-net-and-web-tools-2012-2-update.aspx
Take a look at this, brief description of mobile support for ASP.NET Web Forms:
How To: Add Mobile Pages to Your ASP.NET Web Forms / MVC Application
My understanding is that the alternate view modes support native to MVC4 is a result of the WebPages2 used by MVC, and is currently only used within MVC to resolve locating Views via the View Engine (combination of VirtualPathProvider and DisplayModeProvider). This is because views served up via MVC and requests via the URI do not map to physical locations on the server to serve up files from. ASP.NET on the other hand serves up files directly based off of the URI, and does not depend on a virtual path provider the way MVC does.
My guess would be that ASP.NET does not support automatically serving up alternate files based off of the same framework that MVC uses. That being said, I'm sure it would be possible to derive an implementation based off of the of the logic of VirtualPathProviderViewEngine that could achieve a similar result with ASP.NET, however I know of no implementation that does this currently. Best suggestion would be to see if you can find usages of DisplayModeProvider and see if anything pops up.
I'm not an expert so feel free keep looking but I thought I would offer what I can.
So I have come to the conclusion that this is not built in functionality in plain ASP.NET.
Though there are (IMO less elegant) alternatives.
Are ASP.NET mobile views only for ASP.NET MVC? Yes.
Update : This may be possible in latest release
http://weblogs.asp.net/scottgu/archive/2013/02/18/announcing-release-of-asp-net-and-web-tools-2012-2-update.aspx
-- Lee
I already have an ASP.NET MVC3 website, using Razor as the Views engine.
Is it possible to create the UI using GWT and invoke it as a View in my MVC3 website?
How is it done correctly?
Note: I know it easier to use JS API's such as JQuery or Google Closure to build UI in ASP.NET MVC3, but currently GWT is a requirement for the project.
The question is whether you want to go down the multi-page or the single-page road.
GWT is a toolkit which helps you create single page web-applications where the backend only serves as a datasource. This is a SOUI (Service Oriented User Interface) approach.
A single host page serves the GWT client application and you deal with flow synchronization and other user interface pattern (MVP) on the client side.
If you go down this road, you will probably not use any of ASP.NET MVC3's advanced features (specifically the model controller view part).
However it is also possible to use GWT in a multi-page setup where the backend takes care of the "flow synchronization" and you embed GWT as widgets in the corresponding views/pages.
You end up with small GWT apps for each host page/MVC view. You won't get all the optimizations in code-reuse because each host page will be a separate GWT app and thus shared code will be downloaded multiple times.
Regarding your specific question and the technical aspects of ASP.NET MVC3 and Razor:
I can't really comment on that because I don't have experience with ASP.NET MVC3. But in general GWT apps can be embedded in any web-page by simple including the nocache.js bootstrap file (if you want history support also embed the hidden iFrame).
See here for more details.
Note: this project could be also of interest to you.