![wise.js](/img/default-banner.jpg)
- 29
- 989 522
wise.js
Ukraine
Приєднався 24 кві 2020
Вітаю, ми з України 🇺🇦
Дякую, що зайшов на Wise.js - канал про програмування на JavaScript. Нові ролики щотижня 🔥
Тут я ділюся своїми знаннями з Frontend. Ти знайдеш безкоштовні навчальні курси, розбір складних моментів, нетривіальні туторіали з програмуванням від новачка до просунутого рівня.
✔ Мій телеграм канал: t.me/frontend_tips , де ти знайдеш більше корисної інформації по фронтенд.
✔ Підтримка та зворотний зв'язок: www.patreon.com/wisejs
✔ Зв'язатися зі мною: maksym.pogribnyak@gmail.com
Підпишись на канал і стань частиною українського WiseCommunity 👊
Дякую, що зайшов на Wise.js - канал про програмування на JavaScript. Нові ролики щотижня 🔥
Тут я ділюся своїми знаннями з Frontend. Ти знайдеш безкоштовні навчальні курси, розбір складних моментів, нетривіальні туторіали з програмуванням від новачка до просунутого рівня.
✔ Мій телеграм канал: t.me/frontend_tips , де ти знайдеш більше корисної інформації по фронтенд.
✔ Підтримка та зворотний зв'язок: www.patreon.com/wisejs
✔ Зв'язатися зі мною: maksym.pogribnyak@gmail.com
Підпишись на канал і стань частиною українського WiseCommunity 👊
Utility Types в TypeScript с нуля. Все Утилиты на Практике.
Для расширения и модификации типов в TypeScript существует огромный набор встроенных утилитных типов, так называемых Utility Types. Эти утилиты доступны для использования во всех модулях и позволяют масштабировать существующие типы без повторения кода.
Таймкоды:
00:00 - Вступление
00:14 - Readonly
01:24 - Partial
02:45 - Required
03:56 - Pick
04:55 - Omit
05:42 - Record
07:18 - Exclude
08:25 - Extract
09:20 - NonNullable
10:28 - ReturnType
11:43 - Parameters
12:31 - Awaited
13:18 - Манипуляции со строками
Приятного просмотра! Буду благодарен за поддержку в виде комментария и лайка!
🎬 Видео keyof typeof - ua-cam.com/video/cVSo2lxfw54/v-deo.html
👉 Исходный код, чат, воркшопы и поддержка канала: www.patreon.com/wisejs
✔️ Если хочешь изучать программирование со мной, не забудь подписаться :)
ua-cam.com/channels/Oxq.html...
✔️ Мой телеграм канал: t.me/joinchat/RVq-cmt6n1SJRS7Z
#typescript #utilitytypes #тайпскрипт #утилиты #wisejs
Таймкоды:
00:00 - Вступление
00:14 - Readonly
01:24 - Partial
02:45 - Required
03:56 - Pick
04:55 - Omit
05:42 - Record
07:18 - Exclude
08:25 - Extract
09:20 - NonNullable
10:28 - ReturnType
11:43 - Parameters
12:31 - Awaited
13:18 - Манипуляции со строками
Приятного просмотра! Буду благодарен за поддержку в виде комментария и лайка!
🎬 Видео keyof typeof - ua-cam.com/video/cVSo2lxfw54/v-deo.html
👉 Исходный код, чат, воркшопы и поддержка канала: www.patreon.com/wisejs
✔️ Если хочешь изучать программирование со мной, не забудь подписаться :)
ua-cam.com/channels/Oxq.html...
✔️ Мой телеграм канал: t.me/joinchat/RVq-cmt6n1SJRS7Z
#typescript #utilitytypes #тайпскрипт #утилиты #wisejs
Переглядів: 20 659
Відео
Задачи На Собеседовании Junior / Middle Frontend Developer. Массивы в JavaScript.
Переглядів 62 тис.2 роки тому
Разбираем задачи которые часто спрашивают на собеседовании Junior и Middle Frontend Developer. В этом ролике решаем часто задаваемые задачи по массивам в JavaScript. Разбираем разные способы решения задач некоторые фишки в JavaScript. Напишите в комментариях какие еще вопросы вам задавали на Frontend собеседованиях и как вы с ними справились! Таймкоды: 00:00 - Сумма элементов массива. №1. 00:51...
Гайд по React + TypeScript. Основы и лучшие практики 2022. Функциональный стиль + Hooks.
Переглядів 39 тис.2 роки тому
Полный Гайд по использованию React (с его экосистемой) TypeScript в функциональном стиле. Типы рассмотренные в видео: ✅ ReactElement | JSX.Element ✅ ReactNode ✅ FC | FunctionComponent ✅ HTMLProps ✅ ReactEventHandler ✅ React.XXXEvent ✅ CSSProperties ✅ Hooks ✅ Много других полезных фишек в TypeScript Приятного просмотра! Буду благодарен за поддержку в виде комментария и лайка! 👉 Исходный код, чат...
Как Новый React Router 6 решает все проблемы?
Переглядів 18 тис.2 роки тому
Разбираемся в преимуществах новой версии React Router 6. Из глобальных изменений: 1. Решена проблема порядка роутов с Route Ranking 2. Switch Переименован в Routes 3. Новый API Route 4. Вложенная маршрутизация 5. Index Route вернули 6. Новый хук useRoutes вместо react-router-config 7. Уменьшение размера: c 20kb до 8kb Приятного просмотра! Буду благодарен за поддержку в виде комментария и лайка!...
Условные Типы TypeScript / Infer / Conditional Types
Переглядів 18 тис.2 роки тому
Условные Типы (Conditional Types) позволяют использовать тернарные операторы в работе с типами. Ключевое слово infer внутри условных выражений используется для распознавания типа. Приятного просмотра! Буду благодарен за поддержку в виде комментария и лайка! 👉 Поддержка канала: www.patreon.com/wisejs ✔️ Если хочешь изучать программирование со мной, не забудь подписаться :) ua-cam.com/channels/Ox...
Объектно Ориентированное (ООП) vs Функциональное Программирование (ФП) в реальном React приложении
Переглядів 10 тис.2 роки тому
Разрабатываем реальное приложение на React с использованием разных подходов: Объектно-Ориентированным (ООП) и Функциональным (ФП). 00:00 - Что будет в видео 01:29 - Объектно-Ориентированный код (ООП) 24:33 - Функциональный код (ФП) Приятного просмотра! Буду благодарен за поддержку в виде комментария и лайка! 👉 Поддержка канала и исходный код: www.patreon.com/wisejs ✔️ Если хочешь изучать програ...
Redux vs Mobx - сравнение на реальном React приложении
Переглядів 14 тис.2 роки тому
Сравниваем два самых популярных стейт менеджера для React приложений: Redux и Mobx на практических задачах. В этом видео я использую чистый Redux thunk и Mobx. Если хочешь видео о Redux-Toolkit Mobx-State-Tree дай об этом знать в комментариях. Таймкоды: 00:00 - Начало. 00:57 - Общий модуль для работы с сервером. 02:55 - Стейт менеджер Redux. Основные принципы. 04:41 - Создаем store и получаем д...
Что такое keyof typeof в TypeScript.
Переглядів 18 тис.2 роки тому
Разбираемся с операторами запроса ключей - keyof и запроса типа - typeof в TypeScript на реальных примерах. А так же, какую пользу можно извлечь из использования этих двух операторов вместе. В основе keyof лежат литеральные типы, с них мы и начнем. 00:00 - Литеральные типы как основа keyof 01:09 - Запрос ключей keyof 02:08 - keyof при работе с классами 02:55 - typeof в JavaScript и в TypeScript...
Утверждение типов в TypeScript. Type Assertion + as const.
Переглядів 11 тис.2 роки тому
Иногда вы, как программист, можете знать о типе переменной больше, чем TypeScript может определить. Как раз для таких ситуаций и нужно использовать утверждение типов. Утверждения типа аналогичны приведению типов в других языках программирования Однако, утверждения типа в TypeScript просто позволяют компилятору знать тип переменной. Термин type casting не применим к тайпскрипт так, как система т...
Дженерики в TypeScript с нуля: Generic, Extends, Дефолтные Параметры + Примеры Использования.
Переглядів 57 тис.2 роки тому
Разбираем с одной из сложнейших тем в TypeScript - дженериками. Generic - это мощный инструмент, позволяющий описывать типа, способные работать с различными типами и структурами данных. Таймкоды: 00:00 - Зачем нужны generic типы. 01:47 - Что такое generic в TypeScript. Синтаксис дженерик типов. 02:45 - Как работают generic типы. 05:38 - Создаем простой generic для загрузки данных по API. 07:18 ...
Разница между Интерфейсом и Типом в Тайпскрипт 2021. TypeScript Interface vs Type.
Переглядів 63 тис.2 роки тому
Интерфейс и тип очень похожи между собой. С развитием Тайпскрипта разница между ними почти стерлась. И Интерфейс и Тип могут использоваться взаимозаменяемо почти во всех случаях. В этом видео мы разбираем основные отличия Interface и Type в TypeScript на практических примерах, а так же разберем некоторые моменты, которые уже не актуальны в новых версиях, а так же когда что использовать. Приятно...
10 ошибок начинающих Frontend программистов. Условные операторы if ... else.
Переглядів 8 тис.2 роки тому
Рассмотрим 10 ошибок начинающих Frontend / JavaScript программистов, которые чаще всего допускают при работе с условными операторами: if ... else, switch, тренарный оператор, возврат булевого значения и другие. Таймкоды: 0:00 - Какие ошибки рассмотрим 00:11 - Прямое сравнение с true / false 01:19 - Явный возврат true / false 02:37 - Обучение с Wise.js Online 03:04 - Лишние проверки и переменные...
Блог с CMS на NextJS, React, Contentful и typescript. Блог с использованием SSR.
Переглядів 14 тис.2 роки тому
Создаем блог с CMS на React, NextJS и typescript. Блог с контентом в Contentful CSM и SSR/SSG отрисовку на стороне приложения. Разбираемся в основах Nextjs: routing, getStaticProps, getServerSideProps. Настраиваем Contentful Headless CMS. Используем typescript и генерацию типов исходя из контента. Таймкоды: 00:00 - Вступление. Обзор работы приложения. 02:13 - Создаем Nextjs приложение. 05:16 - ...
Собеседование JUNIOR FRONTEND ANGULAR разработчика. Александр 53 года.
Переглядів 24 тис.2 роки тому
Собеседование JUNIOR FRONTEND ANGULAR разработчика. Александр 53 года.
Реальное Приложение с Пагинацией и Поиском на React + REST API. Урок 3. Redux-Saga React Полный Курс
Переглядів 10 тис.2 роки тому
Реальное Приложение с Пагинацией и Поиском на React REST API. Урок 3. Redux-Saga React Полный Курс
Redux-Saga React Полный Курс. Урок 2. Эффекты в деталях. Архитектура саг. React Router + Redux Saga.
Переглядів 17 тис.2 роки тому
Redux-Saga React Полный Курс. Урок 2. Эффекты в деталях. Архитектура саг. React Router Redux Saga.
Redux-Saga React Полный Курс. Урок 1. Саги, Эффекты, Генераторы.
Переглядів 49 тис.3 роки тому
Redux-Saga React Полный Курс. Урок 1. Саги, Эффекты, Генераторы.
ВИДЕОЧАТ C НУЛЯ НА React & WebRTC + WebSockets. Аналог Zoom, Skype, Google Meet ЗА ЧАС 2021
Переглядів 42 тис.3 роки тому
ВИДЕОЧАТ C НУЛЯ НА React & WebRTC WebSockets. Аналог Zoom, Skype, Google Meet ЗА ЧАС 2021
REACT ПРИЛОЖЕНИЕ AGILE BOARD С MOBX/MOBX-STATE-TREE | Hooks, JSON Server, Material UI
Переглядів 14 тис.3 роки тому
REACT ПРИЛОЖЕНИЕ AGILE BOARD С MOBX/MOBX-STATE-TREE | Hooks, JSON Server, Material UI
ПОСЛЕДОВАТЕЛЬНЫЕ ВЫЗОВЫ API НА JavaScript. async/await | fetch | XmlHttpRequest | Promise
Переглядів 4 тис.3 роки тому
ПОСЛЕДОВАТЕЛЬНЫЕ ВЫЗОВЫ API НА JavaScript. async/await | fetch | XmlHttpRequest | Promise
РЕАЛЬНОЕ WEB ПРИЛОЖЕНИЕ С НУЛЯ: react, hooks, redux, redux-saga, material-ui.
Переглядів 20 тис.3 роки тому
РЕАЛЬНОЕ WEB ПРИЛОЖЕНИЕ С НУЛЯ: react, hooks, redux, redux-saga, material-ui.
ЯЗЫК РАЗМЕТКИ HTML ЗА 40 МИНУТ ДЛЯ НАЧИНАЮЩИХ. ВСЕ ТЕГИ ВКЛЮЧЕНЫ.
Переглядів 62 тис.3 роки тому
ЯЗЫК РАЗМЕТКИ HTML ЗА 40 МИНУТ ДЛЯ НАЧИНАЮЩИХ. ВСЕ ТЕГИ ВКЛЮЧЕНЫ.
СВЯЗЫВАЕМ HTML Form C JavaScript. ВСЕ СПОСОБЫ ПОЛУЧЕНИЯ ДАННЫХ. FormData.
Переглядів 23 тис.3 роки тому
СВЯЗЫВАЕМ HTML Form C JavaScript. ВСЕ СПОСОБЫ ПОЛУЧЕНИЯ ДАННЫХ. FormData.
Смотрящим через 2 года: нет, настолько простые задачи вас на собеседовании решать не попросят.
Кратко и понятно. Для тех кто знал да забыл.
perfect
0:25 для этих целей так же можно использовать и class и typeof любього объекта (но это считай будет type, только без присвоенного типа)
мне кажется там все предельно понятно, если ты понимаешь концепцию интерфейса. а type им следовало назвать alias и тогда бы точно не было бы никаких путаниц
30:50 как так быстро закоментировать ? p.s досмотрел весь ролик, все четко,понятно, без воды. Хз почему так мало лайков за такой контент
Мне 51. Хочу пойти по стопам Александра :) Ява-пкрипт на минимальном уровне изучил, но пока сложно именно писать код - обычно просто копирую чужой (забываю правила написания функций, забываю методы и тд). Поэтому не знаю, получится ли выйти к React и Angular
Спасибо большое за такой подробный рассказ! Было бы хорошо сделать логическое продолжение этой темы: отправка по php со связкой через json - мне непонятно, неужели без этого json нельзя обойтись при связывании с php?
Как хук afterCreate() { self.load(); } может вызвать load если его нет в объекте? Он даже тебе подсвечивает, в typescript вобще ругается нет такого метода в объекте
Слушай не могу не оставить комментарий, но ты топ! Максимально сжато и достаточно инфы для начала, а как говориться дальше сам. Ноль воды, все по делу, и качественно, спасибо тебе за этот вводный урок, потрудился ты хорошо.
Такой легкотни на собеседовании быть просто не может. Это даже не уровень джуна. Да, задачи тоже на массивы могут быть, но они будут куда сложнее и не такими очевидными, да еще и с особыми требованиями, типа сделать то-то, не используя что-то (например, какие-то стандартные методы) или не используя дополнительную память, либо показать алгоритм с заданной сложностью. В общем, такие задачи могут быть лишь на собеседовании в какой-то сказочной компании. А таковых давно не существует.
eval это прикол конечно, думаю лучше так не делать на собеседовании 😅
ua-cam.com/video/IHQcma93fpE/v-deo.html
как я могу получить https сертификат и использовать его?
почему работает только на Локал хосте? может это я дурак...
Спасибо за видео, полезно, побольше бы таких по Angular. Удобные таймкоды!
Спасибо, за этот ролик!! Все максимально понятно и наглядно! После просмотра наконец-то понял как это работает WebRTC и смог реализовать видеозвонки в своем курсовом проекте.
спс большое
А нельзя это в одной функции писать? Зачем в вложенные делать
Это крутой контент! Спасибо!! Очень подробно и понятно!! Ещё раз спасибо, продолжай в том же духе))
Зашёл увидел старющий как мир цикл и сразу закрыл видео 🤮
молодец, не забывает язычок трубочкой сворачивать, когда иностранные слова произносит!
теперь понял. спасибо
Очень кратко быстро но достаточно много показал. Хорошее видео.
Отличное видео
🫡
а почему, если не использовать деструктуризацию в выражении array.map(array.pop, array), вернет [6,6,5,4,,,] ?
Спасибо, ибо это действительно сложно, мало где понятно и коротко объяснено, "спрашиваемо" на собесах, видано в кучках популярных либ, но не особо "используемо"))))))))) 👍👍👍👍👍👍👍👍👍👍👍👍👍👍
Полезно, спасибо
сейчас кстати ts стал умнее и при присвоении пустого обьекта он смотрит реализуются ли на этом же уровне нужные поля, если нет то кидает ошибку о несоответсвии, если да то все збс
Даже в 2024 году этот гайд еще актуален, спасибо огромное! Но у меня проблема, устройства которые не имеют камеры/микрофона не могут видеть других участников. Как сделать чтобы даже если у пользователя отсутствует камера/микрофон он все равно видел других участников?
Что-то я смотрю одной мне непонятна разница между Omit и Exclude. несколько раз пересмотрела и совершенно не увидела разницы. Что тот что тот исключает ключи из первого объекта и только те, которые переданы во втором
Респект за сохраненное время!
Яб тому хто це все придумав башню відбив би)))) Ми получаем Дани ми достаєм Дани які нам нафіг не потрібні виявляється ці дані потрібні сeрваку! курва.. Це якась OSINTщина))))
просто вау! очень крутое видео!
всего 3 урока в серии Redux-Saga?
Это баааза) очень, очень хорошее объяснение, удачи в блоге!
Это видео...просто клад. Спасиб) На курсах теорию прохожу, понял частично. Видео посмотрел, понял практически все. Осталось попрактиковаться.
а зачем нужен тег header если шапку уже создали при помощи тегов head и title?
В <head> техническая информация для поисковых систем и браузеров. Она не отображается на странице. Только название страницы, заключенное в тег <tittle>, отобразиться в верхней вкладке браузера. А <header> - это шапка страницы. Может содержать название сайта, логотип, лозунг, навигационные ссылки и т.д. Содержимое данного тега видно пользователю.
офигительная лекция. Просто супер. Процветания тебе, Автор!
Это лучшее видео про джинерики которое я видел
Благодарю Вас! Все так структурированно, понятно, голос очень приятный! Большая благодарность за всю информацию!💗💗💗
10:12, это операция пересечения, а не объединение
Пардон, но я что-то не догнал вашего утверждения о том что длинна кортежа не меняется,. Почему тогда основываясь на вашем примере могу пушить данные в переменную с типом State и длинна массива меняется?
Можете объяснить , что это за запись такая "declare function" ? Гугл совпадений не нашел. Это по типу интерфейсов , задаешь сигнатуру функции и должен ее реализовать и возвратить объект с булевым значением? .А то компиллер не ругается на запись, а в браузере пишет что validate is not defined
9:32 - Скорее лучше ответить , что сигнатуры "a" (точнее из чего он создан) это класс String и этот класс разрешает обращать к его значениям по индексу но не менять их. Если подключить typescript он так и напишет , что запрещено изменять индекс в строке
крутатошка!!!!
Парень, гигантское тебе спасибище, ты просто лучший! Дай Бог тебе здоровья и процветания твоему каналу 🙂
После просмотра этого видео, мой мозг сгорел
написано правильно, а сказал чуток не так: Readonly - делает поля объекта доступными только для чтения, а не обязательными а так большое спасибо за видео и примеры, все очень доступно и понятно!)