Фишки HTML и CSS
В HTML и CSS есть возможности, которые упростят ваш код, сделают сайт более стабильным и интересным для поисковых роботов.
Из видео вы узнаете про 7 фишек, которые улучшат ваш проект: Параллакс, CSS-анимацию, режимы смешивания, вертикальное выравнивание и другое.
📺 YouTube
WebDEV #видео #CSS #HTML
В HTML и CSS есть возможности, которые упростят ваш код, сделают сайт более стабильным и интересным для поисковых роботов.
Из видео вы узнаете про 7 фишек, которые улучшат ваш проект: Параллакс, CSS-анимацию, режимы смешивания, вертикальное выравнивание и другое.
📺 YouTube
WebDEV #видео #CSS #HTML
YouTube
Топ-7 фишек HTML/CSS верстки сайта которые ты должен знать
Мы продолжаем рубрику улучшаем код и в этом видео мы поговорим про топ 7 фишек html css для верстки сайта, котоые вы должны знать. Верстка сайта на самом деле не такая сложная как кажется на первый взгляд, да и html css кажется для начинающих темным лесом.…
Каталог товаров на Next.js
В результате этого огромного урока у вас будет почти такой же сайт с каталогом игр, как и у Xbox. Вы научитесь парсить страницы, составлять и отправлять запросы.
Поскольку здесь ведётся проект начиная с абсолютного нуля, очень много времени уделяется вёрстке. А если вас интересует больше Next.js, тогда перемотайте до 1:42:50.
📺 YouTube
WebDEV #видео
В результате этого огромного урока у вас будет почти такой же сайт с каталогом игр, как и у Xbox. Вы научитесь парсить страницы, составлять и отправлять запросы.
Поскольку здесь ведётся проект начиная с абсолютного нуля, очень много времени уделяется вёрстке. А если вас интересует больше Next.js, тогда перемотайте до 1:42:50.
📺 YouTube
WebDEV #видео
YouTube
Каталог товаров на Next.js
Освойте профессию frontend-разработчика: https://loftschool.com/professions/frontend-developer/
16 июня 2021 года в 20:00 пройдёт открытый вебинар на тему: "Каталог товаров на Next.js".
Автор: Павел Минеев, June Homes, Frontend teamlead
На открытом вебинаре…
16 июня 2021 года в 20:00 пройдёт открытый вебинар на тему: "Каталог товаров на Next.js".
Автор: Павел Минеев, June Homes, Frontend teamlead
На открытом вебинаре…
Продвинутый Backend
Backend разработчик отвечает за сохранность и безопасную передачу ваших данных. Все эти процессы происходят на стороне сервера.
С помощью Node.js + Nest.js и PostgreSQL вы реализуете масштабируемый backend, который после зальёте с использованием docker.
📺 YouTube
WebDEV #видео #SQL #NodeJS #js
Backend разработчик отвечает за сохранность и безопасную передачу ваших данных. Все эти процессы происходят на стороне сервера.
С помощью Node.js + Nest.js и PostgreSQL вы реализуете масштабируемый backend, который после зальёте с использованием docker.
📺 YouTube
WebDEV #видео #SQL #NodeJS #js
YouTube
Продвинутый BACKEND на Node.js. Nest js ПОЛНЫЙ КУРС & Docker
В этом ролике мы реализуем масштабируемый backend на node js с использованием фреймворка Nest js. В качестве СУБД воспользуемся PostgreSQL в связке с ORM Sequelize на node js. Задокументируем API с помощью SWAGER nest js. По итогу обернем приложение на node…
Курс по Bootstrap 5
Bootstrap сильно упрощает вёрстку сайтов, а именно — их оформление. А с пятой версией у него появилось ещё больше возможностей и выглядеть он стал даже лучше.
В этом видео автор создаёт сайт и параллельно рассказывает про фишки Bootstrap и про то, как им пользоваться. К тому же, он учит пользоваться документацией проекта, поэтому видео обязательно к просмотру.
📺 YouTube
WebDEV #видео
Bootstrap сильно упрощает вёрстку сайтов, а именно — их оформление. А с пятой версией у него появилось ещё больше возможностей и выглядеть он стал даже лучше.
В этом видео автор создаёт сайт и параллельно рассказывает про фишки Bootstrap и про то, как им пользоваться. К тому же, он учит пользоваться документацией проекта, поэтому видео обязательно к просмотру.
📺 YouTube
WebDEV #видео
YouTube
Подробный видео курс по Bootstrap 5 на русском языке, Как создать сайт на Bootstrap 5
В этом курсе вы узнаете как скачать Bootstrap 5 и подключить его в свой проект через CDN и локально. Мы начнем работу с Bootstrap 5. Я расскажу про отличия от Bootstrap 4, а если вы впервые знакомитесь с Bootstrap то вы узнаете для чего нужен этот CSS фреймворк.…
Скрипты для сайта интернет магазина
Это добавление/удаление товара в корзину, счётчик товаров в корзине, кнопка «Оформить заказ», подсчёт стоимости товаров в корзине и другие возможности.
Это видео — набор реализация функций для правильной работы интернет магазина с использованием чистого JavaScript.
📺 YouTube
WebDEV #видео #JavaScript
Это добавление/удаление товара в корзину, счётчик товаров в корзине, кнопка «Оформить заказ», подсчёт стоимости товаров в корзине и другие возможности.
Это видео — набор реализация функций для правильной работы интернет магазина с использованием чистого JavaScript.
📺 YouTube
WebDEV #видео #JavaScript
YouTube
Обучение JavaScript. Урок для начинающих. Скрипты для сайта интернет магазина
↓↓↓ Таймкоды, ссылки на материалы в описании под видео ↓↓↓
Обучение JavaScript на практическом примере. Пишем JS скрипты для сайта интернет магазина. Работа с DOM, поиск элементов, нажатие (клик), функции, переменные, массивы. Урок по языку программирования…
Обучение JavaScript на практическом примере. Пишем JS скрипты для сайта интернет магазина. Работа с DOM, поиск элементов, нажатие (клик), функции, переменные, массивы. Урок по языку программирования…
Зачем нужны типы?
Как сказал один наш коллега: «Типы придумали, чтобы усложнить жизнь разработчику». Но почему статически типизированные языки тогда до сих пор так популярны?
Автор показывает на примере TypeScript, почему без типов в современном программировании не обойтись, и какие проблемы вообще существуют у динамической типизации.
📺 YouTube
WebDEV #видео #TypeScript
Как сказал один наш коллега: «Типы придумали, чтобы усложнить жизнь разработчику». Но почему статически типизированные языки тогда до сих пор так популярны?
Автор показывает на примере TypeScript, почему без типов в современном программировании не обойтись, и какие проблемы вообще существуют у динамической типизации.
📺 YouTube
WebDEV #видео #TypeScript
YouTube
Зачем нужны типы, рассмотрим на примере
#soer #itubeteam
Основной канал для общения и публикации новых видео - Телегарм - https://tttttt.me/softwareengineervlog
Спонсорство - https://donate.s0er.ru
Сайт платным контентом - https://soer.pro
Зеркало для видео Дзен Видео - https://zen.yandex.ru/i…
Основной канал для общения и публикации новых видео - Телегарм - https://tttttt.me/softwareengineervlog
Спонсорство - https://donate.s0er.ru
Сайт платным контентом - https://soer.pro
Зеркало для видео Дзен Видео - https://zen.yandex.ru/i…
Полный Full Stack-курс
Full Stack — человек, который разрабатывает все приложения самостоятельно (пишет и Fronted, и Backend). В данном случае вам потребуется знать MongoDB, Express, React и NodeJS.
После просмотра вы научитесь писать свой Backend, работать с MongoDB, деплоить приложение, подключать аутентификацию с помощью JWT, а также объединять Fronted и Backend.
📺 YouTube
WebDEV #видео #React #NodeJS
Full Stack — человек, который разрабатывает все приложения самостоятельно (пишет и Fronted, и Backend). В данном случае вам потребуется знать MongoDB, Express, React и NodeJS.
После просмотра вы научитесь писать свой Backend, работать с MongoDB, деплоить приложение, подключать аутентификацию с помощью JWT, а также объединять Fronted и Backend.
📺 YouTube
WebDEV #видео #React #NodeJS
YouTube
Полный Full Stack курс ReactJS + NodeJS для начинающих за 4 часа! (MongoDB, Express, React, NodeJS)
В этом видео ты научишься с нуля разрабатывать бэкенд на стэке MERN (MongoDB, Express, React, NodeJS) и подключать к фронтенду свой бэкенд. Также, к завершению урока ты научишься деплоить своё приложение на Heroku + Vercel.
Курс идеально подойдёт для новичков…
Курс идеально подойдёт для новичков…
React + Redux + TypeScript
React — создаст интерфейс, Redux поможет им управлять, а TypeScript сделает код более читаемым и стабильным. Отличный же сайт получится, если всё это объединить!
Перед просмотром надо иметь базу по всем инструментам, ведь в ролике рассказывается как их объединить, а не как ими пользоваться.
📺 YouTube
WebDEV #видео #React #TypeScript
React — создаст интерфейс, Redux поможет им управлять, а TypeScript сделает код более читаемым и стабильным. Отличный же сайт получится, если всё это объединить!
Перед просмотром надо иметь базу по всем инструментам, ведь в ролике рассказывается как их объединить, а не как ими пользоваться.
📺 YouTube
WebDEV #видео #React #TypeScript
YouTube
React & Redux & TypeScript ПОЛНЫЙ КУРС 2021
В этом курсе мы на практике поработает с typescrit, react, redux и разработаем небольшое веб приложение.
Мой курс "Продвинутый Frontend. В production на React" - https://ulbitv.ru/frontend
Ссылка на исходный код - https://github.com/utimur/react-redux-typescript…
Мой курс "Продвинутый Frontend. В production на React" - https://ulbitv.ru/frontend
Ссылка на исходный код - https://github.com/utimur/react-redux-typescript…
Мощный React-стек
TypeScript — типизированный код, Redux Toolkit — управление состояниями, RTKQuery — REST система, а Tailwind — упрощает вёрстку.
Объединив всё это вместе, можно получить отличный стек, который позволяет создавать мощные, стабильные и гибкие веб-приложения.
📺 YouTube
WebDEV #видео #React #TypeScript #web
TypeScript — типизированный код, Redux Toolkit — управление состояниями, RTKQuery — REST система, а Tailwind — упрощает вёрстку.
Объединив всё это вместе, можно получить отличный стек, который позволяет создавать мощные, стабильные и гибкие веб-приложения.
📺 YouTube
WebDEV #видео #React #TypeScript #web
YouTube
React стек 2022. TypeScript, Redux Toolkit, RTKQuery, Tailwind
Исходники тут: https://tttttt.me/js_by_vladilen/487
Я в соц сетях:
Telegram: https://tttttt.me/js_by_vladilen
VK: https://vk.com/vladilen.minin
Instagram: https://instagram.com/vladilen.minin
Мастеркласс по React: https://youtu.be/haiiBZW45JE
Мои паблики по JavaScript:…
Я в соц сетях:
Telegram: https://tttttt.me/js_by_vladilen
VK: https://vk.com/vladilen.minin
Instagram: https://instagram.com/vladilen.minin
Мастеркласс по React: https://youtu.be/haiiBZW45JE
Мои паблики по JavaScript:…
Go + React
Go используется для Backend разработки, а React — для Frontend. Чтобы объединить Go с библиотекой на JavaScript, нужно правильно настроить CORS.
Автор рассказывает, как это сделать, какие могут быть проблемы с безопасностью (и как их решить), а также создаёт пример сайта с Go & React.
📺 YouTube
WebDEV #видео #JavaScript #React #Go
Go используется для Backend разработки, а React — для Frontend. Чтобы объединить Go с библиотекой на JavaScript, нужно правильно настроить CORS.
Автор рассказывает, как это сделать, какие могут быть проблемы с безопасностью (и как их решить), а также создаёт пример сайта с Go & React.
📺 YouTube
WebDEV #видео #JavaScript #React #Go
YouTube
ДРУЖБА GOLANG И REACTJS! НАСТРАИВАЕМ CORS
#golang #reactjs #howto #cors
Приятного просмотра!
Не забываем про Телеграмм группу:
Telegram Group: https://tttttt.me/theartofdevel
И канал:
Telegram Channel: https://tttttt.me/theartofdev
Поддержи выход новых видео на Патреоне!
https://www.patreon.com/theartofdevelopment…
Приятного просмотра!
Не забываем про Телеграмм группу:
Telegram Group: https://tttttt.me/theartofdevel
И канал:
Telegram Channel: https://tttttt.me/theartofdev
Поддержи выход новых видео на Патреоне!
https://www.patreon.com/theartofdevelopment…
Архитектура Frontend проектов
Уже слышали про DDD, Onion и Clean Architecture? Тогда после просмотра вы будете знать ещё один, более современный подход — Feature-Sliced Design.
Автор рассказывает про историю развития архитектуры, про FSD и его применение на практике, внедрение в проект и применение в реальном мире.
📺 YouTube
WebDEV #видео
Уже слышали про DDD, Onion и Clean Architecture? Тогда после просмотра вы будете знать ещё один, более современный подход — Feature-Sliced Design.
Автор рассказывает про историю развития архитектуры, про FSD и его применение на практике, внедрение в проект и применение в реальном мире.
📺 YouTube
WebDEV #видео
YouTube
Feature-Sliced Design — Архитектура Frontend проектов / Илья Азин, Яндекс (16.12.2021)
Слайды: https://docs.google.com/presentation/d/1Ui8Ji8Q6fB_3kkcM9bQxVGYuhhcItZInra8WiUOgnOA/edit?usp=sharing
Спикер: https://twitter.com/_azinit
Материалы:
https://feature-sliced.design/docs/community/awesome
https://tttttt.me/feature_slices
https://www.youtu…
Спикер: https://twitter.com/_azinit
Материалы:
https://feature-sliced.design/docs/community/awesome
https://tttttt.me/feature_slices
https://www.youtu…
Правильная структура в React проекте
Поговорим о том, как должны разделяться системы в проекте и как их правильно расположить, чтобы важные части проекта было просто найти.
В видео разбираются три структуры: Feature-sliced, Atomic design и ещё один авторский вариант. После просмотра вы поймёте, как важно, чтобы файлы проекта лежали по своим папкам.
📺 YouTube
WebDEV #видео #React
Поговорим о том, как должны разделяться системы в проекте и как их правильно расположить, чтобы важные части проекта было просто найти.
В видео разбираются три структуры: Feature-sliced, Atomic design и ещё один авторский вариант. После просмотра вы поймёте, как важно, чтобы файлы проекта лежали по своим папкам.
📺 YouTube
WebDEV #видео #React
YouTube
Правильная структура в проекте | Архитектура в React приложениях
🔥 Оформить премиум подписку - https://htmllessons.ru/premium?utm_source=youtube&utm_medium=red-group&utm_campaign=description&utm_content=valid-structure-react
► Интенсив React с нуля (приложение для тренировок) - https://htmllessons.ru/int/show/3?utm_s…
► Интенсив React с нуля (приложение для тренировок) - https://htmllessons.ru/int/show/3?utm_s…
FullStack для новичков
Web делится на две части: то, что вы видите и то, что происходит на стороне сервера. FullStack умеет делать и в Frontend и в Backend.
Автор создаёт классный сайт с MongoDB, Express, React и Node.js. Также расскажет, как загрузить его на Heroku. Звучит сложно, но автор объясняет все так, что поймёт и новичок.
📺 YouTube
WebDEV #видео #React #web #NodeJS #js
Web делится на две части: то, что вы видите и то, что происходит на стороне сервера. FullStack умеет делать и в Frontend и в Backend.
Автор создаёт классный сайт с MongoDB, Express, React и Node.js. Также расскажет, как загрузить его на Heroku. Звучит сложно, но автор объясняет все так, что поймёт и новичок.
📺 YouTube
WebDEV #видео #React #web #NodeJS #js
YouTube
Полный Full Stack курс ReactJS + NodeJS для начинающих за 4 часа! (MongoDB, Express, React, NodeJS)
В этом видео ты научишься с нуля разрабатывать бэкенд на стэке MERN (MongoDB, Express, React, NodeJS) и подключать к фронтенду свой бэкенд. Также, к завершению урока ты научишься деплоить своё приложение на Heroku + Vercel.
Курс идеально подойдёт для новичков…
Курс идеально подойдёт для новичков…
Gulp с нуля
GULP берёт на себя множество рутиных задач. Он сэкономит пару десятков часов вашего времени и продвинет ваш сайт в поисковой системе.
Но перед этим GULP надо настроить, а ещё научиться им пользоваться (вот так неожиданность). Как, зачем и почему — на все вопросы отвечает автор ролика.
📺 YouTube
WebDEV #видео
GULP берёт на себя множество рутиных задач. Он сэкономит пару десятков часов вашего времени и продвинет ваш сайт в поисковой системе.
Но перед этим GULP надо настроить, а ещё научиться им пользоваться (вот так неожиданность). Как, зачем и почему — на все вопросы отвечает автор ролика.
📺 YouTube
WebDEV #видео
YouTube
Gulp сборка с нуля, современный синтаксис, полное руководство
Друзья, обновил старое видео по gulp 4, использую новый, более удобный, современный синтаксис. Записал вам пошаговое руководство и советы, как обновить свою сборку.
Видео о препроцессорах:
https://youtu.be/MpzTnr5x_Wg
Node: https://nodejs.org/en/
Gulp:…
Видео о препроцессорах:
https://youtu.be/MpzTnr5x_Wg
Node: https://nodejs.org/en/
Gulp:…
Исповедь HTML-программиста
Настало время покаяться, HTML-программисты, извиниться перед ScreenReader'ами и перед SEO-движками, да исправить ошибки свои.
Это видео — набор ошибок, которые допускает множество фронтэндщиков, пока создают вёрстку и почему так важно их избегать.
📺 YouTube
WebDEV #видео #HTML
Настало время покаяться, HTML-программисты, извиниться перед ScreenReader'ами и перед SEO-движками, да исправить ошибки свои.
Это видео — набор ошибок, которые допускает множество фронтэндщиков, пока создают вёрстку и почему так важно их избегать.
📺 YouTube
WebDEV #видео #HTML
YouTube
Исповедь HTML-программиста!
Как же тяжела жизнь html-программиста. То тэг забудешь закрыть, то стили отвалятся...
Добро пожаловать в мой телеграмм-канал:
https://tttttt.me/howToLearnIT
Поддержать канал на Boosty:
https://boosty.to/how-to-learn-it
1) Самые частые ошибки в БЭМ
https://…
Добро пожаловать в мой телеграмм-канал:
https://tttttt.me/howToLearnIT
Поддержать канал на Boosty:
https://boosty.to/how-to-learn-it
1) Самые частые ошибки в БЭМ
https://…
Самые частые ошибки в TypeScript
Программисты придумали типы, чтобы из-за них страдать — так описал статическую типизацию мой коллега. Но он не совсем прав. Они сильно упростят работу, если знать, как ими пользоваться.
В этом ролике ошибки, которые часто допускают новички, а потом мучаются из-за них (и/или удаляют TypeScript). Также рассказывается о том, как их избежать.
📺 YouTube
WebDEV #видео #TypeScript
Программисты придумали типы, чтобы из-за них страдать — так описал статическую типизацию мой коллега. Но он не совсем прав. Они сильно упростят работу, если знать, как ими пользоваться.
В этом ролике ошибки, которые часто допускают новички, а потом мучаются из-за них (и/или удаляют TypeScript). Также рассказывается о том, как их избежать.
📺 YouTube
WebDEV #видео #TypeScript
YouTube
Самые частые ошибки в TypeScript
Не надо так делать! Этих ошибок можно избегать при работе с TypeScript.
Не согласны? Пишите в комментариях свои версии 😎
⚡ Мои курсы
Курс по TypeScript: https://purpleschool.ru/course/typescript
Все мои курсы: https://purpleschool.ru
Telegram канал с полезными…
Не согласны? Пишите в комментариях свои версии 😎
⚡ Мои курсы
Курс по TypeScript: https://purpleschool.ru/course/typescript
Все мои курсы: https://purpleschool.ru
Telegram канал с полезными…
CSS animation и keyframes
Я не представляю, насколько уникальным должен быть ваш сайт, чтобы пользователь терпел резкое появление объектов и полное отсутствие анимаций.
Вы можете сделать сайт дружелюбнее, добавив пару строк в CSS код. В этом ролике разбираются подробно CSS-свойства для анимации.
📺 YouTube
WebDEV #видео #CSS
Я не представляю, насколько уникальным должен быть ваш сайт, чтобы пользователь терпел резкое появление объектов и полное отсутствие анимаций.
Вы можете сделать сайт дружелюбнее, добавив пару строк в CSS код. В этом ролике разбираются подробно CSS-свойства для анимации.
📺 YouTube
WebDEV #видео #CSS
YouTube
CSS animation и @keyframes за 12 минут. Подробный разбор CSS свойств анимации + шпаргалка.
CSS animation и @keyframes за 12 минут. Подробный разбор свойств + шпаргалкаКак и CSS свойство плавных переходов transition, о котором мы говорили в предыдущ...
CSS анимация на
Анимации — это хорошо, но их надо уметь применять. Важно делать это так, чтобы они стабильно работали и не мешали пользователю взаимодействовать с сайтом.
Автор создаёт классную анимацию переключения элементов на Slider, которую можно было бы использовать в интернет магазинах.
📺 YouTube
WebDEV #видео #CSS
Анимации — это хорошо, но их надо уметь применять. Важно делать это так, чтобы они стабильно работали и не мешали пользователю взаимодействовать с сайтом.
Автор создаёт классную анимацию переключения элементов на Slider, которую можно было бы использовать в интернет магазинах.
📺 YouTube
WebDEV #видео #CSS
YouTube
CSS анимация + практический пример
Разберем css анимацию, как говорится от нуля до единицы. Обсудим, в каких моментах что лучше использовать. В конце разберем интересный практический пример.
Архив проекта zip:
http://bit.ly/35sQ0VI
Архив проекта rar:
http://bit.ly/2ZU6PYl
Чат верстальщиков:…
Архив проекта zip:
http://bit.ly/35sQ0VI
Архив проекта rar:
http://bit.ly/2ZU6PYl
Чат верстальщиков:…
🧠 БЭМ методология
Блок, Элемент, Модификатор (БЭМ) — самая используемая методология в веб-разработке. Она хороша своим компонентным подходом и позволяет переиспользовать код.
Автор рассказывает про бэм нейминг, про принципы и другую теорию. И, конечно же, показывает всё на практике.
📺 YouTube
WebDEV #видео #web
Блок, Элемент, Модификатор (БЭМ) — самая используемая методология в веб-разработке. Она хороша своим компонентным подходом и позволяет переиспользовать код.
Автор рассказывает про бэм нейминг, про принципы и другую теорию. И, конечно же, показывает всё на практике.
📺 YouTube
WebDEV #видео #web
YouTube
БЭМ методология. Практический пример
Друзья, в видео расскажу о бэм нейминге, объясню принципы, которыми руководствовались ребята при создании данной методологии. Конечно же, теория это круто, но мы с вами пропишем бэм стили для целого лендоса, чтобы закрепить все на практике.
Макет из урока:…
Макет из урока:…
📝 Плагины
VS Code неидеален, но другие разработчики делают его лучше, создавая разные плагины для этой IDE. Можно сравнить Python с его кучей библиотек.
Автор делится плагинами, которые сам использует для веб разработки. Ещё более интересные варианты предлагают зрители в комментариях.
📺 YouTube
WebDEV #видео #Python #web
VS Code неидеален, но другие разработчики делают его лучше, создавая разные плагины для этой IDE. Можно сравнить Python с его кучей библиотек.
Автор делится плагинами, которые сам использует для веб разработки. Ещё более интересные варианты предлагают зрители в комментариях.
📺 YouTube
WebDEV #видео #Python #web
YouTube
VS Code топ-10 плагины которые обязательно нужны. LiveServer, Html css support
Сегодня мы поговорим про VS code плагины самый популярный редактор кода. Visual Studio code не зря имеет такую популярность, так как плагины и расширения могут дать вам автоматизацию процесса и ускорение разработки в разы. VScode расширения обязательно нужны…