Тудушка с хранением данных в localstorage
Создание списка дел — один из первых вызовов с которыми сталкивается начинающий разработчик. Подойти к созданию такого простого инструмента можно по-разному.
В этой статье предлагается способ, где хранение данных будет осуществляться в
https://tprg.ru/enqf
Создание списка дел — один из первых вызовов с которыми сталкивается начинающий разработчик. Подойти к созданию такого простого инструмента можно по-разному.
В этой статье предлагается способ, где хранение данных будет осуществляться в
localstorage, что позволит не потерять данные, хотя бы при перезагрузке страницы:https://tprg.ru/enqf
🔥8💩7👍3😱3
Как освоить бэкенд-разработку в 2022 году: дорожная карта
Про фронтенд мы рассказали тут. Теперь пришла поговорить о том, что актуально сегодня в бэкенд-разработке, на что стоит обратить внимание, а что уже морально устарело и не стоит вашего времени.
Подробности:
https://tprg.ru/wbUF
#бэкенд
Про фронтенд мы рассказали тут. Теперь пришла поговорить о том, что актуально сегодня в бэкенд-разработке, на что стоит обратить внимание, а что уже морально устарело и не стоит вашего времени.
Подробности:
https://tprg.ru/wbUF
#бэкенд
🔥11👍5😱4
Как движки JavaScript достигают высокой производительности
Будучи динамически типизированным, с несколькими типами ложных значений, без достаточной оптимизации готового кода, JavaScript остаётся быстрым и производительным. Как ему это удаётся?
В этой статье рассмотрели несколько методов, которые различные движки JavaScript используют для достижения хорошей производительности во время выполнения:
https://tprg.ru/WdA3
#javascript
Будучи динамически типизированным, с несколькими типами ложных значений, без достаточной оптимизации готового кода, JavaScript остаётся быстрым и производительным. Как ему это удаётся?
В этой статье рассмотрели несколько методов, которые различные движки JavaScript используют для достижения хорошей производительности во время выполнения:
https://tprg.ru/WdA3
#javascript
👍9😱4💩3🔥1
Введение в Redux Toolkit для начинающих
В этой статье вы узнаете о Redux Toolkit, инструменте, который решает проблему управления состояниями множества компонентов React. Redux предоставляет централизованное «хранилище», в котором хранятся все состояния в приложении. Каждый компонент в приложении может получить доступ к этому хранилищу без необходимости передавать свойства в дереве компонентов.
Подробнее:
https://tprg.ru/f95k
#redux
В этой статье вы узнаете о Redux Toolkit, инструменте, который решает проблему управления состояниями множества компонентов React. Redux предоставляет централизованное «хранилище», в котором хранятся все состояния в приложении. Каждый компонент в приложении может получить доступ к этому хранилищу без необходимости передавать свойства в дереве компонентов.
Подробнее:
https://tprg.ru/f95k
#redux
👍10
Создание компонента React с помощью TDD
Подход TDD, или Test-Driven Development, предполагает очень короткий цикл разработки, который повторяется до достижения необходимого результата путём постоянного проведения тестов кода и внесения необходимых изменений.
В этой статье автор решил воспользоваться этим методом разработки для создания компонента React. Вот, что у него вышло:
https://tprg.ru/9TA0
#react
Подход TDD, или Test-Driven Development, предполагает очень короткий цикл разработки, который повторяется до достижения необходимого результата путём постоянного проведения тестов кода и внесения необходимых изменений.
В этой статье автор решил воспользоваться этим методом разработки для создания компонента React. Вот, что у него вышло:
https://tprg.ru/9TA0
#react
🔥3👍2😁1
Топ 10 JavaScript-фреймворков и библиотек в 2022
В этой статье вы не найдёте Angular, Vue или React, потому что о них и так слышали все. Мы решили сосредоточиться на менее известных, но полезных решениях. Там также представлены плюсы и минусы каждого продукта, взятые из отзывов реальных пользователей.
Подробнее:
https://tprg.ru/8ZXr
#javascript
В этой статье вы не найдёте Angular, Vue или React, потому что о них и так слышали все. Мы решили сосредоточиться на менее известных, но полезных решениях. Там также представлены плюсы и минусы каждого продукта, взятые из отзывов реальных пользователей.
Подробнее:
https://tprg.ru/8ZXr
#javascript
👍4😱1
Создание бесконечного цикла фонового изображения CSS
Бесконечная прокрутка изображений по-разному используется в приложениях и на веб-сайтах, которыми мы пользуемся ежедневно. В этой статье вы изучите два способа создания эффекта бесконечной прокрутки с использованием фоновых изображений с некоторой базовой HTML-разметкой и CSS:
https://tprg.ru/0aGD
#css
Бесконечная прокрутка изображений по-разному используется в приложениях и на веб-сайтах, которыми мы пользуемся ежедневно. В этой статье вы изучите два способа создания эффекта бесконечной прокрутки с использованием фоновых изображений с некоторой базовой HTML-разметкой и CSS:
https://tprg.ru/0aGD
#css
👍12🔥5
Reacting in Svelte — понимание компонентов в svelte на основе знаний React
Svelte — относительной молодой фреймворк, который достаточно быстро обретает преданных поклонников. Одним из них стал автор статьи, который даже перевёл свой сайт-портфолио с React на Svelte. О том почему он это сделал, читайте в статье:
https://tprg.ru/LGyA
#svelte
Svelte — относительной молодой фреймворк, который достаточно быстро обретает преданных поклонников. Одним из них стал автор статьи, который даже перевёл свой сайт-портфолио с React на Svelte. О том почему он это сделал, читайте в статье:
https://tprg.ru/LGyA
#svelte
👍16👎2💩2🔥1😱1
Что такое JSON — Введение
JSON, или JavaScript Object Notation — текстовый формат обмена данными, основанный на JavaScript, но применяемый и при работе с другими языками программирования. В этой статье разбираемся, как он работает и зачем нужен:
https://tprg.ru/zyEj
#json
JSON, или JavaScript Object Notation — текстовый формат обмена данными, основанный на JavaScript, но применяемый и при работе с другими языками программирования. В этой статье разбираемся, как он работает и зачем нужен:
https://tprg.ru/zyEj
#json
👍40😁14🤩6🔥5👏1🤮1
Распространённые ошибки при написании CSS с помощью БЭМ
При разработке программного обеспечения важно согласовать руководящие принципы, технологии и методологии. Одной из таких методологий является БЭМ. Если вы хотите работать в команде, применяющей методологию БЭМ, то стоит убедиться, что вы всё делаете правильно.
Какие ошибки могут возникнуть, узнаете здесь:
https://tprg.ru/f2Uy
#css
При разработке программного обеспечения важно согласовать руководящие принципы, технологии и методологии. Одной из таких методологий является БЭМ. Если вы хотите работать в команде, применяющей методологию БЭМ, то стоит убедиться, что вы всё делаете правильно.
Какие ошибки могут возникнуть, узнаете здесь:
https://tprg.ru/f2Uy
#css
👍21💩1
Интерактивное руководство по созданию @keyframe анимации
Анимация с помощью
В этой статье вы углубитесь в ключевые кадры CSS. Вы узнаете, как они работают, и посмотрите, как создать с их помощью довольно шикарную анимацию.
https://tprg.ru/lqWA
#css
Анимация с помощью
@keyframes — это один из самых мощных и универсальных инструментов в CSS, и мы можем использовать его для самых разных отличных вещей. В этой статье вы углубитесь в ключевые кадры CSS. Вы узнаете, как они работают, и посмотрите, как создать с их помощью довольно шикарную анимацию.
https://tprg.ru/lqWA
#css
🔥19👍2😱2
JavaScript: разрабатываем приложение для записи звука
Небольшой туториал по созданию приложения на JavaScript, которое сможет записывать звук, сохранять его, а также воспроизводить запись. В общем говоря, это веб-версия диктофона.
Хотите научиться также? Тогда открывайте статью:
https://tprg.ru/nrOW
#javascript
Небольшой туториал по созданию приложения на JavaScript, которое сможет записывать звук, сохранять его, а также воспроизводить запись. В общем говоря, это веб-версия диктофона.
Хотите научиться также? Тогда открывайте статью:
https://tprg.ru/nrOW
#javascript
👍13😁3🎉2
Безопасный CSS
Безопасный CSS — это набор сниппетов, которые могут помочь вам в написании защищённого CSS. Другими словами, у вас будет меньше проблем в будущем при их использовании.
Подробнее в статье:
https://tprg.ru/Io0E
#css
Безопасный CSS — это набор сниппетов, которые могут помочь вам в написании защищённого CSS. Другими словами, у вас будет меньше проблем в будущем при их использовании.
Подробнее в статье:
https://tprg.ru/Io0E
#css
👍28❤4🔥4😱1
Как создать расширение для браузера
Здесь вы найдёте подробную инструкцию с развёрнутыми пояснениями каждого пункта по созданию расширения сразу для нескольких браузеров. В качестве примера в статье предлагается сделать расширение для Reddit.
https://tprg.ru/N4Ji
Здесь вы найдёте подробную инструкцию с развёрнутыми пояснениями каждого пункта по созданию расширения сразу для нескольких браузеров. В качестве примера в статье предлагается сделать расширение для Reddit.
https://tprg.ru/N4Ji
👍19🎉1
Metho: безопасное добавление сверхспособностей в JS
Автор статьи предлагает интересную систему, которая позволяет легко и безопасно добавлять методы в виде динамических свойств к любому объекту. В теории это может добавить уникальный синтаксис JS, который будет удобнее, чем привычный сегодня:
https://dev.to/jonrandy/introducing-metho-safely-adding-superpowers-to-js-1lj
#javascript
Автор статьи предлагает интересную систему, которая позволяет легко и безопасно добавлять методы в виде динамических свойств к любому объекту. В теории это может добавить уникальный синтаксис JS, который будет удобнее, чем привычный сегодня:
https://dev.to/jonrandy/introducing-metho-safely-adding-superpowers-to-js-1lj
#javascript
👍14😱9👎3🤩1
Попап вместо селекта: новые HTML-элементы наконец-то решат старую проблему
В своём новом видео Вадим Макеев рассказал про новый способ создания выпадающего меню, который пока что находится на стадии разработки, но уже сейчас его можно «пощупать». Он решит проблему стилизации и большого количества JS-кода в случае создания кастомного кроссбраузерного селектора.
Подробнее:
https://www.youtube.com/watch?v=mG0VFWCTnZI
#видео #фронтенд #html
В своём новом видео Вадим Макеев рассказал про новый способ создания выпадающего меню, который пока что находится на стадии разработки, но уже сейчас его можно «пощупать». Он решит проблему стилизации и большого количества JS-кода в случае создания кастомного кроссбраузерного селектора.
Подробнее:
https://www.youtube.com/watch?v=mG0VFWCTnZI
#видео #фронтенд #html
YouTube
🥨 Попап вместо селекта: ✨новые HTML-элементы✨ наконец-то решат старую проблему
00:00 Интро
00:22 В чём проблема?
01:50 Описание задачи
02:34 Недостатки селекта
04:36 Что нам нужно
05:22 Open UI
07:20 Попап вместо селекта
09:46 Стилизация попапа
11:45 Доступность и фокус
13:52 Кроссбраузерность
15:41 Выводы
16:59 Аутро
Нравится? Становитесь…
00:22 В чём проблема?
01:50 Описание задачи
02:34 Недостатки селекта
04:36 Что нам нужно
05:22 Open UI
07:20 Попап вместо селекта
09:46 Стилизация попапа
11:45 Доступность и фокус
13:52 Кроссбраузерность
15:41 Выводы
16:59 Аутро
Нравится? Становитесь…
👍23
Добавление Vite в ваше существующее веб-приложение
Vite — это более современная альтернатива таким сборщикам, как Webpack или другим подобным. При этом он имеет более понятную настройку конфигурации, но также отлично работает и с параметрами по умолчанию.
В этой статье вы узнаете, как без особого труда перевести ваш существующий проект на Vite:
https://css-tricks.com/adding-vite-to-your-existing-web-app/
#vite #webpack
Vite — это более современная альтернатива таким сборщикам, как Webpack или другим подобным. При этом он имеет более понятную настройку конфигурации, но также отлично работает и с параметрами по умолчанию.
В этой статье вы узнаете, как без особого труда перевести ваш существующий проект на Vite:
https://css-tricks.com/adding-vite-to-your-existing-web-app/
#vite #webpack
👍17🤩2