How to upload and run Angular applications on Firebase? - angularjs

Firebase Hosting doesn't support Node.js but to install Angular, one has to use npm
npm install -g #angular/cli
Without npm, angular can't install and without Node.js, Angular app can't run. But because Firebase Hosting doesn't support Node.js, we can't upload Angular apps? This also means we can't run npm packages like lodash, underscore etc..
Now there's also AngularFire 2 which is installed using npm!
npm install firebase angularfire2 --save
So to use Angular with Firebase, I've to use npm but the apps created using Angular + Firebase cannot be uploaded on Firebase Hosting because it doesn't supports npm!
Is there any workaround to host Angular apps on Firebase?

Firebase hosting is designated for delivery of static files, i.e. it does not "support Node.js" in the sence that you cannot implement custom server-side code (on Firebase Hosting at least - see Firebase Cloud Functions for this).
Of course you can fully develop your app with NPM as long as its just a full client web-app. You then upload your build result (i.e. compiled JavaScript / TypeScript + HTML + Assets + ...) to Firebase Hosting.
You just cannot run server side code with Firebase Hosting.

Related

Running firebase serve to use local emulators support doesn't work

I have been using Firebase with success for my projects, and I am working to improve the project by using ReactJS.
The problem is most of examples like Getting Started with React and Firebase - Firecasts (2016) and How to use Firebase Firestore with ReactJS (2019) use npm star to emulate a local web server.
npx create-react-app myReactProject
cd myReactProject
npm install firebase --save
npm install -g firebase-tools
firebase init
npm start
npm start works fine (traditional "React App" page with react logo spinning), but without function, database, storage emulators, and multi-site support that we have by using the firebase CLI tool.
The problem is, if I run firebase serve to use local emulators support, nothing works.
Are there specifics steps to install ReactJS and uses the firebase serve tool, both together, or the only way to use firebase serve and reactjs is by using declarative JavaScript library in HTML files?

How to add react app into openfin platform

I'm finding the way to set up an exists react app(use create-react-app) into openfin platform(https://openfin.co/). Could you help share with me some repo, code sample or anyway to implement react app into openfin
Many thanks
The OpenFin API is injected in the global space so there's no need to import any libraries, just launch your app on OpenFin.
After using create-react-app you can launch your app with the openfin-cli
npm i -g openfin
openfin --launch --url http://localhost:3000
This will create an app.json targeting your app (the localhost version - eventually the URL field should be your production URL).
create-react-app bundles the entire build process into some preconfigured scripts so if you want to automate this launching as part of your local development cycle, you may have to eject the project. If you do that and want to use the launched provided by the CLI as a module, it is also available here, or using the V2 API you can launch an app as demonstrated here

React App Hosting - Host Prerequisites

Generic: What kind of services must a hosting vendor provide in order to make it possible to have a React app hosted?
More Specific: If I create a website with React and React Router, is it possible to deploy it by just uploading the bundled output folder? This could be for example a dist folder containing index.html, bundle.js and an images folder.
Could this be as simple as deploying a simple web page (like one built with plain HTML, CSS and JS)?
Sure just do: npm run build
and you will have a folder with the static files. Upload those with your choice of file transfer method and set the permissions to the web host appropriately.
100% Working Example.
React App Hosting in Firebase .
You can read this blog
Host Your React Web App in few minutes.
Command runnning in Wrong sequence =>
firebase login
firbase init
firebase deploy
npm run build
Command runnning in Correct sequence =>
firebase login
firbase init
npm run build
firebase deploy

Angularjs 2 installation Methods

I have one angularjs 2 UI (without node modules) which i have to integrate with my backend. After installing Angular cli, Can i simply do npm install in the angularjs 2 directory folder as it have package.json or create a new app after installing angular cli and then do npm install for some node modules specific to my angularjs project.
Will the first approach Work successfully as it is easier
If your backendend and frontend repos are in same package.json just serve your app. You can separate these ( in the future it will be more effective ) . So just search your starting command and run the app.

Pushwoosh Web SDK not working in ES5

I am using Pushwoosh Web SDK 2.0^ to register my device (Browser) Id. and to get it token, However the Object doesnt get constructed, because Pushwoosh is using ES6 and promises while I am using ES5 in my project. is there a way to get PushWoosh Object so I can use the other APIs in their SDK?
I was following Web Push SDK 2.0, but this didn't worked out for me.
PS: I am using Angular 1.5 on front end.
Thanks
All browsers that support web pushes also support promises.
You can use compiled source:
git clone git#github.com:Pushwoosh/web-push-notifications.git
cd web-push-notifications && npm install
npm run build:lib
take source from lib/ directory and copy to your project

Resources