Building Offline capabilites in ASP.NET Core web application - html

We are building a project management web application using those main technologies:-
ASP.NET Core MVC
SQL Server + Entity Framework
HTML, CSS & Bootstrap
The application mainly allows to create project >> create tasks under the projects >> assign Task to users >> and so on..
Now part of the requirement is to have certain areas that should be available offline as follow:-
My Tasks dashboard. which shows the Tasks assigned to the login user. so even if the user does not have internet access >> the dashboard should list all the Tasks assigned to the user when the user was last online.
Complete a task, by entering some fields and upload images. so even if the user does not have internet access >> the user should be able to click on a Task inside the dashboard >> fill the completion sections >> upload images/files >> click on submit >> the data should stay offline, and get submitted automatically once the user has internet access.
So can we have those offline features available inside our web application ? also some users will be accessing the web application inside their mobile web,, so are mobile browser capable of storing data and attachments and allow them to access the dashboard + edit a task and complete it and submit the change offline ? or we will need to have a mobile application instead?
Thanks

In principle, offline capabilities are available in every browser. These include things like localStorage, IndexedDB (parts of any browser), and progressive web apps (PWA) option (service workers). Note: PWA manifest and service workers are not actually related to or require blazer (mentioned above) in any way, they are web standard basically, don't get confused here. Blazer is a separate thing altogether.
The older technologies to support offline also include "application cache" mentioned in the other answer (NOTE: this one has been deprecated in favor of PWA, and support for it has been removed from Google Chrome for example)
Practically, all this means that every browser has an offline database/storage available for every application to store its data offline and synchronize later on. So, you don't have to build a mobile app to have offline capabilities.
There are some frameworks and platforms that could help you build offline-capable applications, but asp.net core mvc is not exactly one of those, meaning it does not provide offline capability right out of the box. That is, there is no checkbox to click, as far as I know, of course.

You use ASP.NET Core MVC and Entity Framework, and I think it not support offline capabilites. Because this project is compiled and run on the server.
If you want the application to support offline functions, I think it should be possible to download the entire content of the site to the browser locally.
You can refer to the official documentation below.
ASP.NET Core Blazor Progressive Web Application (PWA)
The following documents, I know are not ASP.NET Core MVC projects, but for reference.
I think to achieve offline function, first of all, the content of the complete site needs to be downloaded to the local when it is accessed for the first time. In this way, there will be no network exception errors when accessing offline.
Build an HTML5 Offline Application with Application Cache, Web Storage and ASP.NET MVC

Related

Xamarin: how to create views / UI of an app dynamically from a Json

Have you already developed a Xamarin app whose views are generated from a Json recovered when launching the application?
I met a client with this kind of need:
they are developing a web app to prototype the screens by adding and positioning some controls (TextBox, Label, ...)
this generates a Json that must be interpreted by the Xamarin app: this will build the different views dynamically
in a first version, the user's data would be stored locally (through a file or SQLite) and synchronized "manually" when the device is connected to a computer
the app will work on Android only in a first time, and then on WPF
The client has not yet decided between Xamarin.Forms or Xamarin native, but it's probably more interesting to do it through Xamarin.Forms, even if iOS is not required: this should make porting on WPF easier.
Have worked on similar cases? Have you some recommendations? Are there plugins or patterns that could be used to simplify this development?
I've found this one, but it doesn't seem to be the same use.
There is also this article on iOS, but there is not the same thing on Android.
This would in theory be possible using a massive code behind builder for a page but should NOT be done for a production app. Mobile apps have very specific requirements that need to be thought of before attempting.
Xamarin is great for simplifying code reuse, and if you use Xamarin Forms you can reuse the UI components for Enterprise apps.(the less fancy and pixel perfect the layouts need to be the better. )
Your client would be better served by making it a mobile compatible web page instead from the details you have shared.

Using Electron vs. Offline HTML5 for an offline application

When looking up Electron and Offline HTML5, I have found it difficult to make a decision between which one to use for a project.
Assuming that a user will have to go to a certain website to download the Electron application, and would have to go to the same website to get the Offline HTML5 loaded, what are the pros and cons between using one over the other?
Some that I could think of:
Offline HTML5 can be updated without the user consciously updating their application by just making the user go to the online page again.
Electron would eliminate the need to code around multiple browser/browser version dependencies and quirks
It really depends on your exact requirements. The following is a list of everything that I came up with:
electron supports module system (i.e. require) both in main and renderer processes.
electron provides you access to OS APIs (e.g. fs). Without such many node modules will not work in the JS runtime of the browser (e.g. ip).
updating your app with electron is as easy as sending an http request. (or even better as described here)
an HTML 5 offline app requires a browser and the user might just give it IE6.
electron integrates with native desktop environment (see dialog, power-save-blocker, shell or even app for some examples)
electron enhances some of HTML5 APIs such as file API
electron lets you modify the default behavior of underlying chromium. For example you could intercept all URLs with file scheme and modify them on the fly*.
In short if you want your app to have a good native integration and act deterministic (i.e. no browser quirks) I suggest choosing electron.
*electron-jade for example takes use of protocol API to compile all files ending with .jade on the fly without the need to prior compilation.
DISCLAIMER: I am the developer of electron-jade.

Why can't a browser display a local ASP.NET file?

I wanted to build a web application that kids could view 4-H Record Book forms, criteria, and examples from a CD. I wanted it to be in a web page format so that it was platform-independent (compatible with Windows, Mac, and Linux). I wanted to write the application in ASP.NET, so that I could reuse pieces of my site (e.g. Master Pages, databound controls). It worked fine while in Debug mode running on my simulator server, but when I attempted to open the files without the server simulator, they simply displayed as blank pages.
I've learned thus far that ASP.NET requires a server to run, but my question is: why does it require a server when so much of ASP.NET is just HTML tags? Also, is there any way I can use ASP.NET features such as Master Pages and Databound controls on a local website?
Output of ASP.NET is html, css and other stuff, but ASP.NET itself is a very complex system that consists of many components, for instance code-behind classes, asp.net controls, event system, routing system, various libraries etc. The server has to somehow (I won't go into details, because it's a way too broad topic to explain like this) assemble the output and it will spit out the generated html, css etc. to the client who requested the file (typically a browser).
Browser itself can only work with final html, css, javascript and so on, but it can't do processing that needs to take place on the server-side.

Best way to distribute Cloud HTML5 App

I thought PhoneGap was a simple wrapper for HTML5, but it looks like it does in fact compile into native in some way.
I have a Cloud based, HTML5 Single Page Web application that I just want to run full screen, and distribute via an app store.
Should I just create a PhoneGap App with an InAppBrowser?
If you intend to publish an HTML5-based app in a "native" app store sucha s Google Play or Apple Store, you have 2 options:
1- Implement your own native application using a webview to show your web-based app.
2- Use some existing framework like Phonegap/Cordova even you do not use the native API. The framework will already setup everything for you to just deploy your HTML5 code.
However, if your web app is meant to be hosted remotely (i.e. not run from local files), you may encounter problems when trying to publish in the Apple Store. They have some strict rules about remote content, and about publishing apps that may not provide much more value and/or functionality than a simple web-app can.
Best.

Installing an offline html app and data onto an iPad

I am contemplating buying an iPad and am wondering what options I will have for developing an app for personal use ... specifically whether I will be able to do it as an offline browser app. The app currently exists as an Android Java app; it interacts with a large local database (about 3MB) and displays images and text drawn from a very large pool of resources stored locally (about 2GB).
My immediate questions are:
How would I get the files (html/javascript, database, images and text) transferred into the iPad's storage from a Windows PC? With Android this is a simple matter of hooking up via USB and using Windows Explorer. Googling suggests that for an iPad I might have to use an app on Windows called DiskAid, but this costs $25 which seems a bit steep for my simple purpose. Are there free alternatives?
Once the files are installed on the iPad how would I run the html app? On Android this appears to be a matter of keying "file:///sdcard/MyBrowserAppFolder/mybrowserapp.htm" into the browser's address box. Does th iPad browser work in a similar way.
There are two basic kinds of applications that run on iOS.
Mobile designed web applications that are hosted on a server and accessed through Safari or another browser.
Native applications built using Xcode and usually objective-c.
For the latter, you could use the phonegap framework to build an app using existing html and javascript.
My personal advice is to invest the time to learning how to code this up using objective-c. Depending on what format your db is in, importing the structure and data might be trivial. It will take an investment of time, but doing things using the native tools is the best choice for iOS development in my opinion. I was in the same situation (PHP, VB.NET and Javascript developer) and just decided to take the time and learn to do it right. This was a great decision and the development time of a simple to moderate application takes very little time now.
Safari on iOS does not support the URL's of type file:// natively. So you either write your own app, purchase an app or use something like a local web server after jailbreaking.
Alternatively, and if you can verify that the app you have mentioned does what you want to do, then maybe $25 is not so much of a price. Depends on what your time is worth :)
However there are cheaper apps around that allow to transfer and read html via wifi and usb. (Not sure I can name them here)
The USB transfer aka iTunes Filesharing is a standard function that a developer can enable in the info.plist of their app. Many apps use this to transfer data between Computer and iDevice.