[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-data-/id/projects/portfolio":3,"projects-nav-list":35,"related-insights-/id/projects/portfolio":244},{"id":4,"slug":5,"slugId":6,"title":7,"titleId":8,"titleAu":7,"titleSg":7,"description":9,"descriptionId":10,"descriptionAu":9,"descriptionSg":9,"contentId":11,"cover":12,"coverId":6,"category":13,"tags":16,"location":21,"links":22,"metrics":25,"status":29,"date":30,"createdAt":31,"updatedAt":32,"body":33,"_path":34,"_id":5},1,"portfolio",null,"Personal Portfolio Website","Website Portofolio Personal","A high-performance portfolio website built with Nuxt 4, featuring 3D animations, contact form integration, and admin CMS.","Website portofolio profesional dan berkinerja tinggi yang dibangun menggunakan Nuxt 4 oleh web developer berpengalaman. Dilengkapi animasi 3D, integrasi formulir kontak, dan CMS admin.","## Ringkasan Proyek\n\nWebsite portofolio personal yang berfungsi sebagai etalase karya web developer dan studi kasus teknis. Tujuannya adalah membangun situs website yang menarik secara visual tanpa mengorbankan performa atau kemudahan perawatan.\n\n## Tantangan Utama\n\n### Performa Bagian Hero 3D\n\nHalaman beranda menampilkan korsel 3D dengan animasi mengambang. Tantangannya adalah menjaga animasi tetap mulus pada 60fps sambil meminimalkan dampak pada waktu muat halaman.\n\nSaya menggunakan transformasi 3D berbasis CSS dengan perspektif dan akselerasi perangkat keras. Elemen-elemen berat dimuat secara malas (lazy-loaded) agar tampilan awal tetap cepat.\n\n### Formulir Kontak dengan Notifikasi Email\n\nFormulir kontak perlu mengirim email secara langsung tanpa bergantung pada layanan pihak ketiga. Saya mengintegrasikan Nodemailer dengan SMTP Gmail menggunakan Sandi Aplikasi (App Passwords) untuk autentikasi.\n\nMenambahkan halaman Terima Kasih (Thank You) khusus dengan perlindungan rute agar analitik dapat melacak pengiriman yang berhasil.\n\n### Masalah Tata Letak Responsif\n\n![tm mobile.jpg](https://cdn.thismarshal.com/project/1773069394317-tm_mobile.jpg)\n\nBagian statistik terpotong pada ukuran layar tertentu. Diperbaiki dengan menyesuaikan perilaku tinggi bagian dan properti overflow. Mengubah navigasi dari posisi sticky menjadi fixed untuk pengalaman pengguna (UX) yang lebih baik saat digulir.\n\n### Halaman 404 Kustom\n\nMembuat halaman kesalahan kustom dengan desain kartu mengambang dan animasi halus. Awalnya diimplementasikan dengan pendekatan pengalihan (redirect) yang menyebabkan masalah di produksi, lalu di-refactor untuk dirender secara sebaris (inline).\n\n## Apa yang Saya Pelajari\n\nLingkungan produksi berperilaku berbeda dari lokal. Variabel lingkungan dengan karakter khusus memerlukan pengkodean yang tepat. Selalu uji alur autentikasi secara menyeluruh (end-to-end) sebelum peluncuran.\n\nPenanganan kesalahan yang anggun (graceful error handling) sangat penting. Ketika koneksi basis data gagal di produksi, situs rusak total. Menambahkan cadangan (fallback) agar situs tetap berfungsi dengan konten statis saat basis data tidak tersedia.\n\n## Hasil\n\nSitus ini mencapai skor Lighthouse sempurna dan memberikan pengalaman mulus di berbagai perangkat. Dilengkapi dengan sistem admin lengkap untuk mengelola konten, dilindungi oleh kata sandi dan autentikasi 2FA opsional.","https://cdn.thismarshal.com/project/1770067526407-project_website_portofolio.webp",[14,15],"Web Development","Technical SEO",[17,18,19,20],"Nuxt 4","Bun","Edge","Tailwind v4","Jakarta, Indonesia",{"repo":23,"preview":24,"demo":24},"https://github.com/gasmarshal/portfolio","https://www.thismarshal.com/",{"build_time":26,"lighthouse":27,"interactive":28},"-60%","100","\u003C50ms","published","2025-02-01T00:00:00.000Z","2025-12-01T12:04:06.441Z","2026-05-28T17:49:52.871Z","## Project Overview\n\nA personal portfolio website that serves as both a showcase and a technical case study. The goal was to build something visually engaging without sacrificing performance or maintainability.\n\n## Key Challenges\n\n### 3D Hero Section Performance\n\nThe homepage features a 3D carousel with floating animations. The challenge was keeping animations smooth at 60fps while minimizing impact on page load.\n\nI used CSS-based 3D transforms with perspective and hardware acceleration. Heavy elements are lazy-loaded to keep initial paint fast.\n\n### Contact Form with Email Notifications\n\nThe contact form needed to send emails directly without relying on third-party form services. I integrated Nodemailer with Gmail SMTP using App Passwords for authentication.\n\nAdded a dedicated Thank You page with route protection so analytics can track successful submissions.\n\n### Responsive Layout Issues\n\n![tm mobile.jpg](https://cdn.thismarshal.com/project/1773069394317-tm_mobile.jpg)\n\nThe stats section was getting cut off on certain screen sizes. Fixed by adjusting section height behavior and overflow properties. Changed the navigation from sticky to fixed positioning for better UX on scroll.\n\n### Custom 404 Page\n\nCreated a custom error page with a floating card design and subtle animations. Initially implemented with a redirect approach that caused issues in production, then refactored to render inline.\n\n## What I Learned\n\nProduction environments behave differently than local. Environment variables with special characters need proper encoding. Always test authentication flows end-to-end before deployment.\n\nGraceful error handling matters. When the database connection failed in production, the site broke completely. Added fallbacks so the site works with static content when the database is unavailable.\n\n## Outcome\n\nThe site achieves perfect Lighthouse scores and provides a smooth experience across devices. It includes a complete admin system for managing content, protected by password and optional 2FA authentication.","/projects/portfolio",[36,65,92,118,123,154,186,218],{"id":37,"slug":38,"slugId":6,"title":39,"titleId":40,"titleAu":39,"titleSg":39,"description":41,"descriptionId":42,"descriptionAu":41,"descriptionSg":41,"cover":43,"coverId":6,"category":44,"tags":46,"location":54,"links":55,"metrics":56,"status":29,"date":61,"createdAt":62,"updatedAt":63,"_path":64},41,"wordpress-seo-technical-audit","WordPress SEO Migration and Technical Audit","Migrasi SEO WordPress dan Audit Teknis Website","A risk-critical migration from Yoast SEO to AISEO on a live WordPress site with established page 1 rankings, executed without any loss of indexing, rankings, or conversion tracking continuity.","Layanan migrasi SEO WordPress kritis dari Yoast SEO ke AISEO pada website live dengan peringkat halaman 1 Google. Eksekusi aman tanpa kehilangan indeksasi, penurunan peringkat ranking, atau gangguan kontinuitas pelacakan konversi analytics.","https://cdn.thismarshal.com/project/1774202649217-wordpress_migrations.webp",[15,45],"SEO",[47,48,49,50,51,52,53],"Yoast SEO","AISEO","Schema Markup","Google Tag Manager","Google Analytics 4","Google Ads","301 Redirects","Auckland, New Zealand",{},{"Plugin Migrations":57,"Pages deindexed":58,"Schema":59,"Tracking":60,"Conversion events":52},"Yoast to AISEO","Zero","Cleaned up","GTM + GA4","2026-03-22T00:00:00.000Z","2026-03-22T18:04:11.558Z","2026-05-28T17:49:52.964Z","/projects/wordpress-seo-technical-audit",{"id":66,"slug":67,"slugId":6,"title":68,"titleId":69,"titleAu":70,"titleSg":70,"description":71,"descriptionId":72,"descriptionAu":71,"descriptionSg":71,"cover":73,"coverId":6,"category":74,"tags":75,"location":81,"links":82,"metrics":83,"status":29,"date":88,"createdAt":89,"updatedAt":90,"_path":91},20,"revamp-shopify-website-for-australian-beauty-brand","Shopify Website for Australian Beauty Brand","Jasa Redesign Website Shopify untuk Brand Kecantikan Australia","Revamping a Shopify Store for an Australian Beauty Brand","A complete frontend overhaul and custom feature integration for a premium eyelash and beauty brand in Australia to boost conversions and deliver a seamless shopping experience.","Jasa redesign website e-commerce dan perombakan total frontend Shopify untuk brand kecantikan premium di Australia. Web developer e-commerce kami meningkatkan konversi dan memberikan pengalaman belanja yang cepat dan lancar.","https://cdn.thismarshal.com/project/1773067531658-char_increase_analytics.jpg",[14],[76,77,78,15,79,80],"Shopify","Liquid","Frontend Optimization","UI","UX","Victoria, Australia",{},{"Load Speed":84,"Plugins Cleaned":85,"Custom":86,"Increase New User ":87},"80%","100%"," UI TikTok Scroll","11,6%","2026-03-09T00:00:00.000Z","2026-03-09T06:45:17.904Z","2026-07-14T00:08:04.807Z","/projects/revamp-shopify-website-for-australian-beauty-brand",{"id":93,"slug":94,"slugId":6,"title":95,"titleId":96,"titleAu":95,"titleSg":95,"description":97,"descriptionId":98,"descriptionAu":99,"descriptionSg":99,"cover":100,"coverId":6,"category":101,"tags":102,"location":109,"links":110,"metrics":111,"status":29,"date":114,"createdAt":115,"updatedAt":116,"_path":117},15,"saas-architecture","Scalable Chat Commerce SaaS Architecture","Arsitektur SaaS Chat Commerce Skalabel untuk Jualan Online","Architecting a scalable conversational commerce engine using Nuxt 3 and Express js to turn standard WhatsApp chats into a fully functional sales channel.","Membangun arsitektur mesin conversational commerce skalabel menggunakan Nuxt 3 dan Express js untuk mengubah chat WhatsApp standar menjadi saluran penjualan online yang fungsional.","Architecting a scalable conversational commerce engine using Nuxt 3 and Express.js to turn standard WhatsApp chats into a fully functional sales channel.","https://cdn.thismarshal.com/project/1772307566427-dichat_dash.jpg",[14],[103,104,105,106,107,108],"Nuxt 3","Express js","WhatsApp Business  API","Chat Commerce","SaaS Architecture","Webhooks","Jakarta, Indonesia ",{},{"Architecture type":112,"Avg response time chatbot":113,"Lighthouse score":27},"Multi-tenant","3s","2026-02-27T00:00:00.000Z","2026-02-27T11:32:55.667Z","2026-07-14T00:57:55.775Z","/projects/saas-architecture",{"id":4,"slug":5,"slugId":6,"title":7,"titleId":8,"titleAu":7,"titleSg":7,"description":9,"descriptionId":10,"descriptionAu":9,"descriptionSg":9,"cover":12,"coverId":6,"category":119,"tags":120,"location":21,"links":121,"metrics":122,"status":29,"date":30,"createdAt":31,"updatedAt":32,"_path":34},[14,15],[17,18,19,20],{"repo":23,"preview":24,"demo":24},{"build_time":26,"lighthouse":27,"interactive":28},{"id":124,"slug":125,"slugId":6,"title":126,"titleId":127,"titleAu":126,"titleSg":126,"description":128,"descriptionId":129,"descriptionAu":130,"descriptionSg":128,"cover":131,"coverId":6,"category":132,"tags":133,"location":21,"links":140,"metrics":142,"status":29,"date":150,"createdAt":151,"updatedAt":152,"_path":153},2,"fishery","B2B2C Fisheries Market Expansion","Ekspansi Pasar Perikanan B2B2C - Strategi SEO & Ekspor","Strategic digital transformation for a fisheries company, expanding B2B reach to global markets (Canada, US, China) and doubling sales in one quarter.","Transformasi digital strategis dan SEO perikanan untuk memperluas jangkauan ekspor B2B ke pasar global (Kanada, AS, Tiongkok) dan melipatgandakan penjualan B2C lokal dalam satu kuartal.","Strategic digital transformation for a fisheries company, expanding B2B reach into global markets (Canada, the US, China) and doubling sales in a single quarter.","https://cdn.thismarshal.com/project/1770109178048-dominated_page_1_google_for_high_competition_keywords_in_the_global_market..jpg",[45,15],[15,134,135,136,137,138,139],"Multilingual SEO","GTM","Google Analytics","Backlink Strategy","b2b2c","Growth Hacking",{"live":141},"https://aruna.id",{"traffic_increase":143,"timeframe":144,"keywords_ranked":145,"leads_generated":146,"sales_growth":147,"marketplace_rev":148,"market_reach":149},"+70%","36 months","10+ to Page 1","100 B2B Leads","2x (Doubled) in 1 Quarter","100% (Tokopedia/Shopee)","Canada, US, China, ID","2024-12-31T00:00:00.000Z","2025-12-01T12:04:06.762Z","2026-07-13T23:17:54.335Z","/projects/fishery",{"id":155,"slug":156,"slugId":6,"title":157,"titleId":158,"titleAu":159,"titleSg":159,"description":160,"descriptionId":161,"descriptionAu":162,"descriptionSg":162,"cover":163,"coverId":6,"category":164,"tags":166,"location":175,"links":176,"metrics":178,"status":29,"date":182,"createdAt":183,"updatedAt":184,"_path":185},4,"blog-optimization","Blog Content Optimization","Optimasi Konten Blog","Blog Content Optimisation","Writing and optimizing SEO-driven content across 6 client websites spanning multiple industries in both English and Indonesian, covering articles, copywriting, and UI copy.","Menulis dan mengoptimasi konten berbasis SEO di 6 situs web klien dari berbagai industri dalam bahasa Inggris dan bahasa Indonesia, mencakup penulisan artikel, copywriting, dan copy UI.","Writing and optimising SEO-driven content across 6 client websites spanning multiple industries in both English and Indonesian, covering articles, copywriting, and UI copy.","https://cdn.thismarshal.com/project/1774201984209-blog_content_optimization.webp",[165],"Content SEO & Strategy",[167,168,169,170,171,172,173,174],"Content Strategy","Content Clusters","Link Building","SEO Writing","Organic Growth","bilingual","on-page SEO","Copywriting","Indonesia & Canada",{"live":177},"#",{"Client Website":179,"Languages":180,"Content Type":181},"6 Sites","EN + ID","Articles + Copy","2024-05-20T00:00:00.000Z","2025-12-01T12:04:07.093Z","2026-05-28T17:49:52.951Z","/projects/blog-optimization",{"id":187,"slug":188,"slugId":6,"title":189,"titleId":190,"titleAu":189,"titleSg":189,"description":191,"descriptionId":192,"descriptionAu":193,"descriptionSg":193,"cover":194,"coverId":6,"category":195,"tags":196,"location":204,"links":205,"metrics":207,"status":29,"date":214,"createdAt":215,"updatedAt":216,"_path":217},5,"local-business","Local Business SEO Success","Sukses SEO Bisnis Lokal - Jasa Buat Website Jakarta","At JakWebs, a local web agency based in Jakarta, I served as both SEO specialist and web developer. My scope covered everything from building and maintaining the WordPress website to executing the full SEO strategy that ultimately turned the company website into its main revenue channel. At peak, organic search accounted for 80% of total company revenue.\n\nAlongside internal agency work, I also directly handled SEO and web development projects for 5 to 6 B2B clients across a range of industries, managing each account end to end from site build to organic growth.","Di JakWebs, sebuah agensi web lokal yang berbasis di Jakarta, saya menjabat sebagai pakar SEO dan web developer. Lingkup kerja saya mencakup segalanya mulai dari membangun dan memelihara website WordPress hingga mengeksekusi strategi SEO lengkap yang pada akhirnya mengubah website perusahaan menjadi saluran pendapatan utama. Pada puncaknya, pencarian organik menyumbang 80% dari total pendapatan perusahaan.\n\nSelain pekerjaan agensi internal, saya juga menangani langsung proyek SEO dan web development untuk 5 hingga 6 klien B2B di berbagai industri, mengelola setiap akun dari awal hingga akhir - dari pembuatan situs hingga pertumbuhan organik.","At JakWebs, a local web agency based in Jakarta, I served as both SEO specialist and web developer. My scope covered everything from building and maintaining the WordPress website to executing the full SEO strategy that ultimately turned the company website into its main revenue channel. At peak, organic search accounted for 80% of total company revenue.\n\nAlongside internal agency work, I also directly handled SEO and web development projects for 5 to 6 B2B clients across a range of industries, managing each account end-to-end from site build to organic growth.","https://cdn.thismarshal.com/project/1774125029683-jakwebs_client.jpg",[15,14],[197,198,137,199,53,200,201,202,203],"Local SEO","WordPress","XML Sitemap","web development","wordpress","blogger","wix","Indonesia",{"live":206},"https://jakwebs.com",{"platform":208,"optimization":209,"Revenue from organic":210,"Keyword ranking":211,"Keyword difficulty":212,"B2B clients handled":213},"WordPress, Blogger & Wix","Full technical SEO","80% of total sales","Page 1","44%","5-6 Clients","2024-04-12T00:00:00.000Z","2025-12-01T12:04:07.258Z","2026-05-28T17:49:52.975Z","/projects/local-business",{"id":219,"slug":220,"slugId":6,"title":221,"titleId":222,"titleAu":221,"titleSg":221,"description":223,"descriptionId":224,"descriptionAu":225,"descriptionSg":225,"cover":226,"coverId":6,"category":227,"tags":228,"location":233,"links":234,"metrics":235,"status":29,"date":240,"createdAt":241,"updatedAt":242,"_path":243},3,"healthcare","Healthcare SEO Strategy","Strategi SEO Layanan Kesehatan","Driving patient acquisition for a specialized healthcare clinic through technical SEO, local search optimization, and multi-engine visibility across Google, Bing, and Yandex.","Mendorong akuisisi pasien untuk klinik kesehatan spesialis melalui SEO teknikal, optimasi penelusuran lokal (local SEO), dan visibilitas di berbagai mesin pencari seperti Google, Bing, dan Yandex.","Driving patient acquisition for a specialised healthcare clinic through technical SEO, local search optimisation, and multi-engine visibility across Google, Bing, and Yandex.","https://cdn.thismarshal.com/project/1774120336069-hospital_project.webp",[15],[197,229,230,231,232],"Healthcare Marketing","Webmaster Tools","Medical Keywords","Multi-Engine SEO","Jakarta,Indonesia",{"live":177},{"patients_monthly":236,"ranking":211,"search_engines":237,"keyword_ranking":211,"CTR achieved":238,"Content writers led":239},"15-20 new patients","3 (Google, Bing, Yandex)","8.5%","3 People","2024-03-05T00:00:00.000Z","2025-12-01T12:04:06.930Z","2026-05-28T17:49:52.928Z","/projects/healthcare",[245,260,276,290],{"id":246,"slug":247,"slugId":248,"title":249,"titleId":250,"titleAu":6,"titleSg":6,"description":251,"descriptionId":252,"descriptionAu":6,"descriptionSg":6,"cover":253,"coverId":6,"category":254,"tags":255,"status":29,"date":256,"createdAt":257,"updatedAt":258,"_path":259},34,"shopify-duplicate-schema","duplikat-schema-shopify","Your Review App Just Duplicated Your Shopify Product Schema","App Review Anda Baru Saja Menduplikasi Schema Produk Shopify","Your theme adds Product schema. Your review app adds more. Your SEO app adds a third. Here's how to find and fix duplicate schema before it costs you rich results.","Theme Anda menambahkan Product schema. App review menambahkan lagi. App SEO menambahkan yang ketiga. Cara menemukan dan membenahi duplicate schema sebelum merugikan rich result Anda.","https://cdn.thismarshal.com/project/1784322283541-shopify_duplicate_schema.webp",[15],[76,15],"2026-07-20T15:00:00.000Z","2026-07-17T10:55:51.949Z","2026-08-17T11:59:53.315Z","/blog/shopify-duplicate-schema",{"id":261,"slug":262,"slugId":263,"title":264,"titleId":265,"titleAu":6,"titleSg":6,"description":266,"descriptionId":267,"descriptionAu":6,"descriptionSg":6,"cover":268,"coverId":269,"category":270,"tags":271,"status":29,"date":272,"createdAt":273,"updatedAt":274,"_path":275},29,"shopify-crawl-budget-problem","shopify-crawl-budget","Your Shopify Store Probably Doesn't Have a Crawl Budget Problem","Shopify Anda Kemungkinan Besar Tidak Punya Masalah Crawl Budget","Most Shopify stores worry about crawl budget for no reason. Here's how to tell if you actually have a problem, what causes real crawl waste, and how to fix it.","Kebanyakan toko online Shopify khawatir soal crawl budget tanpa alasan jelas. Cara mengetahui apakah Anda benar-benar punya masalah ini, penyebab crawl waste yang nyata, dan cara membenahinya.","https://cdn.thismarshal.com/project/1784102703601-shopify_crawl_budget.webp","https://cdn.thismarshal.com/project/1784102709936-crawl_budget_shopify.webp",[15],[15,76],"2026-07-17T15:00:00.000Z","2026-07-15T04:25:49.652Z","2026-08-17T11:59:13.361Z","/blog/shopify-crawl-budget-problem",{"id":277,"slug":278,"slugId":278,"title":279,"titleId":280,"titleAu":6,"titleSg":6,"description":281,"descriptionId":282,"descriptionAu":6,"descriptionSg":6,"cover":283,"coverId":6,"category":284,"tags":285,"status":29,"date":286,"createdAt":287,"updatedAt":288,"_path":289},23,"shopify-duplicate-content","Shopify Duplicate Content: What's Actually a Problem and What Isn't","Shopify Duplicate Content: Mana yang Benar-Benar Masalah dan Mana yang Bukan","Shopify duplicate content explained. What Shopify already handles automatically, what still needs fixing, and how to diagnose it in Google Search Console.","Penjelasan duplicate content di Shopify. Apa yang sudah ditangani otomatis, apa yang masih perlu dibenahi, dan cara mendiagnosanya lewat Google Search Console.","https://cdn.thismarshal.com/project/1784065258416-shopify_content_duplicate.webp",[15],[15,76],"2026-07-14T21:00:00.000Z","2026-07-14T20:49:35.119Z","2026-08-17T11:57:06.451Z","/blog/shopify-duplicate-content",{"id":291,"slug":292,"slugId":6,"title":293,"titleId":294,"titleAu":293,"titleSg":293,"description":295,"descriptionId":296,"descriptionAu":295,"descriptionSg":295,"cover":297,"coverId":6,"category":298,"tags":299,"status":29,"date":312,"createdAt":313,"updatedAt":314,"_path":315},17,"technical-seo-specialist-australia","What Is a Technical SEO Specialist and Why Australian Businesses Need One in 2026","Apa Itu Technical SEO Specialist dan Mengapa Bisnis Australia Membutuhkannya di 2026","Looking to hire a technical SEO specialist in Australia? This guide covers the job description, salary benchmarks, and what to expect from a freelancer or contractor.","Sedang mencari jasa technical SEO specialist di Australia? Panduan ini membahas deskripsi pekerjaan, standar gaji, dan apa yang diharapkan dari seorang freelancer atau kontraktor SEO.","https://cdn.thismarshal.com/project/1776022960196-technical_seo_australia__technical_seo_specialist.webp",[15],[300,301,302,303,304,305,306,307,308,309,310,311],"technical seo","seo specialist","technical seo australia","seo salary australia","hire seo specialist","technical seo freelance","senior technical seo","core web vitals","page speed seo","seo job description","remote seo specialist","seo 2026","2026-04-11T00:00:00.000Z","2026-04-11T21:52:24.879Z","2026-05-28T17:49:52.728Z","/blog/technical-seo-specialist-australia"]