Next.Js Full Stack Project Tutorial - Build Full Stack AI Motion Graphic Video Generator using NextJs, React, Factory.ai, Arcjet, Remotion

Master Next.js & React Full Stack Development: Dive into AI-Powered App Creation with TubeGuruji – Build, Deploy, Conquer!

5.0 (2)

18 learners

What you'll learn

Learn to build and deploy full-stack applications using Next.js, React, and Tailwind CSS.
Master the integration of various APIs such as Google Maps, Clerk, and Firebase within Next.js apps.
Develop proficiency in using NextAuth for authentication in full-stack applications.
Gain skills in integrating AI technologies to enhance full-stack application functionalities.

This course includes

346 hours of video
Certificate of completion
Access on mobile and TV

Summary

Keywords

ai motion graphics tutorial motion graphics ai motion graphics Build Full Stack AI Motion Graphic Video Graphic Video Generator AI Motion Graphic Video Generator Full Stack AI Motion Graphic Video Generator Build Full Stack AI motion graphics tutorial how to install visual studio code NextJs AI Project AI NextJs Project

Full Transcript

Build a Full Stack AI Motion Graphic Video Generator using Next.js, React, Factory.ai, and Arcjet in this step-by-step tutorial. Learn how to create an AI-powered app that converts prompts into stunning motion graphic videos with a modern full stack workflow. 🔧 Tools & Services Used 🔐 Clerk (Authentication) 👉 https://go.clerk.com/DtmUbnd 🤖 Factory AI (Get Free Credits) 👉 https://dcmk.short.gy/factor-ai-free (Get FREE Credit) 🛡️ Arcjet (Security & Rate Limiting) 👉 https://dcmk.short.gy/arcjet-t 📄 Eraser Documentation 👉 https://dcmk.short.gy/ai-motion-video-doc 💻 Try Demo App - https://dcmk.short.gy/motion-graphic-video-demo ********* ⭐ Try My App – TaskyBear 🐻 AI Todo Planner & Habit Tracker App Organize tasks, track habits, and boost productivity with AI. 📱 Android App Link: https://dcmk.short.gy/taskybear-android 📱 iOS App Link: https://dcmk.short.gy/taskybear-ios ********** 🚀 Join TubeGuruji Pro : https://www.tubeguruji.com Get access to 100+ full-stack app projects and 50+ AI app tutorials with real-world use cases. 📦 Resources 🎁 Free Resources – https://dcmk.short.gy/ai-motion-video-resources 🎨 Free AI Agents Credits – https://dcmk.short.gy/factor-ai-free 💻 Source Code – https://dcmk.short.gy/motion-graphic-video-source-code 📢 Stay Connected 💻 Join our Discord Community: https://discord.gg/DJUpW5bMtz 🖼️ Follow us on Instagram: https://www.instagram.com/tubeguruji 🔗 Follow us on X (Twitter): https://x.com/tubeguruji 📱 Join our WhatsApp Channel: https://whatsapp.com/channel/0029VaDBs3aEAKWLFDgKY93n 💼 Business Inquiries: [email protected] #Nextjs #Reactjs #AI #FactoryAI #Arcjet #MotionGraphics #AIVideoGenerator #FullStackDevelopment #WebDevelopment #JavaScript #SaaS #techtutorial Join this channel to get access to perks: https://www.youtube.com/channel/UC33Tc4FCgd_to314_b2hNTg/join ---------- CHAPTERS ------------- 00:00:00 Introduction 00:11:31 Project Setup 00:22:07 Setup Factory.ai AI Agent 00:29:25 App Workflow 00:31:14 Landing Screen 00:40:33 Prisma DB Setup 00:46:57 Authentication 00:56:22 Create New Video Project 01:02:01 Project Video Page Layout 01:07:10 Setup Arcjet 01:14:19 Generate Video (Logic Implementation) 01:25:50 Secure and Protect App & endpoints using Arcjet 01:30:51 Play Generated Video using Remotion 01:38:39 Theme Settings 01:42:55 Update Video using AI Agent Chat 01:48:26 User Settings 01:55:15 Render Video to Download 02:19:22 Deploy App

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

Related Courses

Direção de Arte no Cinema e Jogos: Fundamentos Essenciais

Transforme sua criatividade em carreira: descubra os segredos da Direção de Arte no cinema, jogos e design gráfico com especialistas e aprenda a criar mundos visuais incríveis. Inscreva-se agora e revolucione sua visão artística!

⭐ 4.0

29 ratings

0 min