ДНК на CSS

Этот CodePen-проект демонстрирует возможности не только CSS, но и Pug — препроцессора для HTML. Просто посмотрите как лаконично и просто реализована вёрстка с использованием препроцессора:

https://tprg.ru/Embi

#codepen #css #pug

«Не отписывайся, золотой, всей семье твоей удача будет и здоровье»

​Создание компонента с множественным выбором

Здесь вы узнаете, как создать отзывчивый, адаптивный и доступный компонент с множественным выбором, который можно использовать для сортировки и фильтрации пользовательского интерфейса:

https://tprg.ru/vXkN

Что почитать. Александр Симович, Слободан Стоянович «Бессерверные приложения на JavaScript» (2020)

Сегодня предлагаем вам познакомиться с книгой, которая научит вас создавать различные приложения на практических примерах. Вы разработаете проект пиццерии, без использования серверной части поддерживающий онлайн-меню приема заказов, платежи и другие процессы и функции.

Книга доступна онлайн, поэтому оставляем ссылку на неё:

https://tprg.ru/pSQu

#книги #javascript

​Расширения и инструменты Chrome и VS Code для бэкенд-разработчиков

Небольшая подборка расширений и инструментов, которые пригодятся бэкенд-разработчикам, а также других полезных материалов, которые точно не будут лишними:

https://tprg.ru/kLN4

#бэкенд

Как и когда заставить компонент React делать повторный рендеринг

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

В статье как раз разбирается этот вопрос:

https://tprg.ru/LPfF

#фронтенд #react

А на следующей карточке что?

​Создание приложения записи заметок в реальном времени на JavaScript

В этой статье вы создадите приложение не просто на JavaScript, но также используя другие инструменты, такие как Supabase, сервис Auth, а также механизм Realtime.

Подробнее:

https://tprg.ru/VtTY

#javascript

​Углубленный взгляд на процесс компоновки webpack

Автор статьи делится особенностями работы webpack, в частности подробностями его внутренней работы, чтобы ваше взаимодействие с ним стало более осознанным и эффективным.

Здесь используются диаграммы и различные примеры, наглядно показывающие, как всё происходит «под капотом»:

https://tprg.ru/fJsV

#webpack

Игра с голосовым управлением на React и Phaser

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

Подробнее:

https://tprg.ru/WD1b

​10 способов работы с файлами в Интернете

В этой статье рассмотрены все методы, которые позволяют работать с файлами в Интернете. Вы узнаете обо всех интерфейсах для работы с файлами, способах загрузки и скачивания файлов и много другом.

Подробнее:

https://tprg.ru/OI9K

Особенно сильно контузит на моменте с коллбеками

​Понимание min-content, max-content и fit-content в CSS

В CSS мы определяем размер элемента, используя значения длины в px, em, процентах и других. Хотя типы значений длины и процентного значения часто используются для макетов веб-страниц, они не всегда идеально подходят. Иногда правильнее будет применить что-то из min-content, max-content и fit-content.

В этой статье рассказали, как правильно понимать и использовать эти ключевые слова:

https://tprg.ru/q1D9

#фронтенд #css

​Первый взгляд на Svelte

Опытный разработчик решил создать свой собственный веб-сайт и для его создания решил использовать новый для себя инструмент — Svelte. В этой статье он поделился своими впечатлениями от него и разобрал основные возможности:

https://tprg.ru/f5EV

#svelte

​HTML5-игры за 5 минут

Задумывались когда-нибудь, как устроены современные браузерные игры? Это краткое введение в HTML5-игры, которое расскажет вам на чём их пишут, как распространяют, где разработчики берут текстуры, модели и звуки.

Подробнее:

https://tprg.ru/3XJN

#html

Выбор между NodeJS и Python для вашего следующего серверного приложения

При выборе языка программирования для серверной разработки ваш выбор определяет, как продукт будет работать, масштабироваться и соответствовать требованиям пользователей. Одной из наиболее распространённых дилемм является Node.js против Python. Эти два варианта чрезвычайно популярны и имеют свои плюсы и минусы.

В этой статье сравнили их, разобрали преимущества и недостатки, чтобы вы могли подобрать наилучшее решение для вашего следующего проекта:

https://tprg.ru/3dpV

#бэкенд #nodejs #python

​Глубокое погружение в object-fit и background-size в CSS

В этой статье Ахмад Шадид рассказал, как работает object-fit и background-size, когда мы можем их использовать, а когда — нет и почему, а также некоторые практические примеры использования и рекомендации. 

Подробнее:

https://tprg.ru/miIh

#фронтенд #css

​Делаем поиск, как у MDN

Недавно у MDN появился новый (крутой, по заявлению разработчиков) поиск. Благодаря имеющимся данным и реверс-инжинирнгу, автору этой статьи удалось реализовать аналогичный на React и TypeScript.

Подробности в статье:

https://tprg.ru/5bUL

​И в номинации «Лучший костюм на Хэллоуин» побеждает девушка из отдела веб-разработки с костюмом веб-сервера:

Лава-лампа на HTML и CSS

Симпатичный проект, реализующий анимированную лавовую лампу с использованием HTML и CSS. Каждая капля — это отдельный HTML-элемент.

Посмотреть подробнее можно здесь:

https://tprg.ru/sDUt

#codepen