Carlos Guardia

Tech Stack Decision Guide

A comprehensive guide for choosing the right technology stack for any project.

Understanding the Basics
React vs Vue.js vs Angular
Hosting Options by Cost
Split Frontend/Backend Hosting
Database Options & Security
Decision Flowchart
Technology Reference Tables
Recommended Stacks by Use Case

Understanding the Basics

What is NPM and Why Do Some Frameworks Need a “Build”?

NPM (Node Package Manager) is like an app store for JavaScript code. It helps you:

Download libraries/frameworks (like React, Vue)
Manage dependencies (code that your code needs)
Run build scripts

Why do React/Vue/Angular need a build step?

These frameworks use modern JavaScript features that browsers don’t understand directly:

JSX/TSX: HTML-like syntax inside JavaScript (React)
TypeScript: JavaScript with type checking
ES6+ modules: Modern import/export syntax
Optimization: Minifying, bundling, tree-shaking

The build process translates this into plain JavaScript/HTML/CSS that browsers can run.

Your Code (React/TypeScript):
  import React from 'react';
  const App = () => <div>Hello</div>;
  
  ↓ npm run build ↓
  
Browser Code (Plain JavaScript):
  var App = function() { 
    return React.createElement('div', null, 'Hello'); 
  };

Alternatives that DON’T need NPM/build:

PHP (runs on server, no build needed)
Plain JavaScript/jQuery (write code, upload, done)
Alpine.js (include via CDN, no build)
HTMX (include via CDN, no build)

React vs Vue.js vs Angular

When to Choose React

Choose React when:

You want the most popular framework (largest community, most jobs)
You need native mobile apps (React Native is mature and widely used)
You prefer flexibility and choosing your own libraries
You’re building a complex, large-scale application
You want maximum third-party library support
Your team already knows JavaScript well

Pros:

Huge ecosystem and community
React Native for mobile (code sharing between web/mobile)
Backed by Meta (Facebook)
Most job opportunities
Flexible - choose your own routing, state management, etc.

Cons:

More decisions to make (which libraries to use)
Steeper learning curve for JSX
Frequent updates and changes

When to Choose Vue.js

Choose Vue when:

You want the easiest learning curve
You prefer an “all-in-one” solution with official libraries
You’re building a small to medium-sized application
You want something between React and Angular
You prefer template-based syntax (similar to HTML)
You’re a solo developer or small team

Pros:

Easiest to learn
Great documentation
Official routing and state management libraries
Progressive framework (can add features as needed)
Smaller bundle size than Angular
Template syntax feels more like HTML

Cons:

Smaller community than React
Fewer job opportunities
Less mature mobile solutions (NativeScript, Capacitor)
Fewer third-party libraries

When to Choose Angular

Choose Angular when:

You’re building a large enterprise application
You want everything included out of the box
Your team prefers TypeScript and strong typing
You need a highly opinionated framework
You’re working in a large team that needs structure
You’re building a complex business application

Pros:

Complete framework (routing, forms, HTTP, etc. all included)
TypeScript by default
Strong opinions = less decision fatigue
Great for large teams
Backed by Google
Excellent CLI tools

Cons:

Steepest learning curve
Largest bundle size
More verbose code
Overkill for small projects
Less flexible than React/Vue

Quick Comparison Table

Feature	React	Vue.js	Angular
Learning Curve	Medium	Easy	Hard
Bundle Size	Medium	Small	Large
Community	Largest	Medium	Large
Mobile Apps	React Native (best)	Capacitor/NativeScript	Ionic/Capacitor
TypeScript	Optional	Optional	Required
Flexibility	Very flexible	Flexible	Opinionated
Best For	Large apps, mobile	Small-medium apps	Enterprise apps
Job Market	Most jobs	Fewer jobs	Enterprise jobs

My Recommendation:

First project or learning? → Vue.js
Need mobile apps? → React
Large enterprise app? → Angular
Most versatile choice? → React

Hosting Options by Cost

1. Free Hosting ($0/month)

GitHub Pages

What it is: Static site hosting from GitHub
Best for: Documentation, portfolios, simple SPAs
Supports: Static HTML/CSS/JS, React/Vue/Angular (after build)
Limitations: No backend, no databases, no server-side code
Setup: Push to GitHub, enable Pages in settings

Netlify/Vercel Free Tier

What it is: Modern static hosting with CI/CD
Best for: JAMstack sites, SPAs, static exports
Supports: Static sites, serverless functions (limited)
Limitations: Usage limits, no always-on backend
Setup: Connect GitHub repo, auto-deploy

AWS Free Tier (S3 + CloudFront)

What it is: Static hosting on AWS
Best for: Learning AWS, static sites
Supports: Static files only
Limitations: 12 months free, then pay-as-you-go
Setup: Upload to S3, configure CloudFront

2. Shared Hosting ($5-15/month)

Examples: DreamHost, GoDaddy, Bluehost, HostGator

What it is: Traditional web hosting with PHP and MySQL

Best for: PHP applications, WordPress, traditional websites
Supports: PHP, MySQL, static files
Limitations: No Node.js, Python, or Ruby (usually)
Setup: FTP upload or cPanel

What you can host:

✅ PHP backend + MySQL database
✅ React/Vue/Angular (built static files)
✅ WordPress, Laravel, traditional PHP apps
❌ Node.js, Python, Ruby applications
❌ Real-time features (WebSockets)

3. VPS/Cloud Server ($5-50/month)

Examples: DigitalOcean, Linode, Vultr, AWS Lightsail

What it is: Virtual private server you manage

Best for: Full control, any technology stack
Supports: Anything (Node.js, Python, Ruby, PHP, etc.)
Limitations: You manage everything (security, updates, etc.)
Setup: SSH access, install software, configure

What you can host:

✅ Any backend (Node.js, Python, Ruby, PHP)
✅ Any database (PostgreSQL, MongoDB, MySQL)
✅ Real-time features (WebSockets)
✅ Multiple applications on one server

4. Platform as a Service ($0-50+/month)

Examples: Heroku, Railway, Render, Fly.io

What it is: Managed hosting for applications

Best for: Quick deployment, less management
Supports: Node.js, Python, Ruby, PHP, etc.
Limitations: More expensive than VPS, less control
Setup: Git push or connect GitHub

What you can host:

✅ Any backend framework
✅ Managed databases (add-ons)
✅ Auto-scaling
✅ Easy deployment

5. Serverless ($0-100+/month, pay-per-use)

Examples: AWS Lambda, Vercel, Netlify Functions, Cloudflare Workers

What it is: Functions that run on-demand

Best for: APIs, event-driven apps, variable traffic
Supports: Node.js, Python, Go, etc.
Limitations: Cold starts, execution time limits
Setup: Deploy functions, configure triggers

What you can host:

✅ REST APIs
✅ Background jobs
✅ Event-driven functions
❌ Long-running processes
❌ WebSockets (limited)

6. Full AWS/Cloud ($50-500+/month)

Examples: AWS EC2, RDS, ECS, EKS

What it is: Enterprise-grade cloud infrastructure

Best for: High-traffic apps, microservices, scalability
Supports: Everything
Limitations: Complex, expensive, requires expertise
Setup: Configure services, networking, security

Hosting Decision Matrix

Hosting Type	Cost/Month	Best For	Complexity	Scalability
GitHub Pages	$0	Static sites, portfolios	⭐	Low
Netlify/Vercel Free	$0	JAMstack, SPAs	⭐	Low-Medium
Shared Hosting	$5-15	PHP apps, small projects	⭐⭐	Low
VPS	$5-50	Full control, any stack	⭐⭐⭐	Medium
PaaS	$0-50+	Quick deployment	⭐⭐	High
Serverless	Pay-per-use	APIs, variable traffic	⭐⭐⭐	Very High
Full AWS	$50-500+	Enterprise, high-traffic	⭐⭐⭐⭐⭐	Very High

Split Frontend/Backend Hosting

Why Host Frontend and Backend Separately?

Architecture: Frontend on GitHub Pages/S3 (free/cheap) + Backend on shared hosting/serverless

Key Advantages

1. Cost Savings

Frontend: FREE (GitHub Pages) or pennies (S3)
Backend: Only pay for API/database ($5-15/month shared hosting)
Total: Much cheaper than single server hosting

2. Performance & Global CDN

Static files served from CDN (Content Delivery Network)
Users get files from nearest server worldwide
Faster page loads globally
Backend only handles API calls (less frequent)

3. Scalability

Frontend: Can handle millions of visitors for free
Backend: Only scales when API calls increase
Example: 100,000 page views might only generate 10,000 API calls

4. Security

Frontend: Static files can’t be hacked (no server-side execution)
Backend: Smaller attack surface, only API endpoints exposed
If one fails, the other still works

5. Deployment Independence

Update frontend without touching backend
Update backend without redeploying frontend
Easier rollbacks and testing

6. Technology Flexibility

Frontend: Use React/Vue/Angular (modern frameworks)
Backend: Use PHP (cheap) or Node.js (scalable)
Not locked into one technology

Example Architecture

User Browser
    ↓
GitHub Pages (FREE) or S3 ($0.50/month)
    ├─ index.html
    ├─ app.js (React/Vue)
    └─ styles.css
    
    ↓ API calls via HTTPS
    
Shared Hosting ($10/month) or Serverless (pay-per-use)
    ├─ api/users.php
    ├─ api/data.php
    └─ MySQL database

Real-World Comparison

Scenario: Blog with 50,000 monthly visitors

Approach	Cost	Performance	Scalability
All on shared hosting	$10/month	Slow (one location)	Limited
Split hosting	$10/month	Fast (global CDN)	10x capacity

When NOT to Split

Very simple PHP template sites (keep it simple)
Real-time apps with WebSockets (need persistent connections)
Tightly coupled apps (like Next.js with SSR)

Best Practices

CORS Configuration: Allow frontend domain to access backend API
Environment Variables: Store API URL in config (different for dev/prod)
API Versioning: Use /api/v1/ for future compatibility
Caching: Cache API responses in frontend to reduce backend load

This architecture is called “JAMstack” (JavaScript, APIs, Markup) and is widely used in modern web development.

Database Options & Security

Can I Use SQLite?

Short answer: Not on GitHub Pages (no server-side code). On shared hosting, use MySQL instead—it’s safer and easier.

SQLite Security Risks

Critical Issue: SQLite files can be downloaded if not properly secured

❌ DANGEROUS:
/public_html/database.db → Anyone can download at yoursite.com/database.db

✅ SAFE:
/home/username/private/database.db (outside web root)

Other risks:

No built-in authentication or encryption
File corruption possible
No audit logging
Requires careful file permissions

Database Recommendations by Hosting Type

GitHub Pages (Static Hosting)

Option 1: Client-Side Storage (No Backend)

// localStorage - 5-10MB per domain
localStorage.setItem('theme', 'dark');
localStorage.setItem('user', JSON.stringify(userData));

Use for: User preferences, temporary data, offline apps Limitations: Data only on user’s device, not shared between devices

Option 2: JSON Files (Read-Only)

// Fetch static JSON data
fetch('/data/products.json')
  .then(res => res.json())
  .then(data => console.log(data));

Use for: Product catalogs, blog posts, configuration, public data Limitations: Read-only, must rebuild site to update

Option 3: Serverless Database (Recommended for User Data)

Supabase (Free tier: 500MB database)

import { createClient } from '@supabase/supabase-js'

const supabase = createClient('https://your-project.supabase.co', 'key')
const { data } = await supabase.from('users').select('*')

Firebase (Free tier: 1GB storage)

import { getFirestore, collection, getDocs } from 'firebase/firestore'

const db = getFirestore()
const querySnapshot = await getDocs(collection(db, 'users'))

Pros: Built-in authentication, real-time updates, secure, free tier Cons: Vendor lock-in, learning curve

Shared Hosting

Use MySQL (Included with Hosting)

Why MySQL over SQLite:

✅ Not accessible via web (runs on separate port)
✅ Built-in user authentication
✅ Better security and reliability
✅ Included with most shared hosting
✅ Easy setup via cPanel (5 minutes)

Setup:

Create database in cPanel
Create database user with password
Connect from PHP:

$conn = new mysqli($host, $user, $pass, $dbname);

VPS/Cloud Hosting

PostgreSQL (Recommended for Modern Apps)

More features than MySQL
Better for complex queries
JSON support built-in
Open source

MongoDB (NoSQL)

Flexible schema
Good for rapidly changing data
JSON-like documents
Requires more memory

SQLite Best Practices (If You Must Use It)

Only use SQLite for:

Local development/testing
Desktop applications
Single-user apps
Cache/temporary data

Security checklist:

Store database outside web root
Set file permissions to 600
Add .htaccess to block direct access
Never expose database path in URLs
Encrypt sensitive data
Use prepared statements (prevent SQL injection)
Regular backups

Example .htaccess:

<Files "*.db">
    Order allow,deny
    Deny from all
</Files>

Database Comparison

Database	Best For	Hosting	Security	Setup Time
localStorage	User preferences	GitHub Pages	Low	1 min
JSON files	Static data	GitHub Pages	Medium	5 min
Supabase	User data (serverless)	Cloud	High	15 min
Firebase	Real-time apps	Cloud	High	15 min
MySQL	Traditional apps	Shared hosting	High	5 min
PostgreSQL	Modern apps	VPS/Cloud	High	15 min
MongoDB	Flexible schemas	VPS/Cloud	High	20 min
SQLite	Local/development	Local only	Low	2 min

Recommended Database by Use Case

Static website (no user data):

JSON files or no database

Simple app (user preferences only):

localStorage (client-side)

App with user data (GitHub Pages frontend):

Supabase or Firebase (free tier)

App with user data (shared hosting):

MySQL (included with hosting)

Modern web app:

PostgreSQL on VPS/PaaS

Real-time app:

Firebase or Supabase

Complex enterprise app:

PostgreSQL or MongoDB on AWS

Decision Flowchart

START: What are you building?
│
├─ Static website (no backend, no database)
│  │
│  ├─ Just HTML/CSS/JS?
│  │  └─ Use: Plain HTML/CSS/JS or Alpine.js
│  │     Host: GitHub Pages (FREE)
│  │     Mobile: Responsive design
│  │
│  └─ Want modern framework?
│     └─ Use: React/Vue/Angular (build to static)
│        Host: GitHub Pages, Netlify, Vercel (FREE)
│        Mobile: Responsive design
│
├─ Web app with backend + database
│  │
│  ├─ Budget < $20/month?
│  │  └─ Use: React/Vue (frontend) + PHP API + MySQL
│  │     Host: Shared hosting ($5-15/month)
│  │     Mobile: Responsive web or Capacitor (web wrapper)
│  │
│  ├─ Need Node.js/Python backend?
│  │  │
│  │  ├─ Simple app, predictable traffic?
│  │  │  └─ Use: React/Vue + Node.js/Python + PostgreSQL
│  │  │     Host: PaaS like Render/Railway ($5-20/month)
│  │  │     Mobile: Responsive web
│  │  │
│  │  └─ Complex app, variable traffic?
│  │     └─ Use: React/Vue + Serverless API + DynamoDB
│  │        Host: Vercel (frontend) + AWS Lambda (backend)
│  │        Cost: Pay-per-use ($0-50+/month)
│  │        Mobile: Responsive web
│  │
│  └─ Need real-time features? (chat, live updates)
│     └─ Use: React/Vue + Node.js + WebSockets + Redis
│        Host: VPS or PaaS ($10-50/month)
│        Mobile: Responsive web
│
├─ Web app + Native mobile apps
│  │
│  ├─ Want maximum code sharing?
│  │  └─ Use: React (web) + React Native (mobile)
│  │     Backend: Choose based on budget (PHP/Node.js/Serverless)
│  │     Host: Based on backend choice
│  │     Cost: Hosting + $99/year (Apple) + $25 one-time (Google)
│  │
│  ├─ Web-first, mobile is secondary?
│  │  └─ Use: React/Vue (web) + Capacitor (wraps web as app)
│  │     Backend: Choose based on budget
│  │     Host: Based on backend choice
│  │     Cost: Hosting + app store fees
│  │
│  └─ Need best mobile performance?
│     └─ Use: React Native or Flutter (separate from web)
│        Backend: Choose based on budget
│        Host: Based on backend choice
│        Cost: Hosting + app store fees
│
└─ Enterprise/High-traffic application
   └─ Use: React/Angular + Microservices + AWS
      Host: AWS (EC2, ECS, RDS, etc.)
      Cost: $100-1000+/month
      Mobile: React Native or separate native apps

Technology Reference Tables

Frontend Frameworks

Technology	Build Required	Learning Curve	Bundle Size	Mobile Support	Best For
React	Yes	Medium	Medium	React Native	Large apps, mobile
Vue.js	Yes	Easy	Small	Capacitor	Small-medium apps
Angular	Yes	Hard	Large	Ionic	Enterprise apps
Svelte	Yes	Easy	Smallest	Capacitor	Performance-critical
Alpine.js	No	Very Easy	Tiny	❌	Simple interactivity
HTMX	No	Very Easy	Tiny	❌	Server-driven apps
jQuery	No	Easy	Small	❌	Legacy projects
Vanilla JS	No	Medium	None	❌	Learning, simple apps

Backend Technologies

Technology	Language	Shared Hosting	Learning Curve	Best For
PHP	PHP	✅ Yes	Easy	Shared hosting, WordPress
Node.js (Express)	JavaScript	❌ No	Easy	APIs, real-time apps
Python (Django)	Python	❌ No	Medium	Data-heavy apps
Python (Flask)	Python	❌ No	Easy	Simple APIs
Ruby on Rails	Ruby	❌ No	Medium	Rapid development
Laravel	PHP	✅ Yes	Medium	Modern PHP apps
ASP.NET	C#	❌ No	Hard	Enterprise apps
Serverless	Various	N/A	Medium	APIs, event-driven

Databases

Database	Type	Best For	Hosting Options	Cost	Security
localStorage	Client-side	User preferences	Browser only	Free	Low
JSON files	Static	Read-only data	Any static host	Free	Medium
MySQL	SQL	Traditional apps	Shared hosting, AWS RDS	$	High
PostgreSQL	SQL	Modern apps	AWS RDS, VPS	$$	High
SQLite	SQL	Local/dev only	⚠️ Not for production	Free	Low
Supabase	SQL	Serverless apps	Managed service	Free-$$	High
Firebase	NoSQL	Real-time apps	Google Cloud	Free-$$	High
MongoDB	NoSQL	Flexible schemas	MongoDB Atlas, VPS	$-$$	High
DynamoDB	NoSQL	AWS serverless	AWS only	Pay-per-use	High
Redis	Key-value	Caching, sessions	VPS, AWS ElastiCache	$$	Medium

⚠️ Important: Never use SQLite for production web apps. Use MySQL (shared hosting) or Supabase/Firebase (serverless) instead.

Mobile App Technologies

Technology	Code Sharing	Platform	Learning Curve	Performance
React Native	High (with React)	iOS + Android	Medium	Good
Expo	High (with React)	iOS + Android	Easy	Good
Capacitor	Very High (web code)	iOS + Android	Easy	Medium
Ionic	High (with Angular/React/Vue)	iOS + Android	Medium	Medium
Flutter	None (Dart language)	iOS + Android	Medium	Excellent
Swift	None	iOS only	Hard	Excellent
Kotlin	None	Android only	Hard	Excellent

Recommended Stacks by Use Case

Use Case 1: Simple Static Website (Portfolio, Landing Page)

Goal: Minimal cost, easy to maintain

Frontend:  Plain HTML/CSS/JS or Alpine.js
Backend:   None
Database:  None
Hosting:   GitHub Pages (FREE)
Mobile:    Responsive design

Pros: Free, simple, fast Cons: No backend, no database, limited interactivity

Use Case 2: Single Page Application (SPA) - No Backend

Goal: Modern UI, no data persistence

Frontend:  React or Vue.js (build to static)
Backend:   None
Database:  None (or localStorage)
Hosting:   GitHub Pages, Netlify, Vercel (FREE)
Mobile:    Responsive design

Pros: Free, modern UI, fast Cons: No backend, no database

Use Case 3: Web App with Backend (Budget-Friendly)

Goal: Full-featured app, minimal cost

Frontend:  React or Vue.js (build to static)
Backend:   PHP REST API
Database:  MySQL
Hosting:   Shared hosting ($5-15/month)
Mobile:    Responsive web design

Pros: Affordable, full-featured, reliable Cons: Limited to PHP, no real-time features

Alternative with mobile apps:

Frontend:  React (web) + React Native (mobile)
Backend:   PHP REST API
Database:  MySQL
Hosting:   Shared hosting ($5-15/month) + App stores
Mobile:    Native iOS + Android apps

Use Case 4: Modern Web App (Node.js Backend)

Goal: Modern stack, moderate cost

Frontend:  React or Vue.js
Backend:   Node.js (Express) REST API
Database:  PostgreSQL
Hosting:   Render, Railway, or Fly.io ($10-25/month)
Mobile:    Responsive web design

Pros: Modern stack, scalable, good developer experience Cons: More expensive than shared hosting

Use Case 5: Serverless Application

Goal: Scalable, pay-per-use

Frontend:  React or Vue.js (build to static)
Backend:   AWS Lambda or Vercel Functions
Database:  DynamoDB or Supabase
Hosting:   Vercel/Netlify (frontend) + AWS (backend)
Cost:      $0-50+/month (pay-per-use)
Mobile:    Responsive web design

Pros: Scales automatically, pay only for usage Cons: Cold starts, vendor lock-in, complex debugging

Use Case 6: Real-Time Application (Chat, Collaboration)

Goal: Real-time features, WebSockets

Frontend:  React or Vue.js
Backend:   Node.js + Socket.io
Database:  PostgreSQL + Redis (caching)
Hosting:   VPS or PaaS ($20-50/month)
Mobile:    Responsive web or React Native

Pros: Real-time capabilities, full control Cons: More complex, requires WebSocket support

Use Case 7: Mobile-First Application

Goal: Native mobile apps + web app

Frontend:  React (web) + React Native (mobile)
Backend:   Node.js REST API or Serverless
Database:  PostgreSQL or MongoDB
Hosting:   Based on backend choice
Cost:      Hosting + $99/year (Apple) + $25 (Google)

Pros: Code sharing, native performance, one codebase Cons: More complex, app store management

Alternative (web wrapper):

Frontend:  React or Vue (web) + Capacitor (mobile wrapper)
Backend:   Any
Database:  Any
Hosting:   Based on backend choice

Pros: Maximum code sharing, easier than React Native Cons: Not truly native, performance limitations

Use Case 8: Enterprise Application

Goal: Scalable, robust, high-traffic

Frontend:  React or Angular
Backend:   Microservices (Node.js, Python, etc.)
Database:  PostgreSQL (AWS RDS) + Redis
Hosting:   AWS (EC2, ECS, or EKS)
Cost:      $100-1000+/month
Mobile:    React Native or separate native apps

Pros: Highly scalable, robust, enterprise-grade Cons: Expensive, complex, requires DevOps expertise

Quick Decision Helper

Question 1: Do you need a backend/database?

No → Static hosting (GitHub Pages, Netlify) - FREE
Yes → Go to Question 2

Question 2: What’s your budget?

< $20/month → Shared hosting + PHP
$20-50/month → VPS or PaaS + Node.js/Python
Variable traffic → Serverless (pay-per-use)
> $100/month → AWS/Cloud

Question 3: Do you need mobile apps?

No → Web-only (responsive design)
Yes, native → React + React Native
Yes, but web wrapper is fine → React/Vue + Capacitor

Question 4: Which frontend framework?

First project → Vue.js (easiest)
Need mobile apps → React (React Native)
Enterprise app → Angular
Most versatile → React

Question 5: Which backend?

Shared hosting → PHP
Modern stack → Node.js
Data-heavy → Python (Django)
Serverless → AWS Lambda, Vercel Functions

Question 6: Which database?

Shared hosting → MySQL
Modern apps → PostgreSQL
Serverless → DynamoDB, Supabase
Real-time → Firebase, Supabase
Small apps → SQLite

Technology Combinations That Work

Static Hosting (FREE)

Frontend	Backend	Database	Hosting	Works?
React (built)	None	None	GitHub Pages	✅
Vue (built)	None	None	Netlify	✅
Angular (built)	None	None	Vercel	✅
Plain HTML/JS	None	None	GitHub Pages	✅

Shared Hosting ($5-15/month)

Frontend	Backend	Database	Hosting	Works?
PHP templates	PHP	MySQL	Shared hosting	✅
React (built)	PHP	MySQL	Shared hosting	✅
Vue (built)	PHP	MySQL	Shared hosting	✅
Angular (built)	PHP	MySQL	Shared hosting	✅
React	Node.js	MongoDB	Shared hosting	❌

VPS/PaaS ($10-50/month)

Frontend	Backend	Database	Hosting	Works?
React	Node.js	PostgreSQL	Render/Railway	✅
Vue	Python	PostgreSQL	Fly.io	✅
Angular	Node.js	MongoDB	DigitalOcean	✅
Any	Any	Any	VPS	✅

Serverless (Pay-per-use)

Frontend	Backend	Database	Hosting	Works?
React	AWS Lambda	DynamoDB	Vercel + AWS	✅
Vue	Vercel Functions	Supabase	Vercel	✅
Next.js	Built-in API	PostgreSQL	Vercel	✅

Summary

For beginners: Start with Vue.js + PHP + MySQL on shared hosting ($5-15/month)

For modern apps: Use React + Node.js + PostgreSQL on PaaS ($10-25/month)

For mobile apps: Use React + React Native with any backend

For scalability: Use serverless (AWS Lambda, Vercel) with pay-per-use pricing

For enterprise: Use React/Angular + microservices on AWS ($100+/month)

Remember: Start simple, scale when needed. Don’t over-engineer early projects.

Carlos Guardia

Tech Stack Decision Guide

Table of Contents

Understanding the Basics

What is NPM and Why Do Some Frameworks Need a “Build”?

React vs Vue.js vs Angular

When to Choose React

When to Choose Vue.js

When to Choose Angular

Quick Comparison Table

Hosting Options by Cost

1. Free Hosting ($0/month)

2. Shared Hosting ($5-15/month)

3. VPS/Cloud Server ($5-50/month)

4. Platform as a Service ($0-50+/month)

5. Serverless ($0-100+/month, pay-per-use)

6. Full AWS/Cloud ($50-500+/month)

Hosting Decision Matrix

Split Frontend/Backend Hosting

Why Host Frontend and Backend Separately?

Key Advantages

Example Architecture

Real-World Comparison

When NOT to Split

Best Practices

Database Options & Security

Can I Use SQLite?

SQLite Security Risks

Database Recommendations by Hosting Type

GitHub Pages (Static Hosting)

Shared Hosting

VPS/Cloud Hosting

SQLite Best Practices (If You Must Use It)

Database Comparison

Recommended Database by Use Case

Decision Flowchart

Technology Reference Tables

Frontend Frameworks

Backend Technologies

Databases

Mobile App Technologies

Recommended Stacks by Use Case

Use Case 1: Simple Static Website (Portfolio, Landing Page)

Use Case 2: Single Page Application (SPA) - No Backend

Use Case 3: Web App with Backend (Budget-Friendly)

Use Case 4: Modern Web App (Node.js Backend)

Use Case 5: Serverless Application

Use Case 6: Real-Time Application (Chat, Collaboration)

Use Case 7: Mobile-First Application

Use Case 8: Enterprise Application

Quick Decision Helper

Question 1: Do you need a backend/database?

Question 2: What’s your budget?

Question 3: Do you need mobile apps?

Question 4: Which frontend framework?

Question 5: Which backend?

Question 6: Which database?

Technology Combinations That Work

Static Hosting (FREE)

Shared Hosting ($5-15/month)

VPS/PaaS ($10-50/month)

Serverless (Pay-per-use)

Summary