locked
Web App Recommendation RRS feed

  • Question

  • User2058588433 posted

    Hello all:

    I understand it might be difficult making a recommendation without full details, but due to privacy concerns I cannot relate all details, and will give as much info as possible.

    I need a web site built for an industrial application, like say a factory, that might have up to 5000 users, and 20000+ IOT or other devices as part of a project at the facility. User interactions with the IOT devices will need to be captured in the database and the web site will produce dashboards on the activities, but note it is not a high demand for concurrent transactions. The web site will also need to perform administrative functions like adding users, assigning user permissions, adding IOT devices, adding facility machines and equipment, etc.

    So I have been reading about ASP.NET Core

    https://docs.microsoft.com/en-us/aspnet/core/introduction-to-aspnet-core?view=aspnetcore-3.1

    but am a bit confused how it all comes together. If I create an ASP.NET Core Web Project in Visual Studio, I see the Options for MVC, Angular, React. Etc. When I select MVC I am able to add APIs for communicating with an Azure database and allow things like an IOS app to go through the Web APIs to the database, so do options like Angular and React provide the ability to style the front end? I am trying to understand out how I go from the rather bland ASP.NET Core MVC site, to things like this demo, but still using .NET for the APIs?

    https://coderthemes.com/zircos/layouts/vertical/chart-morris.html

    That demo says it was built using CSS, HTML, JS, so what would Angular or React have to do with that? Wouldn't .NET APIs be used to get the data from the database in JSON format, and then I guess JS would be used to parse the data to the right charts? Or is that where Angular or React would come in?

    Thanks for any and all input.

    John.

    Thursday, May 21, 2020 10:19 PM

Answers

  • User-821857111 posted

    Angular and React are purely front end HTML management technologies. They are used to create the UI and to manage it in the browser. In an ASP.NET application, they are most likely to be used in conjunction with Web API services which get data from the database.

    However, you can use standard Razor Pages/MVC to deliver a similar experience to the one you liked to without Angular/React. There are a number of free Javascript-based charting solutions that do not depend on Angular or React. I use Chartjs, for example. MVC or Razor Pages (which is recommended these days) would be responsible for generating the initial HTML on the server, and then simple Javascript/jQuery can be used to obtain data for the chart.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, May 22, 2020 8:10 AM
  • User475983607 posted

    and then bind the JSON data from the API to the particular charts? And THAT step is what Angular/JQuery/React does?

    Yes.  Angular and React frameworks manage data binding in the browser (DOM).  jQuery does not.  It is up to you to write code that updates the DOM when using jQuery.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, May 22, 2020 11:41 AM
  • User-821857111 posted

    I would use whatever technology I'm most comfortable with. In my case, that means Razor Pages to generate the HTML, which by default makes use of Bootstrap, and for charts, Chartjs as previously mentioned. However, there is nothing wrong with using Angular or React to generate the HTML, with Web API controllers. It's just that I don't know Angular or React well enough to be productive with them.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, May 22, 2020 12:39 PM

All replies

  • User-821857111 posted

    Angular and React are purely front end HTML management technologies. They are used to create the UI and to manage it in the browser. In an ASP.NET application, they are most likely to be used in conjunction with Web API services which get data from the database.

    However, you can use standard Razor Pages/MVC to deliver a similar experience to the one you liked to without Angular/React. There are a number of free Javascript-based charting solutions that do not depend on Angular or React. I use Chartjs, for example. MVC or Razor Pages (which is recommended these days) would be responsible for generating the initial HTML on the server, and then simple Javascript/jQuery can be used to obtain data for the chart.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, May 22, 2020 8:10 AM
  • User2058588433 posted

    Hello:

    Thanks for your response. The Dashboard demo I saw:

    https://coderthemes.com/zircos/layouts/vertical/chart-morris.html

    doesn't say anything about Angular, it is built with Bootstrap 4.2.1, HTML, CSS, JS, SASS. So what would Angular have to do with that? Would it not be possible to apply that or a similar template to an ASP.NET Core Web Site? Is it Angular or Bootstrap that creates the GUI?

    John.

    Friday, May 22, 2020 9:37 AM
  • User475983607 posted

    Angular and ASP.NET Core are both frameworks for building dynamic HTML (web sites).  Angular runs in the browser.  ASP.NET runs on a web server. 

    Bootstrap is a library for building response web sites.  Angular or ASP.NET Core can take advantage of Bootstrap.  Likewise, i'm sure the Morris Chart dashboard can be used with either framework; angular or Core.

    Friday, May 22, 2020 11:25 AM
  • User2058588433 posted

    Thanks for the response.

    So I created a Visual Studio ASP.NET Core MVC project and  built some API controllers, and they successfully return the data from my Database in JSON format. I also grabbed a free example Bootstrap Dashboard, and it is made up of all kinds of files, in the root are all the HTML files, and then there are directories for css, js, etc.

    So for me to use that Dashboard as my GUI, I need to copy all those files into my wwwroot directory in my MVC project, set Index.html as my starting point, and then bind the JSON data from the API to the particular charts? And THAT step is what Angular/JQuery/React does?</div>

    Friday, May 22, 2020 11:33 AM
  • User475983607 posted

    and then bind the JSON data from the API to the particular charts? And THAT step is what Angular/JQuery/React does?

    Yes.  Angular and React frameworks manage data binding in the browser (DOM).  jQuery does not.  It is up to you to write code that updates the DOM when using jQuery.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, May 22, 2020 11:41 AM
  • User2058588433 posted

    So as an expert, which your star rating says you are! what would you choose to do this?

    Friday, May 22, 2020 12:00 PM
  • User-821857111 posted

    I would use whatever technology I'm most comfortable with. In my case, that means Razor Pages to generate the HTML, which by default makes use of Bootstrap, and for charts, Chartjs as previously mentioned. However, there is nothing wrong with using Angular or React to generate the HTML, with Web API controllers. It's just that I don't know Angular or React well enough to be productive with them.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, May 22, 2020 12:39 PM