К содержимому
learnspaceYOUR NEXT CHAPTER
ПРОСТРАНСТВО ОБУЧЕНИЯ
ГлавнаяКаталог курсовМоё обучениеCoursera

Знания без границ

Учитесь у лучших университетов и компаний мира.

Открыть Coursera
Интеграция
Пространство университета
Моё пространствоСтраница курса
↵
ЯЛичный кабинетСтудент
© 2026 LearnSpaceКаждый день — возможность узнать больше.Помощь
Building Interactive Web Applications with JavaScript · LearnSpace
Назад в каталог
courseraПрограммирование

Building Interactive Web Applications with JavaScript

Курс от University of Michigan
Средний≈ 42.2 чАнглийский
О курсеНавыкиПрограммаПреподаватели

О курсе

Static webpages limit your ability to engage your users on a deeper level. In "Building Interactive Web Applications," you’ll elevate your engineering skills by learning to build highly responsive, dynamic web applications. Designed for developers who are comfortable with basic HTML, CSS, and introductory programming, this course emphasizes dynamic user interactions, asynchronous operations, and the architectural patterns that power modern web applications. Through hands-on exercises and examples, you’ll learn how to write interactive JavaScript code, manipulate the Document Object Model (DOM), handle events, and work with asynchronous data using Promises. You’ll also explore how JavaScript is used to build responsive user interfaces, animations, and custom visualizations using technologies like Canvas and SVG. By the end of the course, you’ll be equipped to build richer, more interactive web experiences and be prepared for more advanced front-end development. This is the second course in a four-part series, “Practical JavaScript: From Scratch to React,” that provides you with hands-on experience in creating seamless front- and back-end applications.

Навыки, которые вы освоите

JavascriptAnimationsEvent-Driven ProgrammingEvent MonitoringUser Interface (UI)Application Programming Interface (API)Front-End Web DevelopmentFrontend PerformanceAnimation and Game DesignJSONWeb DevelopmentDebuggingWeb ApplicationsWeb Development ToolsHypertext Markup Language (HTML)Responsive Web DesignComputer ProgrammingCascading Style Sheets (CSS)Visualization (Computer Graphics)

Программа курса

4 модулей · 141 учебных материалов

01Manipulating the DOM (Document Object Model)39 материалов

Lesson 1: Welcome!

Introduction to the Course and SeriesВидеоSyllabusЧтениеHelp Us Learn About You!ЧтениеLearning Programming in the Age of Generative AI Видео

Учитесь у экспертов

Steve Oney

Associate Professor

Building Interactive Web Applications with JavaScript
В каталоге вашей программы

Инвестируйте в себя

Новые знания — в удобное для вас время.

Начать на Coursera

Обучение откроется на Coursera
в новой вкладке

Обучение на Coursera

≈ 42.2 ч

4 модулей

Язык: Английский

Часть программы вашего университета
Submitting AssignmentsВидео
Working on the AssignmentsЧтение
Practice and Learn: Success Strategies for Practical JavaScriptЧтение
Series Learning RoadmapЧтение

Lesson 2: Accessing the DOM from JavaScript

Introduction: Accessing the DOM from JavaScriptВидеоWhat Is the DOM?ВидеоReading: What Is the DOM?ЛабораторнаяSelecting DOM Elements from JavaScriptВидеоReading: Selecting DOM Elements from JavaScriptЛабораторнаяWorking with Element ObjectsВидеоReading: Working with Element ObjectsЛабораторнаяLet's Build: Picking FavoritesВидеоPractice: Accessing the DOM from JavaScriptПрограммированиеConclusion: Accessing the DOM from JavaScriptВидео

Lesson 3: Modifying the Page

Introduction: Modifying the PageВидеоChanging Text and HTML ContentВидеоReading: Changing Text and HTML ContentЛабораторнаяModifying ClassesВидеоReading: Modifying ClassesЛабораторнаяChanging AttributesВидеоReading: Changing AttributesЛабораторнаяWorking with InputsВидеоReading: Working with InputsЛабораторнаяLet's Build: Guessing GameВидеоPractice: Modifying the PageПрограммированиеConclusion: Modifying the PageВидео

Lesson 4: Creating and Removing Elements

Introduction: Creating and Removing ElementsВидеоCreating and Adding ElementsВидеоReading: Creating and Adding ElementsЛабораторнаяRemoving ElementsВидеоReading: Removing ElementsЛабораторнаяLet's Build: A Todo ListВидеоPractice: Creating and Removing ElementsПрограммированиеModule 1 Graded AssignmentПрограммированиеConclusion: Creating and Removing ElementsВидео
02Building Interactive Applications40 материалов

Lesson 1: Introduction to Events and Callbacks

Introduction: Events and CallbacksВидеоWhat Is an Event?ВидеоReading: What Is an Event?ЛабораторнаяListening to EventsВидеоReading: Listening to EventsЛабораторнаяCallback FunctionsВидеоReading: Callback FunctionsЛабораторнаяCommon Event TypesВидеоReading: Common Event TypesЛабораторнаяEvent ObjectsВидеоReading: Event ObjectsЛабораторнаяRemoving Event ListenersВидеоReading: Removing Event ListenersЛабораторнаяsetTimeout and setIntervalВидеоclearTimeout and clearIntervalВидеоReading: Timeouts and IntervalsЛабораторнаяLet's Build: Whack-a-moleВидеоPractice: Events and CallbacksПрограммированиеConclusion: Events and CallbacksВидео

Lesson 2: Event Propagation and Delegation

Introduction: Event Propagation and DelegationВидеоThe Event LoopВидеоReading: The Event LoopЛабораторнаяEvent Bubbling and PropagationВидеоReading: Event Bubbling and PropagationЛабораторная.preventDefault() and .stopPropagation() to Control the Default BehaviorВидео

Lesson 3: Scope and Functions

Introduction: Scope and HoistingВидеоVariable ScopeВидеоReading: Variable ScopeЛабораторнаяFunction HoistingВидеоReading: Function HoistingЛабораторнаяPractice: Scope and FunctionsПрограммирование
03Asynchronous Code and Data Fetching31 материалов

Lesson 1: Promises

Introduction: PromisesВидеоWhat Are Promises?ВидеоReading: What Are Promises?ЛабораторнаяCreating Promises ManuallyВидеоReading: Creating Promises ManuallyЛабораторнаяGetting Promise Values With .thenВидеоChaining PromisesВидеоReading: Chaining PromisesЛабораторнаяThe fetch() FunctionВидеоReading: The fetch() FunctionЛабораторнаяHandling Errors in PromisesВидеоPractice: PromisesПрограммированиеConclusion: PromisesВидео

Lesson 2: Fetching External Data

Introduction: Fetching External DataВидеоJSON-Formatted DataВидеоReading: JSON-Formatted DataЛабораторнаяQuery StringsВидеоReading: Query StringsЛабораторнаяExternal APIsВидеоReading: External APIs

Lesson 3: Promises and async/await

Introduction: Combining Promises and async/awaitВидеоCombining PromisesВидеоasync and awaitВидеоReading: async and awaitЛабораторнаяLet's Build: Improved Weather by LocationВидеоPractice: Promises and async/awaitПрограммирование
04Animations and Custom Graphics 31 материалов

Lesson 1: Animating in JavaScript

Introduction: Animating in JavaScriptВидеоReading: Animating in JavaScriptЛабораторнаяDates and Times in JavaScriptВидеоWriting Animation CodeВидеоReading: Manual AnimationЛабораторнаяThe requestAnimationFrame FunctionВидеоEasing FunctionsВидеоReading: Easing FunctionsЛабораторнаяPractice: Animating in JavaScriptПрограммированиеConclusion: Animating in JavaScriptВидео

Lesson 2: Animation in CSS and the Animation API

Introduction: Animation in CSS and the Animation APIВидеоCSS TransitionsВидеоReading: CSS TransitionsЛабораторнаяCSS AnimationsВидеоReading: CSS AnimationsЛабораторнаяThe Animation APIВидео

Lesson 3: Custom SVG Drawings

Introduction: Custom SVG DrawingsВидеоReading: Custom SVG DrawingsЛабораторнаяSVG ElementsВидеоReading: SVG ElementsЛабораторнаяSVG Polygons and PathsВидеоReading: SVG Polygons and PathsЛабораторная
Reading: .preventDefault() and .stopPropagation() to control the default behaviorЛабораторная
Understanding CallbacksВидео
Reading: Synchronous vs. Asynchronous Лабораторная
Reading: The Trouble With Nested CallbacksЛабораторная
Let's Build: Custom Context MenusВидео
Practice: Event Propagation and DelegationПрограммирование
Conclusion: Event Propagation and DelegationВидео
Module 2 Graded AssignmentПрограммирование
Conclusion: Scope and HoistingВидео
Лабораторная
Let's Build: Weather by locationВидео
Practice: Fetching External DataПрограммирование
Conclusion: Fetching External DataВидео
Module 3 Graded AssignmentПрограммирование
Conclusion: Combining Promises and async/awaitВидео
Reading: The Animation APIЛабораторная
Practice: Animation in CSSПрограммирование
Conclusion: Animation in CSS and the Animation APIВидео
Creating SVG Elements DynamicallyВидео
Reading: Creating SVG Elements DynamicallyЛабораторная
Practice: Custom SVG DrawingsПрограммирование
Module 4 Graded AssignmentПрограммирование
Conclusion: Custom SVG DrawingsВидео
SurveyЧтение