Project Overview: Front Geek News Content Automation

• Project Name: Front Geek News Content Automation

• Client / Company: Independent / Personal Project

• Project Type: Autonomous Hobby / Experimental Systems

• Role: Fullstack & Automation Engineer

📌 Project Description

Front Geek Intelligence is an automated, AI-driven data aggregation and content curation platform built to filter out the noise of the tech industry. The core engine functions as a continuous, 24/7 live scraping and processing pipeline that extracts global technology, gaming, AI, and programming updates, normalizes raw data feeds, processes language translation and creative localization via multi-LLM AI agents, and instantly deploys ready-to-read articles onto a high-performance web dashboard.

💻 Tech Stack

• Framework: Next.js (React)

• Database & ORM: Supabase & Prisma

• Data Validation: Zod

• Form Management: React Hook Form

• Automation Engine: n8n Workflow Automation

• Development Methodology: AI-Accelerated / Vibe Coding

🛠️ Key Contributions & Responsibilities

As the sole architect of the platform, I developed both the background ingestion worker pipelines and the client-facing distribution hub:

1. 24/7 Autonomous Ingestion & Multi-LLM Orchestration

• Live Web Scraping Engine: Configured automated n8n workflows that run continuously to monitor and extract structured web data and raw HTML contents from high-authority global news domains.

• Advanced Language Processing Pipeline: Integrated complex AI Agent nodes within n8n utilizing distributed open-source large language models (such as Mistral and Groq setups) to handle programmatic content parsing, automated rewrite structuring, and localized Indonesian translation refinement.

• Intelligent Routing & Telemetry: Engineered complex routing condition loops to filter articles by specific categorical matrices (e.g., AI, Technology, Gaming, Programming, Sport, Hobby & Lifestyle) while setting up automated chat webhooks to provide real-time metrics on structural draft counts and publishing synchronizations.

2. High-Fidelity Frontend & Interactive Dashboard

• Cyber-Terminal Inspired UI: Crafted a responsive, ultra-clean dark mode terminal web interface under the "Front Geek Intelligence" visual design language to ensure maximum reading immersion across mobile and desktop devices.

• Dynamic Showcase & Feed Grid: Developed fluid frontend listing layouts characterized by custom operational badges (like Newest Transmission, Weekly High Traffic Signals, and System Live tickers) for live content indexing.

• Inline Editorial Management: Built client-side content mutation endpoints backed by React Hook Form to allow for seamless manually-driven overrides, text edits, or configuration updates to any automated draft safely.

3. Type-Safe Data Layer & Infrastructure

• Ironclad Data Validation Contracts: Implemented runtime payload defense layers using Zod schemas to ensure automated background inserts matching strict typography, time string generation parameters, and image URL formatting constraints.

• Optimized Persistence Layer: Utilized Prisma ORM linked to a Supabase PostgreSQL instance to handle simultaneous concurrent read/write locks generated from rapid bulk ingestions across thousands of automated articles.

🚀 Key Highlights & Engineering Impact

• Zero-Maintenance Publishing Pipeline: Replaced traditional manual content writing workflows entirely with a system that auto-generates, auto-translates, and self-publishes fully formed articles completely hands-free.

• Sub-Second Client Delivery: Leveraged the file-based rendering power of Next.js to display dense article arrays, enabling instant client search query processing and fluid category toggling.

• Cost-Efficient Distributed AI Routing: Optimized API runtime constraints by structuring specialized conditional node layers, evaluating token outputs seamlessly before execution loops update the live production environment.