use example website

content/posts/css-grid-flexbox.md

@@ -0,0 +1,40 @@
+---
+title: "CSS Grid vs Flexbox: When to Use What"
+date: 2024-08-03
+categories: ["tech", "tutorial"]
+tags: ["css", "layout", "frontend"]
+---
+
+# CSS Grid vs Flexbox: When to Use What
+
+Understanding the differences between CSS Grid and Flexbox for modern layouts.
+
+## Use Flexbox For:
+- One-dimensional layouts (rows OR columns)
+- Component-level design
+- Centering content
+- Navigation bars
+
+## Use CSS Grid For:
+- Two-dimensional layouts (rows AND columns)
+- Page-level design
+- Complex layouts
+- Card grids
+
+```css
+/* Flexbox for navigation */
+.nav {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+/* Grid for main layout */
+.layout {
+  display: grid;
+  grid-template-columns: 1fr 3fr 1fr;
+  grid-template-rows: auto 1fr auto;
+}
+```
+
+Both are powerful tools - use them together!

content/posts/docker-development-workflow.md

@@ -0,0 +1,53 @@
+---
+title: "Docker Development Workflow for Hugo Themes"
+date: 2024-07-28
+categories: ["tech", "tutorial"]
+tags: ["docker", "hugo", "development", "workflow"]
+---
+
+# Docker Development Workflow for Hugo Themes
+
+Setting up a consistent development environment across different machines is crucial for theme development. Here's my Docker-based workflow.
+
+## The Setup
+
+```dockerfile
+FROM hugomods/hugo:exts-0.120.4
+WORKDIR /src
+COPY . /src/themes/nomad-tech/
+CMD ["hugo", "server", "--bind", "0.0.0.0", "--buildDrafts"]
+```
+
+## Docker Compose Configuration
+
+```yaml
+services:
+  hugo:
+    build: .
+    volumes:
+      - "./exampleSite:/src"
+    ports:
+      - "1313:1313"
+```
+
+## Benefits
+
+- **Consistency**: Same Hugo version everywhere
+- **Security**: Pinned, official images only
+- **Isolation**: No local Hugo installation needed
+- **Portability**: Works on any machine with Docker
+
+## Development Commands
+
+```bash
+# Start development server
+docker-compose up
+
+# Build for production
+docker-compose run hugo hugo --minify
+
+# Clean up
+docker-compose down
+```
+
+This workflow has saved me countless hours of environment setup!

content/posts/example-post.md

@@ -0,0 +1,16 @@
+---
+title: "Welcome to Nomad Tech Theme"
+date: 2024-01-01
+categories: ["Tech", "Hugo", "Themes"]
+---
+
+This is an example post to demonstrate the Nomad Tech Theme features.
+
+## Features
+
+- Modern design
+- Multilingual support
+- Portfolio integration
+- Social media links
+
+Customize this theme by editing your `hugo.toml` configuration file.

content/posts/hugo-theme-development.md

@@ -0,0 +1,49 @@
+---
+title: "Building a Hugo Theme from Scratch"
+date: 2024-08-10
+categories: ["tech", "tutorial"]
+tags: ["hugo", "web-development", "static-sites"]
+---
+
+# Building a Hugo Theme from Scratch
+
+Creating a custom Hugo theme has been an exciting journey! Here's what I learned while building the nomad-tech theme.
+
+## Key Concepts
+
+Hugo's template lookup order is crucial for theme development:
+
+```
+layouts/
+├── _default/
+│   ├── baseof.html
+│   ├── list.html
+│   └── single.html
+├── partials/
+└── section-name/
+    └── list.html
+```
+
+## Hugo Pipes for Assets
+
+Modern Hugo themes should use Hugo Pipes for asset processing:
+
+```go
+{{ $scss := resources.Get "scss/main.scss" }}
+{{ $css := $scss | resources.ToCSS | resources.Minify | resources.Fingerprint }}
+```
+
+## Multilingual Support
+
+Hugo's i18n system makes multilingual themes straightforward:
+
+```yaml
+# i18n/en.toml
+[home]
+other = "Home"
+
+[about]
+other = "About"
+```
+
+Building themes teaches you so much about Hugo's internals!

content/posts/javascript-async-patterns.md

@@ -0,0 +1,31 @@
+---
+title: "Modern JavaScript Async Patterns"
+date: 2024-08-12
+categories: ["tech", "tutorial"]
+tags: ["javascript", "async", "promises"]
+---
+
+# Modern JavaScript Async Patterns
+
+Exploring the evolution from callbacks to async/await and beyond.
+
+## Promise Chains vs Async/Await
+
+```javascript
+// Promise chains
+fetchUser(id)
+  .then(user => fetchPosts(user.id))
+  .then(posts => renderPosts(posts))
+  .catch(handleError);
+
+// Async/await
+try {
+  const user = await fetchUser(id);
+  const posts = await fetchPosts(user.id);
+  renderPosts(posts);
+} catch (error) {
+  handleError(error);
+}
+```
+
+The async/await syntax makes asynchronous code much more readable!

content/posts/nomad-budget-breakdown.md

@@ -0,0 +1,45 @@
+---
+title: "Digital Nomad Budget Breakdown: $2000/Month"
+date: 2024-07-20
+categories: ["nomad", "lifestyle"]
+tags: ["budget", "finance", "planning"]
+---
+
+# Digital Nomad Budget Breakdown: $2000/Month
+
+How I manage to live comfortably on $2000/month as a digital nomad.
+
+## Monthly Expenses
+
+### Accommodation ($600-800)
+- Airbnb/coliving spaces
+- 1-month stays for better rates
+- Shared apartments in nomad hubs
+
+### Food ($300-400)
+- Local restaurants: $3-8/meal
+- Groceries: $100/month
+- Occasional splurges: $50
+
+### Transportation ($200-300)
+- Flights: $150/month average
+- Local transport: $50
+- Scooter rental: $100
+
+### Work Setup ($100-150)
+- Coworking spaces: $80
+- Mobile data: $20
+- Coffee shops: $50
+
+### Entertainment ($200-250)
+- Activities and tours
+- Gym memberships
+- Social events
+
+## Money-Saving Tips
+1. Cook at home 3-4 times/week
+2. Use local transport
+3. Book flights in advance
+4. Choose emerging destinations
+
+Living the nomad dream doesn't have to break the bank!

content/posts/nomad-life-bali.md

@@ -0,0 +1,31 @@
+---
+title: "Digital Nomad Life in Bali: 3 Months In"
+date: 2024-08-05
+categories: ["nomad", "lifestyle"]
+tags: ["bali", "remote-work", "coworking"]
+---
+
+# Digital Nomad Life in Bali: 3 Months In
+
+Three months into my Bali adventure, and I'm still amazed by how this island balances productivity with paradise.
+
+## The Good
+
+- **Coworking Scene**: Dojo Bali and Outpost are incredible
+- **Internet**: Surprisingly reliable 50+ Mbps in most areas
+- **Community**: Amazing nomad community, especially in Canggu
+- **Cost**: $800-1200/month for a comfortable lifestyle
+
+## The Challenges
+
+- **Rainy Season**: Coding during tropical storms is... interesting
+- **Traffic**: Scooter rides to meetings can be adventures
+- **Time Zones**: Client calls at 2 AM are rough
+
+## Productivity Tips
+
+1. **Morning Routine**: Surf at sunrise, code by 9 AM
+2. **Coworking**: Don't work from your villa all the time
+3. **Backup Internet**: Always have a mobile hotspot ready
+
+The blend of tech work and tropical living is addictive. Already planning my next destination!

content/posts/nomad-visa-guide.md

@@ -0,0 +1,26 @@
+---
+title: "Digital Nomad Visa Guide 2024"
+date: 2024-08-08
+categories: ["nomad", "lifestyle"]
+tags: ["visa", "travel", "remote-work"]
+---
+
+# Digital Nomad Visa Guide 2024
+
+Complete guide to digital nomad visas and remote work permits.
+
+## Top Nomad-Friendly Countries
+
+- **Portugal**: D7 Visa (1-2 years)
+- **Estonia**: Digital Nomad Visa (1 year)
+- **Barbados**: Welcome Stamp (1 year)
+- **Dubai**: Virtual Working Program (1 year)
+
+## Application Tips
+
+1. **Income Requirements**: Usually $2000-3500/month
+2. **Health Insurance**: Mandatory for most programs
+3. **Processing Time**: 2-8 weeks typically
+4. **Remote Work Proof**: Employment letter or business registration
+
+Planning ahead is key for a smooth nomad journey!

content/posts/react-hooks-guide.md

@@ -0,0 +1,48 @@
+---
+title: "React Hooks Complete Guide"
+date: 2024-07-25
+categories: ["tech", "tutorial"]
+tags: ["react", "hooks", "frontend"]
+---
+
+# React Hooks Complete Guide
+
+Master React Hooks with practical examples and best practices.
+
+## Essential Hooks
+
+### useState
+```jsx
+const [count, setCount] = useState(0);
+```
+
+### useEffect
+```jsx
+useEffect(() => {
+  document.title = `Count: ${count}`;
+}, [count]);
+```
+
+### useContext
+```jsx
+const theme = useContext(ThemeContext);
+```
+
+## Custom Hooks
+
+```jsx
+function useLocalStorage(key, initialValue) {
+  const [value, setValue] = useState(() => {
+    return localStorage.getItem(key) || initialValue;
+  });
+  
+  const setStoredValue = (newValue) => {
+    setValue(newValue);
+    localStorage.setItem(key, newValue);
+  };
+  
+  return [value, setStoredValue];
+}
+```
+
+Hooks make React development so much cleaner!

content/posts/remote-work-tools-2024.md

@@ -0,0 +1,51 @@
+---
+title: "Essential Remote Work Tools for Developers in 2024"
+date: 2024-07-15
+categories: ["tech", "nomad"]
+tags: ["remote-work", "tools", "productivity"]
+---
+
+# Essential Remote Work Tools for Developers in 2024
+
+After working remotely from 15+ countries, here are the tools that keep me productive anywhere.
+
+## Communication & Collaboration
+
+- **Slack/Discord**: Team communication
+- **Zoom/Meet**: Video calls with good mobile data usage
+- **Notion**: Documentation and project management
+- **Figma**: Design collaboration
+
+## Development Environment
+
+- **VS Code**: With Settings Sync enabled
+- **GitHub Codespaces**: When local setup isn't possible
+- **Docker**: Consistent environments everywhere
+- **Tailscale**: Secure access to home lab
+
+## Connectivity & Backup
+
+- **Speedtest CLI**: `speedtest-cli` for quick connection checks
+- **Multiple ISPs**: Always have 2+ internet sources
+- **VPN**: Essential for accessing geo-restricted services
+- **Power Bank**: 20,000mAh minimum for long coding sessions
+
+## Productivity Hacks
+
+```bash
+# My daily setup script
+#!/bin/bash
+speedtest-cli
+git status
+docker-compose up -d
+code .
+```
+
+## Location-Specific Tips
+
+- **Thailand**: AIS has the best coverage
+- **Indonesia**: Telkomsel for reliability
+- **Portugal**: MEO fiber is excellent
+- **Mexico**: Telmex for stable connections
+
+The key is redundancy - always have backups for your backups!

content/posts/thailand-coworking-spaces.md

@@ -0,0 +1,33 @@
+---
+title: "Best Coworking Spaces in Thailand"
+date: 2024-07-30
+categories: ["nomad", "lifestyle"]
+tags: ["thailand", "coworking", "productivity"]
+---
+
+# Best Coworking Spaces in Thailand
+
+My experience working from Thailand's top coworking spaces.
+
+## Bangkok
+- **HUBBA-TO**: Premium space in Thonglor
+- **Launchpad**: Great community, multiple locations
+- **The Hive**: Professional environment
+
+## Chiang Mai
+- **CAMP**: The nomad headquarters
+- **Punspace**: Reliable and affordable
+- **Maya Lifestyle**: Modern facilities
+
+## Phuket
+- **Andaman Coworking**: Beach vibes
+- **Outpost**: International community
+
+## What to Look For
+- Stable internet (50+ Mbps)
+- Comfortable seating
+- Meeting rooms
+- Coffee quality (important!)
+- Community events
+
+Thailand's coworking scene is world-class!

content/posts/typescript-best-practices.md

@@ -0,0 +1,54 @@
+---
+title: "TypeScript Best Practices 2024"
+date: 2024-07-18
+categories: ["tech", "tutorial"]
+tags: ["typescript", "javascript", "best-practices"]
+---
+
+# TypeScript Best Practices 2024
+
+Essential TypeScript patterns and practices for better code quality.
+
+## Type Definitions
+
+```typescript
+// Use interfaces for object shapes
+interface User {
+  id: string;
+  name: string;
+  email: string;
+  createdAt: Date;
+}
+
+// Use type aliases for unions
+type Status = 'loading' | 'success' | 'error';
+
+// Generic constraints
+interface Repository<T extends { id: string }> {
+  findById(id: string): Promise<T>;
+  save(entity: T): Promise<T>;
+}
+```
+
+## Utility Types
+
+```typescript
+// Partial for updates
+function updateUser(id: string, updates: Partial<User>) {
+  // Implementation
+}
+
+// Pick for specific fields
+type UserSummary = Pick<User, 'id' | 'name'>;
+
+// Omit for exclusions
+type CreateUser = Omit<User, 'id' | 'createdAt'>;
+```
+
+## Best Practices
+1. Enable strict mode
+2. Use unknown instead of any
+3. Prefer type assertions over type casting
+4. Use const assertions for immutable data
+
+TypeScript makes JavaScript development so much safer!