Главная страница Категория javascript 20 веб-проектов с использованием Vanilla JavaScript

20 веб-проектов с использованием Vanilla JavaScript

Name: 20 веб-проектов с использованием Vanilla JavaScript
Rating: 4.9 (137 reviews)

20 Web Projects With Vanilla JavaScript

udemy

Brad Traversy

Скачать курс архивом Скачать материалы курса

Продолжительность

16 ч 8 мин

Категория

JavaScript

Количество уроков

120 Видео

Дата добавления

29 янв. 2020 г., 17:20

Язык

Английский

Дата выхода

28 янв. 2020 г., 19:05

Это веселый, практический и проектный курс для всех уровней квалификации. Проекты этого курса предназначены для того, чтобы вы строили вещи с использованием HTML5, CSS и JavaScript без фреймворков или библиотек. Каждый проект построен с нуля и имеет какую-то динамическую функциональность от небольших игр до трекера расходов и приложения для расслабляющего дыхания.

Хотя это курс, основанный на проектах, я все равно буду объяснять все по ходу дела. Это мини-проекты, разработанные для вас за несколько часов.

Вы должны иметь базовые знания HTML / CSS / JS. Если вы новичок, я бы предложил курс Modern HTML / CSS From the Beginning и / или курс Modern JS From The Beginning. Этот курс представляет собой смесь обоих.

Некоторые вещи, которые вы узнаете в этих проектах:

Создание макетов и интерфейсов с помощью HTML / CSS (без CSS-фреймворков)
CSS-анимации (переходы, ключевые кадры и т. д. С помощью триггеров JS)
Основы JavaScript
DOM и Манипуляции
События JavaScript (формы, кнопки, прокрутка и т.д.)
API и JSON
HTML5 Canvas
API аудио и видео
Перетаскивания
API веб-речи (Syth и Recognition)
Работа с локальным хранилищем
High Order Array Methods - orEach, map, filter, reduce, sort
setTimout, setInterval
Arrow Functions
и более!!

Посмотреть больше

Урок 1. 00:02:26

Welcome To The Course
Урок 2. 00:06:35

Getting Setup
Урок 3. 00:01:58

Project Intro
Урок 4. 00:06:21

Project HTML
Урок 5. 00:13:48

Project CSS
Урок 6. 00:14:44

Adding Simple Validation
Урок 7. 00:09:16

Check Required & Refactor
Урок 8. 00:09:14

Check Length, Email & Password Match
Урок 9. 00:01:24

Project Intro
Урок 10. 00:05:47

Project HTML
Урок 11. 00:16:07

Project CSS
Урок 12. 00:15:14

Selecting Movie & Seats From UI
Урок 13. 00:12:44

Save Data To Local Storage
Урок 14. 00:08:14

Populate UI With Saved Data
Урок 15. 00:02:07

Project Intro
Урок 16. 00:08:22

Project HTML
Урок 17. 00:09:53

Project CSS
Урок 18. 00:09:25

Play, Pause & Stop
Урок 19. 00:06:42

Video Progress Bar & Timestamp
Урок 20. 00:01:49

Project Intro
Урок 21. 00:04:30

Project HTML
Урок 22. 00:10:13

Project CSS
Урок 23. 00:09:20

A Look at JSON & Fetch
Урок 24. 00:12:58

Fetch Rates & Update DOM
Урок 25. 00:02:08

Project Intro
Урок 26. 00:09:20

Project UI
Урок 27. 00:07:46

Generate Random Users - Fetch w/ Async/Await
Урок 28. 00:10:28

Output Users - forEach() & DOM Methods
Урок 29. 00:06:01

Double Money - map()
Урок 30. 00:05:01

Sort By Richest - sort()
Урок 31. 00:04:27

Show Millionaires - filter()
Урок 32. 00:06:17

Calculate Wealth - reduce()
Урок 33. 00:01:06

Project Intro
Урок 34. 00:10:12

Project HTML
Урок 35. 00:07:33

Navbar Styling
Урок 36. 00:12:09

Header & Modal Styling
Урок 37. 00:10:01

Menu & Modal Toggle
Урок 38. 00:01:50

Project Intro
Урок 39. 00:11:36

Draw Hangman With SVG
Урок 40. 00:10:56

Main Styling
Урок 41. 00:08:36

Popup & Notification Styling
Урок 42. 00:11:23

Display Words Function
Урок 43. 00:08:39

Letter Press Event Handler
Урок 44. 00:09:55

Wrong Letters & Play Again
Урок 45. 00:01:25

Project Intro
Урок 46. 00:10:19

Project HTML & Base CSS
Урок 47. 00:20:10

Search & Display Meals From API
Урок 48. 00:15:29

Show Single Meal Page
Урок 49. 00:10:21

Display Random Meal & Single Meal CSS
Урок 50. 00:01:34

Project Intro
Урок 51. 00:05:11

Project HTML
Урок 52. 00:14:01

Project CSS
Урок 53. 00:08:51

Show Transaction Items
Урок 54. 00:08:20

Display Balance, Income & Expense
Урок 55. 00:08:54

Add & Delete Transactions
Урок 56. 00:05:41

Persist To Local Storage
Урок 57. 00:01:57

Project Intro
Урок 58. 00:05:41

Project HTML
Урок 59. 00:10:10

Music Container & Rotate Animation
Урок 60. 00:09:22

Music Info Styling & Animation
Урок 61. 00:08:47

Load, Play & Pause Song
Урок 62. 00:12:21

Next, Prev Song & Progress
Урок 63. 00:02:31

Project Intro
Урок 64. 00:03:06

Project HTML
Урок 65. 00:09:53

Project CSS & Loader Animation
Урок 66. 00:07:27

Get Initial Posts From API
Урок 67. 00:06:10

Add Infinite Scrolling
Урок 68. 00:05:16

Filter Fetched Posts
Урок 69. 00:01:46

Project Intro
Урок 70. 00:04:40

Project HTML
Урок 71. 00:12:23

Project CSS
Урок 72. 00:08:16

Word Match & Score
Урок 73. 00:09:21

Adding The Timer
Урок 74. 00:08:09

Difficulty Setting
Урок 75. 00:01:58

Project Intro
Урок 76. 00:12:18

HTML & Output Speech Boxes
Урок 77. 00:17:19

Project CSS
Урок 78. 00:07:29

Get Speech Voices
Урок 79. 00:04:59

Speech Buttons
Урок 80. 00:05:05

Change Voice & Custom Text Box
Урок 81. 00:02:12

Project Intro
Урок 82. 00:07:17

Project HTML
Урок 83. 00:10:36

Basic Card Styling
Урок 84. 00:11:04

Card Rotation & Slide Effect
Урок 85. 00:06:28

Add Card Container & Form Styling
Урок 86. 00:10:24

Create Cards & Flip Effect With JS
Урок 87. 00:06:24

Prev & Next Button Functionality
Урок 88. 00:13:18

Set & Get Card Data From Local Storage
Урок 89. 00:01:30

Project Intro
Урок 90. 00:09:47

Project HTML & Header Stying
Урок 91. 00:07:16

Form Styling
Урок 92. 00:09:50

Fetching Songs & Artists
Урок 93. 00:15:08

Update DOM & Add Pagination
Урок 94. 00:10:09

Get & Display Song Lyrics
Урок 95. 00:00:52

Project Intro
Урок 96. 00:10:02

Creating The Large Circle
Урок 97. 00:04:38

Creating & Animating The Pointer
Урок 98. 00:09:41

Breath Animation With JS Trigger
Урок 99. 00:01:02

Project Intro
Урок 100. 00:11:16

Creating & Styling The Page
Урок 101. 00:06:04

Canvas Plan Outline
Урок 102. 00:11:02

Draw Ball, Paddle & Score
Урок 103. 00:09:28

Creating The Bricks
Урок 104. 00:12:52

Move Paddle
Урок 105. 00:10:30

Move Ball & Break Bricks
Урок 106. 00:05:00

Lose & Reset Game
Урок 107. 00:01:09

Project Intro
Урок 108. 00:11:08

Landing Page HTML & Styling
Урок 109. 00:12:00

Create The Countdown
Урок 110. 00:07:12

Dynamic Year & Spinner
Урок 111. 00:01:40

Project Intro
Урок 112. 00:09:35

Insert List Items Into DOM
Урок 113. 00:06:43

Scramble List Items
Урок 114. 00:12:23

Core CSS
Урок 115. 00:14:58

Drag & Drop Functionality
Урок 116. 00:05:38

Check Order
Урок 117. 00:01:31

Project Intro
Урок 118. 00:08:52

Project UI
Урок 119. 00:08:10

Capture Mic Input
Урок 120. 00:12:51

Check Guessed Number

Авторы - Brad Traversy, udemy

Brad Traversy

Я начал программировать в 2007 году в возрасте 26 лет. В 2016 году я стал штатным преподавателем и создателем контента. Я показываю людям, что им не обязательно быть отличником или гением, чтобы научиться программировать. Я разбиваю сложные концепции, показывая вам, как их реализовать в курсах и учебных пособиях на основе проектов.

+189

udemy

Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.

+191

Категории

Комментарии

inna.cherkashina.1979

16 авг. 2022 г., 08:07

Боже, какая прелесть. Хочу все эти проекты пройти!
vlacrat

22 февр. 2022 г., 08:01

Если изучать новый материал, то только на практике!
festa

18 нояб. 2021 г., 14:49

приятно объясняет, советую начинающим
Anonymous

26 авг. 2020 г., 12:23

Great course!!!

Команда внимательно читает ваши комментарии и оперативно на них реагирует. Вы можете спокойно оставлять запросы на обновления или задавать любые вопросы о курсе здесь.

Другие материалы в этой категории

Изображение курса Курс JavaScript - полный курс с нуля до результата

beonmax.com

4 янв. 2020 г., 14:49

JavaScript

Курс JavaScript - полный курс с нуля до результата

Курс изучения JavaScript для начинающих — Онлайн обучение программированию на JavaScript. Основная цель курса - практика изучения JavaScript на реальных примерах для frontend-разработчиков. Каждый теоретический блок заканчивается практикой. Создадите реальные проекты в процессе прохождения курса. Исходные коды к заданиям для сверки прилагаются.

12 ч 12 мин

Русский

Посмотреть

+36

Изображение курса JavaScript - полное руководство в 2020 году

udemy

15 дек. 2019 г., 16:31

JavaScript

JavaScript - полное руководство в 2020 году

JavaScript - The Complete Developer in 2020

Изучите необходимые навыки для повышения уровня от новичка до продвинутого разработчика JavaScript в 2020 году!

4 ч 57 мин

Английский

Посмотреть

Изображение курса Продвинутые основы JavaScript

egghead

7 дек. 2019 г., 17:27

JavaScript

Продвинутые основы JavaScript

Advanced JavaScript Foundations

Все начинается с синтаксиса. Оттуда, как только вы поняли концепции, вы можете перейти к использованию фреймворка, где вы выясняете, как заставить вещи «просто работать». На этом семинаре вы будете поднимать вещи на следующий уровень, проливая свет на концепции «черного ящика», такие как прототипы, ключевое слово this и что такое примитивные типы.

0 ч 41 мин

Английский

Посмотреть

+26

Изображение курса Изучите Замыкания в JavaScript

codesmith.io

18 дек. 2019 г., 18:53

JavaScript

Изучите Замыкания в JavaScript

Learn JavaScript Closures (PRO)

Видеокурс о самой мощной и в то же время сложной концепции в JavaScript. Цель этого курса - по-настоящему дать понять концепцию, которая позволит вам ускорить все ваши будущие разработки.

5 ч 15 мин

Английский

Посмотреть

+37

Изображение курса JavaScript - Полное руководство 2022 (начинающий + продвинутый)

udemy

Academind Pro

30 окт. 2019 г., 23:38

JavaScript

JavaScript - Полное руководство 2022 (начинающий + продвинутый)

JavaScript - The Complete Guide 2022 (Beginner + Advanced)

JavaScript - это самый важный язык программирования, который вы должны изучать как веб-разработчик - и с этим курсом вы убедитесь, что вы не пропустите ни одной вещи, которую вы должны знать, как разработчик JavaScript!

50 ч 37 мин

Английский

Посмотреть

+224