인프런 - 라이프타임 커리어 플랫폼

This course goes beyond simple DOM manipulation to provide an in-depth look at how to dynamically construct and respond to web UIs within real-world user interactions. It is designed to help you master common professional challenges by directly implementing the essence of the event system, bubbling and capturing, event delegation, real-time UX feedback, and performance optimization using throttle & debounce. Based on an understanding of the DOM tree structure, you will develop the ability to flexibly connect event flows with state changes.

No matter how much you study React, Next.js, or Vue, if the code feels abstract and the structure isn't clearly understood, the root cause might be a lack of understanding of DOM. DOM is the foundation of all frontend frameworks and the entity that connects the structure and behavior of web pages. This lecture goes beyond simple selectors or manipulation methods, teaching step-by-step from the very beginning how HTML transforms into DOM objects and how to select, traverse, and manipulate this structure. It is the Part 1 introductory lecture of 'Complete DOM Mastery'. HTML tags are just structure, and JavaScript is just behavior, but DOM is the core that connects the two. If you clearly understand this connection, you'll be able to precisely grasp the true structure and flow within any framework you use.

Let's learn together the official React documentation that has been renewed in 2023.

🔥 Build a customized platform for Hanja learning! Leverage Google Gemini AI and Firestore to directly implement your own Hanja vocabulary book, stroke order animation, and even handwriting recognition!

Create a web page that tests your development type! MBIT (My Best IT Personalities), not MBTI! You can learn the overall process of web development by creating your own 'MBIT Test Page'. (Uses Django 3.1 version.)

"Next.js Master Class: Part 3 - Completing Real-World Architecture" goes beyond tutorial-level projects that only run locally; it is a guide to designing "real production" architectures capable of handling massive traffic. It covers all the core technologies used in the industry, from flawless state synchronization combining TanStack Query and Zustand, to Turbopack-based bundle optimization under 100KB, advanced SEO injection, and building ironclad full-stack security networks using proxies and JWT sessions. I strongly recommend this course to those who want to overcome tedious hydration errors and CORS barriers on their own, moving beyond being a simple coder to becoming a "Senior Architect" who commands the entire frontend system.

This is a full-stack hands-on course where you will implement a ChatGPT clone from scratch. From Spring Boot server to React frontend | Neo + Essential This is not just a course where you simply follow along with the code; it guides you through actual service deployment so you can build a high-quality AI chatbot service.

Learn Springboot + ReactNative RestAPI Board Creation Faster Than Anyone Develop a CRUD server with Springboot and create your own board with ReactNative!!

This course is not about "Let's build something amazing with the latest technology," but rather the most practical web development beginner course that makes you feel "You can build it yourself with just a little knowledge." We'll create the basic structure with HTML and JavaScript, exchange data using Node.js and SQLite, and complete a simple web page with Next.js. We minimize complex configurations and difficult theories, and focus on getting a hands-on feel for web development flow by writing code that actually works. This course centers on 'hands-on experience' rather than just 'learning.' If you've touched code even a little bit, anyone can follow along and feel the satisfaction of completion.

Apps play an important role in our daily lives. However, the process of developing and maintaining native apps is long and complex, and can be quite costly. This course introduces Progressive Web Apps (PWA), an alternative that has been gaining attention as of September 2024. PWA combines the advantages of web technology and native apps, enabling faster and more efficient app development and maintenance. Through hands-on practice, you'll learn the concepts, advantages, and implementation methods of PWA step by step, and develop the skills to apply them directly in real-world scenarios.

Traditional React development and Next.js development are completely different approaches. This course penetrates the core of the latest Next.js 16 and teaches you the 'real' Next.js way of development. Experience how to achieve both performance and efficiency, from job portfolio projects to real-world projects. Let's develop the Next.js way! The course is structured to help you learn by doing, creating actual examples to understand 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 vibe as quickly as possible, the lectures are conducted using JavaScript. However, each lecture's examples are additionally provided as course materials created in TypeScript. December 18, 2025 - Updated to Next.js 16

We solve the fundamental problem of losing control amidst AI-generated fragmented code and the complex React ecosystem by opening the hood and engineeringly analyzing the internal workings of core React libraries such as Zustand, TanStack Query, React Hook Form, Zod, and the React Compiler. By moving beyond simple tool usage and mastering how to directly manipulate the performance and data flow of the React engine, you will build the solid 'enterprise architecture design muscle' necessary to respond immediately to any crisis.

This course is a full-stack level frontend project course that focuses on implementing Notion from start to finish using Vanilla JavaScript, going beyond simple UI cloning to deeply understand the internal operating principles. You'll implement all the core features of a real note-taking app using vanilla JS, including sidebar tree, nested document creation, auto-save, routing, trash, favorites, search modal, settings modal, theme switching, Export/Import, keyboard shortcuts, responsive layout, drag resize, and more. The goal is to solidly learn browser standard behaviors (event bubbling, DOM tree, local storage, Blob, FileReader, hash routing, etc.) that you must know before frameworks like React and Vue, so you can completely understand "why it works this way" and build the skills to debug effectively.

Through this course, students will broadly learn the basics and advanced concepts of JavaScript, from setting up the development environment to variables, conditional statements, functions, objects, and arrays. Through thorough review with practice exercises and quizzes, they will be able to develop problem-solving skills that can be immediately applied to web and mobile development practices.

"Becoming a Developer Who Excels at React" has been published. This book provides a solid foundation by systematically guiding you from the basic principles of the web needed before learning React to the latest React hooks. Through over 40 diverse hands-on projects and abundant practical examples, you can apply theory directly to real-world situations and develop problem-solving skills. Additionally, it helps you grow into a developer capable of building high-quality React applications by learning essential modern web development technologies such as Redux Toolkit, Zustand, and Firebase.

New to React? You need to think about how to learn React's fundamental concepts solidly yet quickly. Start with Next.js and JavaScript with minimal knowledge. Let's develop by selecting only the essential examples needed for real-world development. The Todo example is so important that you should develop it twice. Once focusing on components, and then focusing on routing that handles browser paths! Use Zustand for login! You can handle global state with a really small amount of code.

This course is designed for developers who already have experience with programming languages (such as Java, Python, Swift, Kotlin, etc.) to quickly master JavaScript in just one hour. In an era of coding with AI, human developers must still supervise AI-generated code. This course is intended to help you rapidly build the essential knowledge required for that supervision.