Next YTMusic Clone Coding from the Basics (with next.js 14, UI Master)

Learn how to build a beautiful portfolio site using Vite, React, Vue, and Next.js. Perfect for developers looking to improve their practical front-end development skills using multiple frameworks.

React and Three.js in one go! Learn everything from Vectors to GSAP, the basics of interactive web development. Plus, tips and tricks for integrating three examples into a single portfolio!

Through this lecture, students can create a web service similar to Instagram using HTML, CSS, and JS. (Only the front-end is implemented! The back-end server construction will be filmed in a later lecture.)

You can learn HTML and CSS quickly by directly cloning and coding the best shopping mall designs posted on Cafe 24. The course is structured so that you can learn the basic theories of HTML + CSS and complete the shopping mall design through direct cloning and apply what you learned in the theory, and solidify the framework of HTML and CSS.

This course teaches you the latest Next.js v15 App Router while building a practical, Notion-based developer blog together. You’ll also gain various insights, including how to use Cursor AI.

Have you ever had these concerns? I’ve learned React, but I don’t know what to actually build. I want to create a portfolio, but I can’t think of anything besides a Todo app. Map APIs or Public APIs seem difficult, so I haven’t even tried them. I’ve never deployed anything, so it always ends as a “local project.” The code is getting more complex, and I don’t know how to design the architecture. 🎯 Problems this course solves This course isn’t just about showing you how to display a map. ✔ How to connect Public APIs to a real service ✔ How to stably design Map SDKs within a React structure ✔ Marker optimization and reusable InfoWindow structures ✔ State management design using Context ✔ Practical application of Tailwind + SCSS ✔ GitHub organization and Vercel deployment I will teach you how to design with a real service structure, not just "implementing features." 💡 This is not a "just follow along" course Why we use useRef Why you shouldn't create new markers every time Why you need to separate state Why environment variables must be managed separately in production There is a reason for every choice. This course explains those "reasons." 🚀 After taking this course, you will: Complete one map-based portfolio project Gain experience integrating Public APIs Understand the structure of attaching external SDKs to React Gain experience in designing professional-grade project structures Have deployment experience And you’ll be able to say this in an interview: “I personally designed and deployed a map service based on Public APIs.” This one sentence makes a huge difference. 👩‍💻 Recommended for: Those who know basic React syntax but lack project experience Those who want to build a portfolio for employment Those who wanted to try a Map/Public API project Those who want to learn design patterns close to real-world practice 🔥 The Goal of this Course This course is not about “how to make a map,” but about learning the “mindset of designing a service.”

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!

Throw away those simple services you can make with vibe coding in just 10 minutes! You can learn 'real' practical vibe coding. Let's create advanced services at the level of actual services according to planning and design with Cursor AI NCOP. No Code, Only Prompt

[Tailwind CSS Practical Portfolio Publishing] is a process of creating more than 26 different practical examples using Tailwind CSS. As you quickly create a variety of practical examples, we will explain the essential theories. This lecture was created with a focus on Tailwind CSS styling created by developers and publishers.

"Why did the AI write this code?" or "Why can't it remember what I just said?" The frustration you encounter when using AI tools like Claude Code stems from not knowing how the tool actually works. This course flings open that black box. Over 25 lessons, we will build our own Coding Agent from scratch that functions exactly like real-world professional tools—giving the LLM 'eyes' to see files (Read), 'hands' to fix code (Edit), and 'feet' to execute commands (Bash). This isn't just about learning how to use a library. You will gain hands-on experience by implementing code to understand how AI perceives project structures, why it loses its memory during long conversations, and how to solve those issues technically (Sliding Window, Summary). Through this process, you will evolve from being a mere 'user' of AI tools to an 'AI provider' who understands the underlying principles and can customize and evaluate tools to fit your specific needs.

🔥 Firebase User Authentication Completed with just HTML + Tailwind CSS + Pure JavaScript! From social login to phone and location verification, easily and quickly build an account system without a complex backend.

In this course, you will be able to create a Reddit website from scratch, step by step.

Completing an integration project between an API server built with Spring Boot (ver 3.4.x) and React 19 (with TypeScript)! Applying front-end to a back-end portfolio! A course written for working professionals (not a beginner-level course).

A current startup CTO will share vibe coding knowledge gained through actual services and various outsourcing projects.

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.

Practice REST API and GraphQL while creating a simple SNS service based on React. We introduce how to easily and simply create a backend environment for frontend development.

The goal is to acquire basic knowledge of React Native for mobile app front-end development. This course is designed to enable non-experts to easily develop native mobile apps by utilizing languages/APIs with low entry barriers.

This is a practical course where you will directly create a timer app using React, Electron, and Zustand, and even deploy it to cross-platforms (Windows, macOS, Linux). Starting with familiar React web development, you can learn the entire flow of desktop app development, including global state management via Zustand and final GUI deployment!

No coding skills? No problem! Turn your ideas into real profit in just 4 weeks. Use AI and the latest tools to build a website and an app simultaneously and launch your service right away.

Complete everything from design to TDD and CI with Claude Code. Taking a single feature from one line of spec all the way to main merge.