آموزش وایب کدینگ (Vibe Coding): ساخت اپلیکیشن‌های هوش مصنوعی با OpenAI، Supabase و n8n - آخرین آپدیت

سرفصل ها و درس ها

مقدمه و معرفی دوره Introduction & About the Course

• چرا این دوره اهمیت دارد - نگاه کلی Why this Course Matters - The Big Picture

• دمو - از ایده تا واقعیت - مشاهده دموی وب‌اپلیکیشنی که خواهید ساخت DEMO - From Idea to Reality - Watch the Demo of the Web app You'll Build

• آنچه خواهید آموخت What You'll Learn

• این دوره برای چه کسانی است Who Is This course For

منابع دوره و فایل‌های دانلودی Course Resources and Downloads

• دانلود تمامی منابع دوره Download all Course Resources

درک مفاهیم پایه ایجنت‌ها (Agents) Understanding the Basics of Agents

• ایجنت‌ها چیستند؟ What are Agents

• جریان‌های کاری ایجنتی - معماری و تفاوت ایجنت‌ها با ورک‌فلوها Agentic Workflows - Architecture & Agents vs Workflows

• آنچه خواهیم ساخت What We'll Build

• ابزارهای مورد نیاز شما Tools You'll Need

ساخت جریان کاری ایجنتی - آشنایی با N8N Agent Building the Agentic Workflow - Introduction to N8N Agent

• مرور کلی جریان کاری کامل N8N Full N8N Workflow - Overview

• تمرین عملی: N8N - راه‌اندازی نود Webhook Hands-on: N8N - Setting up a Webhook Node

• Vibecoding - مقدمه و نقشه راه ساخت وب‌اپلیکیشن نهایی Vibecoding - Introduction - The Roadmap to Building our Final Web App

• تمرین عملی: آشنایی با ابزار Vibecoding انتخابی - تست Webhook Hands-on: Introduction to the Vibecoding Tool of Choice - Testing our Webhook

• تمرین عملی: افزودن نودهای Switch و File Extractor و تست آن‌ها Hands-on: Adding a Switch and a File Extractor Nodes & Testing

• تمرین عملی: تغییر نام فایل باینری در کد - عیب‌یابی با کدنویسی Hands-on: Changing the Binary File name in Code - Troubleshooting with Code

• تمرین عملی: افزودن داده‌های سفارشی به Webhook - تنظیم UserId Hands-on: Adding Custom data to the Webhook - Setting up the UserId

• کدهای مربوط به جلسه آینده Code for the Next Lecture

• تمرین عملی: نود Code - استخراج و ترکیب داده‌ها - توضیح کد Hands-on: Code node - Extracting and Combining Data - Code Explanation

• تمرین عملی: دریافت UserId - عیب‌یابی جریان کاری Hands-on: Pulling the UserId - Troubleshooting our Workflow

• دوره فشرده RAG (بازیابی تقویت‌شده تولید) RAG - Crash Course

• دیتابیس Supabase - مرور کلی Supabase Database - Overview

• بررسی عمیق دیتابیس‌های برداری - تفاوت برداری و رابطه‌ای Vector Databases Deep Dive - Vectors vs Relational Databases

• بررسی عمیق Embeddingها و Vectorها Embeddings and Vectors - Deep Dive

راه‌اندازی دیتابیس Supabase و یکپارچه‌سازی‌ها Supabase Database Setup and Integrations

• راه‌اندازی حساب کاربری Supabase Supabase Account Setup

• تمرین عملی: تنظیم Supabase در N8N و ایجاد جدول در Supabase Hands-on: Setting up Supabase in N8N and Supabase Table Creation

• تمرین عملی: ذخیره تکه‌های متن (Chunks) در Vector Store - جدول اسناد Hands-on: Saving Chunks of text to the Vector Store - Documents Table

• تنظیم Chat AI Agent و حافظه چت Postgres در Supabase برای N8N Agent Setup Chat AI Agent and Supabase Postgres Chat Memory for the N8N Agent

• راه‌اندازی سیستم RAG - افزودن جستجوی معنایی و بازیابی اسناد واقعی Setting up the RAG System - Adding Semantic Search and Retrieving real Docs

احراز هویت Supabase - پیاده‌سازی سیستم ورود کاربران با Supabase Supabase Authentication - Implementing User Authentication with Supabase

• احراز هویت Supabase - مرور کامل Supabase Authentication - Full Overview

• راه‌اندازی احراز هویت Supabase با Vibecoding - ورود کاربران - فرانت‌اند Set up Supabase Authentication using Vibecoding - Log in Users - Frontend

• استخراج UserId واقعی از کاربر احراز شده و افزودن به متادیتای دیتابیس Extracting the Real UserId from Authenticated User & Adding to DB Metadata

• ایجاد رابط کاربری چت و Webhook چت در N8N - تست چت از طریق Webhook Creating a Chat User Interface and a N8N chat Webhook - Testing Chat via Webhook

• تست چت‌بات با کاربران مختلف - تنظیم فیلترینگ دیتابیس Supabase Testing the Chatbot with Different Users - Setting up Supabase DB Filtering

جریان کاری ترنسکریپت ویدیوهای یوتیوب - راه‌اندازی کامل The Youtube Video Transcript Workflow - Full Setup

• مرور کلی جریان کاری ترنسکریپت ویدیوهای یوتیوب Youtube Video Transcript Workflow Overview

• دریافت حساب RapidAPI و تست API ترنسکریپت یوتیوب Getting the RapidAPI Account and Testing a Youtube Transcript API

• تنظیم RapidAPI - API ترنسکریپت یوتیوب و جریان کاری Setting up RapidAPI - Youtube Transcript API and Workflow

• تست Webhook و دریافت ترنسکریپت Testing the Webhook and Getting a Transcript

• افزودن نود IF برای بررسی وجود ترنسکریپت Adding an IF Node to check for the Transcript

• ذخیره ترنسکریپت‌ها در Supabase و ایجاد جدول ترنسکریپت: ذخیره Embeddingها Saving Transcripts to Supabase and Creating the Transcript Table: Saving Embeds

• تست نود چت داخلی برای گفتگو با اسناد ترنسکریپت یوتیوب - دیباگ Testing the Internal Chat Node to Chat with Youtube Transcript Documents - Debug

• تست چت با ترنسکریپت آپلود شده در فرانت‌اند Testing Chatting with the Uploaded Transcript in the Frontend

ساخت کامل وب‌اپلیکیشن با استفاده از Vibecoding - طراحی فرانت‌اند Building out the Whole Web App Leveraging Vibecoding - Building the Frontend

• مرور کلی Vibecoding Vibecoding Overview

• فعال‌سازی URLهای Webhook محیط Production و تست اپلیکیشن Activating the Production Webhook URLs and Testing the App

• به‌روزرسانی ظاهر اپلیکیشن و سیستم ناوبری (Navigation) Updating the Look of the Application and Navigation

• نمایش لیست ترنسکریپت‌های ذخیره شده و تامنیل ویدیوهای یوتیوب Showing a List of Saved Transcripts and Youtube Video Thumbnails

• سفارشی‌سازی رابط کاربری ورود و ایجاد حساب کاربری Customizing the Login and Create Account User Interfaces

یکپارچه‌سازی Stripe برای پرداخت‌ها و استقرار (Deployment) Integrating Stripe for Payments and Deployment

• Stripe و پرداخت - معماری پلن‌های رایگان و حرفه‌ای Stripe and Payment - Free and Pro Tiers Architecture

• راه‌اندازی موتور محدودیت استفاده کاربر و تست آن Setting up the User Usage Limit Engine and Testing It

• تنظیم حساب Stripe - محیط Sandbox برای تست Setting up Your Stripe Account - Sandbox for Testing

• راه‌اندازی پرداخت Stripe - فرآیند کامل Setting up Stripe Payment - The Full Process

• استقرار اپلیکیشن - فاز اول Deploying our App - First Phase

• استقرار و عیب‌یابی صفحه موفقیت و تغییر مسیر URL Deploying and Debugging the Sucess Page and URL Redirection

• انتقال به حالت Live در Stripe - راهنمای کامل Switching to Live Stripe - Full Guide

جمع‌بندی و گام‌های بعدی Wrap up and Next Steps

• جمع‌بندی نهایی Wrap up