Choosing a technology stack for Desktop + Mobile application

Question

I am currently browsing the web for information with the goal of building a Web and Mobile version of a classic board game.

The idea is to have the full features and ga

Answer 1

There are now couple of approaches in 2019!

1) Hybrid app approach
Outputs: iOS/Android App, PWAs (mobile, desktop site), desktop app using electron
Framework: Ionic 4 Framework (used with Angular/React/Vue and capacitor (successor of Cordova), stencil (UI toolkit))
Codebase: 98% codeshare so easier to maintain. Takes less time in development.
Tech: HTML,CSS,JS..(can be extended to react,angular,vue)
Cons: subpar user experience for mobile apps because of webview wrapper approach. Large app size.

---

2) Cross platform native apps (Universal Apps)
There has been some efforts to build libraries which could use single codebase for native android/ios app and also web app!
Output: Native Android app, Native iOS app, PWA (mobile, desktop site)
Frameworks:
1) react-native-web (most popular)
2) ReactXP by Microsoft
3) Nativescript+Angular, official tutorials here and here
Codebase: 80% codeshare. Bit complicated to maintain as some part of code is gonna be different for platforms. Pros: Code gets compiled to native binaries so better performance of apps. Smaller app size. Cons: Takes more time in development. many checks and conditions required for Apps and PWAs.

---

3) Separate Codebase for Apps and PWA
Build iOS, Android apps using
1) React Native by fb
2) Flutter by Google

Build PWAs (mobile,desktop site) using
React/Vue/Angular.

Codebase: Separate codebase but server-side code could be same if consumed via REST API.
Pros: These mobile apps have better performance than ionic hybrid mobile apps.
Cons: Separate codebase so harder to maintain.