Vibe Coding: Building a Voice Memo App with Next.js + FastAPI + Faster-Whisper

This course is not just simple clone coding or a basic tutorial. By implementing an LMS (Learning Management System) platform like Inflearn from start to finish at an MVP level, it provides an all-in-one solution that freelancers, solo developers, and early-stage startup members can immediately apply in real-world projects. We cover the entire tech stack used in actual production environments at once: Next.js, Flutter, Supabase, Firebase (FCM), AWS, Vercel, Xcode, Android Studio, ElevenLabs, and Toss Payments. You'll experience the complete process of simultaneously developing web and mobile apps, including social login, automatic multilingual dubbing, HLS streaming-based lecture playback, payment integration, and deployment to the App Store and Play Store. This course focuses on the important workflows, configurations, and deployment processes that matter in real-world development, rather than detailed line-by-line coding. Therefore, it's suitable for developers looking to become independent freelancers, teams that need to quickly validate MVPs at startups, and junior developers who want to experience the full scope of real-world development.

Complete a company introduction landing page with hands-on vibe coding. Using Cursor AI + Next.js + TypeScript + TailwindCSS + shadcn/ui + MCP stack, proceed from design to deployment all at once. The key is "fast implementation + SEO foundation that performs well in search engines." 🏁 Course Objectives Landing creation → Performance optimization → SEO implementation → Deployment/Indexing Real-time coding (vibe coding) to immediately check completed sections Direct experience including search indexing 🛠️ Practice Stack Cursor AI, Next.js(App Router), TypeScript TailwindCSS, shadcn/ui, MCP workflow 🔍 SEO Practice Apply SEO optimization MD files provided by instructor Metadata, OG/Twitter cards, robots/sitemap, structured data (JSON-LD) Optional multilingual routing implementation 🎯 Final Product Responsive company introduction landing + contact form Target Lighthouse 95+ Vercel deployment followed by Search Console registration and indexing request 📚 What You'll Learn from This Course How to quickly compose hero/trust/features/FAQ sections Clean UI composition with shadcn/ui Form validation and basic conversion tracking point design Boosting SEO scores with structured data + multilingual routing Understanding the indexing process through Search Console after deployment 💡 Industry Insights (Course Bonus) Beyond just code implementation, we'll briefly cover marketing and exposure methods actually used in the real market. Realistic pricing ranges for advertising, blog posting, and comment work How outsourcing and contracting companies actually proceed with SEO and exposure work Cost/efficiency differences between direct developer participation and outsourcing Through this section, you can develop a sense of how technology is actually utilized in real industry work and what cost structures drive it, beyond just the technical aspects. One-Line Summary Following the flow of "implementation → optimization → deployment → indexing," learn the web creation process that connects to actual search exposure and real industry market structures.

This is an introductory course to the front end using Next.js and Tailwind CSS. It is designed to complete static deployment without a backend, so even beginners can experience the satisfaction of completion.

With v0, cursor AI, and various LLMs, from PRD to AI product recommendations! Complete your Next.js shopping mall through a practical project.

A full course of hands-on Next.js! Complete a real-world project with the latest technologies such as GraphQL, Redis, RabbitMQ, Prisma, TailwindCSS, Docker Compose, Cypress, Prometheus, and Grafana, and experience both the App Router and Page Router.

Learn how to build a real-time fire detection system using Next.js, YOLOv11, and FastAPI.

A full course on Next.js you can sink your teeth into! Complete a real-world project using the latest technologies such as GraphQL, Redis, RabbitMQ, Prisma, TailwindCSS, Docker Compose, Cypress, Prometheus, and Grafana, and experience both the App Router and Page Router.

We will create an SNS service similar to Twitter (X.com) using the React19 & Next15 & ReactQuery5 & Next Auth5 & MSW2 & socket.io4 & zustand stack. Finally, we will add SSR for search engine optimization!

Building React User Registration, Login + Board with Vibe Coding (React + FastAPI) is a hands-on course where you directly complete a full-stack web application using AI prompts. OpenAI Codex and Claude Code In this course, you'll connect a React (TypeScript) frontend with a FastAPI backend to implement: User registration & login functionality Board CRUD (create, read, update, delete) JWT authentication and authorization handling all within a single project. Particularly, rather than just stopping at writing code, 👉 AI prompt code generation → execution and modification → testing → expansion Through this "Vibe Coding" learning approach, you can experience a new development flow of working together with AI. After completing the course, you'll be able to directly finish your own "member-only board service," and additionally challenge yourself with extended features like comments, likes, and image uploads.

No more waiting on the dev team, I'll build it myself! This course helps practical staff (e.g., in planning, marketing, sales) to directly implement core web service functions using AI tools, without developer assistance.

Upon completing and applying these lectures, you can create your own sites and apps. This introductory VibeCoding lecture uses Cursor AI to help you naturally learn coding flow by creating a Web site group chat for your family. Without an App developer account or MacBook, anyone can easily follow along in a Windows environment, even without dev knowledge, and learn to deploy it as a real website.

This is a course where you'll learn the latest Next.js v15 App Router while building a practical developer blog based on Notion together. Additionally, you can gain various insights including how to utilize Cursor AI.

This is an introductory course to the front end using Next.js and Tailwind CSS. It is designed to complete static deployment without a backend, so even beginners can experience the satisfaction of completion.

The Next.js framework that you must know when starting React. Easy explanations from the perspective of beginners and in-depth understanding of the operating principles that satisfy practitioners. Solve Next.js in one go.

This lecture provides a rough overview of backend basics with FastAPI, along with deploying to AWS using React.js, allowing you to quickly experience the actual deployment process.

Traditional React development methods and development using Next.js are completely different. This course penetrates the core of the latest Next.js 15 and teaches you the 'real' Next.js development approach. Experience how to achieve both performance and efficiency, from job portfolio projects to real-world projects. Let's develop the Next.js way! This course is structured so you can learn through hands-on experience by creating actual examples of how to apply Next.js features. You'll learn faster through actual code rather than theory, focusing on server components and covering server actions and caching strategies. Since the goal of the course is to catch up with the Next.js approach as quickly as possible, the lectures themselves are conducted using JavaScript. However, examples from each lecture created with TypeScript are additionally provided as course materials.

🔥 This is a practical full-stack course that implements the knowledge sharer functionality exactly as is, from course registration to video upload. Using Next.js 15 and NestJS, you will build along the actual Inflearn flow, covering course creation, curriculum setup, thumbnail and video upload, and detailed introduction writing. You will gain practical, real-world experience, including Prisma modeling, JWT authentication, S3 + CloudFront upload, and Swagger API design.

This course will help you develop mobile apps that can be serviced on Android and iOS using web development.

The complete guide to building modern backend APIs with FastAPI! 🚀 This course systematically covers everything from FastAPI basics, Pydantic data validation, DB integration using SQLAlchemy, to Alembic migrations. Through a practical ToDo project, implement JWT authentication/authorization security, and experience asynchronous processing and performance optimization. Finally, through Docker containerization and AWS deployment practice, with just this one course, you can grow into a backend developer ready for immediate practical deployment!

In this 24-hour tutorial, you will learn how to build your own YouTube clone. We will cover advanced topics such as Next 15 and React 19 (including tRPC), prefetching in Server Components, utilizing Suspense in Client Components, video processing, background jobs, and AI features.

No more toy projects! We're revealing all the secrets to building a secure authentication system with JWT and Redis, actually used by developers in the field.

Firebase's SQL version! You can master the basics of Next.js full-stack development through Supabase!

If I were to create a delivery app from scratch, I would do it like this. This course covers practical fastapi, mongodb, modeling and index design, redis caching, and load testing.

Don't know coding? OK! Turn your ideas into real revenue in just 4 weeks. Using AI and the latest tools, create websites and apps simultaneously and connect them directly to services.

If you want to understand TypeScript properly, you should read the official documentation at least once, right? This lecture will convey only the important parts of the documentation in an easy-to-understand manner, and also teach you the content you need in practice!

AI is no longer a choice but a matter of survival. Reduce development time from 3 days to 30 minutes, delegate repetitive tasks to AI, and focus on solving more important problems. With AI-native development methods that you can apply immediately in real work rather than just theory, we'll show you the definitive way to be recognized as "the developer who's good with AI" at your company.