Is there a way to run universal apps on Firebase Hosting? - javascript

I have recently deployed my Angular 2 application to Firebase hosting successfully and am really enjoying this set up so far, particularly on how easy it is to deploy using CI as well.
At the moment, I am looking at adding a universal server rendering support to my app, but I'm not sure if this is handled by Firebase Hosting, as it says it is static file only.
However, what made me think that this could be a potential feature that I am missing is that Firebase offers support for single page applications, hence I decided to ask.
If there isn't support for such apps, can we expect it in the future?

At the moment this is not possible. However since Angular 2, Google and Firebase go hand in hand I would say this it is just a matter of time.
In the meantime you can create a Node.js-based server, where you install Angular Universal, and have it connect to Firebase with the Firebase Node SDK.
Next, you simply communicate with that Node-backend from your Angular 2 application.

If you're using angularfire2, that will break universal either way. There's something in the package that calls "window" which doesn't exist on the server. Unless something changes with universal or angularfire this is a ways off

At the end of that video David East mentions that one can use Google Cloud Functions with Angular Universal and such: https://www.youtube.com/watch?v=R3v8EcYzf_M
The video itself is quite useful for firebase users. But the topic starts at approximately 23:30.

A different approach is to skip universal altogether and do something like this.
Rendertron is a headless chrome that can be launched. Similar to phantomjs. But universal gives speed.

Related

Detailed explanation on how React Native softwares are updated

I am developing a React Native application. it's a framework to build mobile applications with JavaScript and deploy for Android & iOS with the same code base.
I read somewhere that RN applications are dynamically updated. It means, without releasing new versions to AppStore or GoogleStore, we can update it. It is awesome!
But my question is: how can we do so? I searched a bit and found out that it is possible with Codepush. If so, how? Is it a free tool or we should pay for it? If it's not free, Isn't there a free solution to this?
Also, by updating dynamically, are we limited to update only JS bundle or we are able to update external assets like new fonts, images, and etc?
I would be thankful if an expert guides me by details and workarounds.
Cheers.
Like it explains in CodePush website;
CodePush is a cloud service that enables Cordova and React Native
developers to deploy mobile app updates directly to their users’
devices. It works by acting as a central repository that developers
can publish certain updates to (e.g. JS, HTML, CSS and image changes),
and that apps can query for updates from (using our provided client
SDKs). This allows you to have a more deterministic and direct
engagement model with your end-users, while addressing bugs and/or
adding small features that don’t require you to re-build a binary
and/or re-distribute it through any public app stores.
This means you can update your Javascript code remotely without submitting your app through App Store or Google Play.
This service is currently completely free and you can use it in your app without paying any fees. There are also couple of more systems that are payed or free but I have never used them so I can't say anything about them.
This service does not let you change or update any of the native code so if you add any native code supported libraries or write one yourself or update any existing native libraries or codes, you need to publish the new version through the stores.
This types of services also help you to do A/B tests and alfa/beta tests.
You can find much more detailed information at CodePush website and Google.
Codepush is free and you can use react-native-code-push to use codepush service. You can use its document to have this service on your app.

ElectronJS - Cache HTML and JS files from remote server

I have an electron app that retrieves the app files (.html & .js) from a remote server using the function mainWindow.loadURL('http://www.example.com/index.html')
The problem arises if the users network connection to the internet is offline or disconnected.
Is there a way in electron to cache the html and js files so that if the user is offline, electron will automatically load from the cache.
I have tried to use the HTML5 Application Cache and a plugin for webpack https://github.com/NekR/offline-plugin but these do not seem to work.
I see this is an old question but I stumbled across this when doing a semi-related search and there is no answer at all right now, so I'll provide one:
Ignoring the Electron-specific nature of this question, the web-standard way to do this is using Service Workers. Here are some docs on that:
"Using Service Workers" from MDN - https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers - this is a reference source.
"Adding a Service Worker and Offline into your Web App" - https://developers.google.com/web/fundamentals/codelabs/offline/ - this is a tutorial.
"Creating Offline-First Web Apps with Service Workers" - https://auth0.com/blog/creating-offline-first-web-apps-with-service-workers/ - this is also a tutorial.
I think this would be the most direct way to solve this, even within Electron. (An advantage of Electron here is that you have a single, known browser to make this work for, but I think what you are trying to do fits perfectly within the problem-space that Service Workers are designed to address.)
That said, I think Sayam's comment/question is valid -- if this html/js is the actual content of your electron app, and assuming it doesn't change too often you could (and maybe should) distribute it with the app itself. Then you don't need to do anything special for offline support (as long as that html/js doesn't need network-based resources), and changes to that code are deployed as application updates.
Personally I think that once-per-week is about the maximum frequency of updates for which this approach is suitable. It would not bother me if an app auto-updated 2 or 3 times per month, but I think I'd uninstall an app that updates itself 2 or 3 times per week if I had that option.
There may also be some electron and/or node modules that address this problem-space, but I've never bothered to look because one of the two options above has always seemed appropriate to me.
Old question but still valid usecase (offline cache for dynamic assets).
here is article that describes one solution for that (own ExpressJS caching middleware). Author made npm library to address that.

Web scraping in react-native ios?

I am building an iOS app with react-native and looking to do some web scraping. From my understanding traditional npm packages don't work because they rely on Node.js. I know there are Objective-C/Swift libraries for web scraping but I don't understand how I would integrate those into a react-native component.
Anyone have any ideas on how to get information from a website (web scraping) in react-native?
Interesting question. Architecturally, it might be a good idea to consider building a service which can provide the scraped data via an API. The more processing power the client requires (the heavier the client-side code), the more likely you are to run into lagging / stuttering issues in the app. Phones have come a long way, but still can't match a server's power.
If you want to press ahead, I would advise using the browserified version of Cheerio.js. Basically, browserify lets you take code written for node, and use it in a browser environment. You would need to test it in JS Core on IOS, but there's a good chance everything will work.
One other option is using jQuery's load function or the fetch api included in React Native to make the call to the site (you don't have to worry about CORS), and parse the result manually.

RealTime web app with PouchDB

I am writing a real time web app with pouchdb. I am currently using vanilla pouchdb on top of backbone.
That being said, I have been running into quite a bit of conflicts and was wondering if you have any suggestions as to how to handle pouchdb conflicts in the context of a real time web app?
Also, I've noticed this plugin:
https://github.com/redgeoff/delta-pouch. How would this plugin assist with real time web apps?
delta-pouch will give you a setup where there are no conflicts at all, as long as you can express every change as a delta (i.e. a change that is not dependent on a previous state, such as a transaction to a bank account that adds $50).
You can also use this project to assist in resolving conflicts: https://github.com/jo/pouch-resolve-conflicts Or read the guide to conflicts: http://pouchdb.com/guides/conflicts.html

How to put my app to run "Always On Top" using Phonegap?

I need to run my app always on top of the android system, while the user will be able to exit the app only with his own password. I was told that in order to do that i need to setup and run a Service of my own.
My question is can and how it is done using Phonegap and Jquery. How do i define and run my own service? Thanks for your help.
First, don't do that. I know that doesn't sound like an answer, but trust me, it actually is the answer. What I mean is, no, you don't want your app to be "always on top of the android system." Use the actual Android lifecycle and participate as a good citizen, don't abuse it and try to keep your app always running. I know you may have a use case that makes you think you need to do that, but you most likely don't.
Second, you can write a native service (not JS) and keep it running in the background. This is a a standard Android service. You'll need to create a PhoneGap plugin to hook into your app via the service (or you can create this yourself outside PhoneGap, either way). Then you can either do work in the background, or bring your app to the foreground via the service.
This answer may help: Creating an Android Service with Phonegap? (Have phonegap app run even when closed)
Third, again, don't do that. Most long running services are a bad idea (not all mind you, some use cases require it, a music player, etc, but most do not). It's a much better idea to create an IntentService and schedule an alarm (via AlarmManager) to launch it in the background periodically if you just need to do some occasional background work (fetch data, etc). Regardless of the use case though, a long running background service will consume a lot of resources and make users justifiably wary of your app.
I don't think Phonegap will let you create a service solely in javascript. To be able to make a service, you will have to write at least some native code. See https://stackoverflow.com/a/10427975/1721527.
I've never used Phonegap, but I think you can create a native plugin to talk to the javascript. See http://docs.phonegap.com/en/2.1.0/guide_plugin-development_index.md.html.
See Android documentation on services at http://developer.android.com/guide/components/services.html.

Categories

Resources