Can I use Electron JS to convert my web app to DESKTOP app - mysql

I have a web app developed using..(PHP,MYSQL,HTML,CSS,JS,AJAX,Datatables, bootstrapjs)
Now, I want to make a desktop version of the same app, and I came across electronjs.
The problem is I dont know whether ELECTRONJS will support all my requirements.
A breif of my requirements:
My app is responsive using datatables.net library including EDITOR for displaying the data .
the datatable plugin requires ajax calls to some API (Which I developed with PHP and hosted on a server)..
but now I want to even do all the DB Operations with electronjs so that my app can work offline.
I am not sure if I can do that with electron
- calling an API (created by same app) from HTML/frontJS
- the API Returns Json data
- the Front JS displays that data on front.
Kindly let me know if this can be done with electronjs,

Well, basically yes. You can build a desktop app like this.
But you wont be able to run it offline if it depends on a server sided API. If you can rewrite your backend Code in JavaScript and use a SQLite DB instead of a MySQL you can run this as electron App.
Keep in mind that your business logic in the frontend can always be abused because it’s not hidden from the user.
FYI: Electron only runs a browser inside it’s own App container. So there is actually no crucial difference between Browser or electron App.

Related

Splitting web-app and mobile-app request in Yii2

I created a restful web-app platform using yii2 framework. It is working with no problems using a browser. Now I'm developing a mobile-app with angular and ionic and I'm searching for some guide to help me splitting the request from browser and app. Using the browser the web-app is configured to have a html view response, how can I detect a mobile-app request to change response in JSON format in each controller/action?
It's my first mobile-app development.
I just fighted this same war this week and I ended up splitting the folders and generating a new yii-app with fresh controllers just for the api.
I tried creating the api folder inside the web backend project, but I had to much problems with redirections, and as I was working from Android emulator fueled by Expo it was almost impossible to reach the api inside my localhost from outside.
At the end in the API REST you just reuse the database connection, rest of files are new. So there is no much to win in placing it in the same folder/project.
By the way, read this documentation: Implementing RESTful Web Service APIs in Yii2
As a code example you could check my yii2 web app: https://github.com/jvidalv/fempoble
And the api that works with the web: https://github.com/jvidalv/api-fempoble

Trusted web activity - Digital assets link validation for intranet/private web app seem to be failing

I've followed this doc to
Create a wrapper Android app based on this sample project for my UI application which runs in non-public domain in our corporate servers.
Add assetlinks.json in my Angular 6 PWA application, with SHA256 fingerprints of my release key.
Deployed the signed apk to a Android 4.4.3 device running Chrome Dev 69 and Google play services - 12.8.74.
When I run the application, everything works fine except hiding the address bar, which makes it as a regular custom tab and not the "Trusted web" content.
I don't see any error in the log and not sure how to debug this scenario. Any help on this is appreciated.
Got confirmation from Chrome team that they are using TWA assets link validation in server side using an API call and so this solution wont work for Private web apps. Said that, they are also considering to move that logic to browser to support this use case. Will update here when I have any update on this.
Update: As of Chrome Version 72, TWA(Trusted web activity) if available in Chrome stable version and the web asset validation(to make sure the web page is yours/same as the app its loaded to) happens in browser. So this solution can be implemented for private web apps for hosting inside enterprise environment.
Also, now PWAs can be packed as regular app using TWA solution and uploaded to Play store as an apk file. Documentation on this is still being updated as per one of Chrome developer. But the solution as such is ready for use.

html5 app cross-browser idea/structure

I am very new to web development, and i am trying to understand the structure for the flow for a html5 app using jquery mobile, to see whether i am doing Cross-origin resource sharing or not. I am basically just writing an app in html5, then going to package it in phonegap. I am hosting some php on a remote server and those php will make calls to the database and return the data through Ajax calls back to the app.
There is no error called if i run everything on my browser now, but if i package it with phonegap. Is that still going to be ok?

framework to be used for UI of node.js backend

I am trying to develop an application using node.js.
Since the same application can be accessed from a mobile device sometime later, it is expected that the APIs will return the json data, and not forward the request to a page after setting the appropriate request parameters.
I am mostly a Java backend guy and a newbie in the UI frameworks(including javascript with just basic knowledge).
I was wondering which UI technologies should i use for the UI? Should i go for plain HTML or php or anything else? Also, will the other UI Application be a webapp and deployed probably in a web server?
Started to use the express module for node.js, and it is awesome. It provides jade(and from which the basic UI can be created very easily) but i have not had the chance to see much into it. Also if i start to use jade, i guess in my app.js file, i will need to forward the request to a page, and not return json data, which i want to avoid.
Can someone suggest me which UI technologies should be the way to go?
The UI is supposed to be quite rich, and with lots of functionalities.
Thanks
Tuco
I would definitely recommend using express.js. As you mentioned you can render jade templates and this will display to the user as html.
You can also send plane old JSON data to the client by using the res.json() method made available with express.
Backbone is a client side framework where you can make single page web applications, and all the html templates are rendered on the clients machine rather than on the web server. Data is persisted to a backend database by using a RESTful API and the following ajax requests. GET, POST, PUT and DELETE.
Later down the line you can use this RESTful API for your mobile app.

PhoneGap index page

i know that the index.html page (the PhoneGap startup page) needs to reside on the device. but if we want to create an app who uses third party user authentication before proceeding to core application, so then what we have to do?
Thanks in advance
On android you can change the starting page in the main activity or you can make a redirect in index.html
Well, you don't say if you are platform specific..
And there are lots of third party auth options..
But I can offer two solutions (admittedly my own code etc),
both of them use PhoneGap for Android and PhoneGap Plugins. The key piece of code for me has been the onLocationChange callback feature of the ChildBrowser plugin. Your app can take the user to other sites for auth or whatever, but still get control back.
Tutorial on Using Twitter REST API (OAuth 1, ChildBrowser, jsOAuth plugin)
Free Android App + Source on github : AppLaud App (OpenID, ChildBrowser, custom server)
For authentication, you can have a form in your index.html (maybe under login div) to do a post to an actual webserver.
Then, fetch the data returned from the webserver to let your user access the functionality of your native phonegap application.
You can have the functionality disabled until you receive the successful login from the webserver. If you post via ajax, the webview won't even blink, but you will still get the successful login response from webserver and simply enable functionality on your app after this.
Let me know if this is confusing and I'll try to explain more clearly and
I hope this helps.