IDE Archives - Stack Interface

Ultimate Best Web and Native App Tech Stack

What is the ultimate app development technology stack? Of all the tools we’ve found, the following gives the most flexibility. But first let’s give some of our judging requirements.

Requirements

Ease of setup
Low maintenance
Cost (for hosting, and additional development)
Flexibility
Scalability
Portability (able to use on other hosts, and not be locked in)
Extensibility (Modularity and open source with standards)
SEO (so people can find your site)
Reusability (able to use for other purposes)
Automatable
Community (documentation and people to answer questions)

The Stack

Here are our top choices for the ultimate technology stacks, that bring the most benefits and flexibility for the least amount of cost:

Ionic Angular
- JavaScript/TypeScript
  - Most prolific coding language
- Same codebase can build web app (PWA) and native apps (Android and iOS)
- Capacitor for native code
  - Same API for web and native
- Stencil for web components
  - More performant than React
- Automatable with AppFlow CI/CD
Netlify
- Automatically compiles frontend code directly from repo
- Great for PWA code assets
- Free starter plan with 100GB traffic
WordPress
- Backend API for app
- Most prolific CMS
  - High availability of developers
- Lots of plugins available for fast extensibility
- Plugins
  - PODs for taxonomies
  - Google Site Kit
    - Easy analytics setup
  - WPide turns WordPress itself into a code editor (IDE), with revision history!
Fastest Hosting
- Starter hosting:
  - AccelerHosting
    - cPanel Accelerated
    - Fast inexpensive hosting
    - Unlimited sites
      - Can find out which sites perform well before upgrading their hosting
    - Built in CloudFlare access
- Growth hosting:
  - When traffic gets too big can switch to one of the following
    - AWS Lightsail
      - Inexpensive and scalable, but for autoscaling you have to move to EC2
    - Google Cloud
      - Free starter tier, but is very limited
Firebase Cloud Messaging
- Push notifications
- Free starter tier
CloudFlare
- Worldwide high speed CDN
- Access with WordPress plugin
  - WP CloudFlare Super Page Cache
Google App Scripts
- Automated content updates from spreadsheets
- Can pull small bits of content from feeds for automated updates
Google Data Studio
- Dashboard for multiple sites
Visual Studio Code
- Awesome code editor with our favorite extensions

Have some other tech stack suggestions? Please drop a comment below.

Best Visual Studio Code Extensions

The following are some of our favorite extensions for Visual Studio Code:

Beautify or Prettier – Beautify javascript, JSON, CSS, Sass, and HTML in Visual Studio Code.
Cordova Tools – Debug on a mobile emulator or a physical mobile device from directly inside of VS Code. The setup for this can be a little tricky.
GitLense – Very handy for being able to see Git history without leaving the code.
Angular Language Service – dynamic code hints for Angular templates.
Angular Snippets – adds snippets for Angular for TypeScript and HTML.
Back and Forth – great way to add a back button to your code editor (similar to Xcode), so you can get back to the last file you were looking at.
Bracket Pair Colorizier – make your bracket pairs easier to see!
Material Icon Theme – style your icons like Material Design.
Nx Console – essential for working with Nx monorepo projects.
Debugger for Chrome – debug your JavaScript code in the Chrome browser, or any other target that supports the Chrome Debugger protocol.
Rest Client – allows you to send HTTP request and view the response in Visual Studio Code directly.
Live Server – launch a local development server with live reload feature for static & dynamic pages.
Peacock – subtly change the workspace color of your workspace. Ideal when you have multiple VS Code instances and you want to quickly identify which is which.

Have some more favorites we didn’t mention? Please drop them in the comments below.