Свежие ресурсы для веб-дизайнеров и разработчиков (май 2021 г.)

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

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

ЗАМЕТКИ
Notea – это автономное веб-приложение для создания заметок, которое можно установить на вашем собственном сервере с помощью Docker. Вы можете использовать его для написания и публикации практически любого типа контента, такого как документация, вики, блоги и даже информационные бюллетени с красивой типографикой.
HTTPDump
Этот инструмент предоставляет уникальный URL-адрес, по которому мы можем имитировать ответ, выгружать данные по HTTP-запросу и отображать их в удобной для человека форме. Это полезно для тестирования интеграции сторонних API или Webhooks.
Slidev
Фреймворк для слайдов, созданный для разработчиков. Он похож на PowerPoint или Google Slides, где вы можете создавать слайды презентации, за исключением того, что он также имеет функции, которые оценят разработчики, такие как возможность встраивать фрагменты кода, интерактивные компоненты и редактор кода в реальном времени.
Культовый
Огромная коллекция бесплатных иконок, которые вы можете использовать на своем веб-сайте и в своих приложениях. Он содержит значки из многих категорий, включая стрелки, папки, файлы, бизнес, финансы и многие другие.
Иконуар
Еще один веб-сайт, на котором вы можете найти хорошую коллекцию иконок для ваших веб-проектов или проектов по дизайну приложений. На момент написания он содержал более 900 иконок в SVG. Это открытый исходный код, полностью бесплатный и без каких-либо ограничений.
ZX
ZX – это инициатива Google, которая поможет вам более удобно создавать сценарии с библиотеками JavaScript и Node.js. Он предоставляет оболочки для Node child_process, избегает аргументов и разумных значений по умолчанию, что позволяет вам быть более продуктивным при написании сценариев вместо настройки конфигураций библиотеки.
Игровая площадка macOS
Реплика настольного пользовательского интерфейса macOS, созданная с использованием React.js, Redux и TailwindCSS. Хороший источник, если вы хотите покопаться в интерфейсной разработке и отточить свои навыки работы со стеками.
RustDesk
Клиент удаленного рабочего стола, созданный с Ржавчина. Это бесплатно и с открытым исходным кодом. Вы можете настроить его на своем собственном сервере, чтобы иметь контроль над всеми данными. Это хорошая альтернатива TeamViewer и AnyDesk.
WebDev для начинающих
Учебная программа, предоставляемая Azure Cloud Advocates в Microsoft, включает уроки, упражнения и тесты по основам HTML, CSS и JavaScript. Отличный ресурс для всех, кто только начинает заниматься веб-разработкой.
Экстракт ванили
Инструмент, позволяющий по-новому взглянуть на создание CSS для вашего приложения JavaScript. Вы можете использовать TypeScript для создания ваших CSS-селекторов, переменных, тем и т. Д., А также для создания статического файла CSS при сборке. Он работает с любыми интерфейсными фреймворками, включая webpack, esbuild и Vite.
CSSHell
На этом сайте собраны типичные ошибки CSS; вы узнаете, почему определенные способы написания CSS являются ошибкой, а также покажете, как их исправить. Это отличный ресурс для оттачивания ваших навыков CSS.
Рецепты кукловода
Puppeteer – отличный инструмент для тестирования производительности вашего сайта. Но иногда может быть не так очевидно, как нам начать. В этой статье Адди Османи – один из инженеров Google Chrome – делится некоторыми удобными рецептами кода, которые вы можете скопировать и повторно использовать, чтобы начать профилирование производительности вашего веб-сайта с помощью Puppeteer.
Кретес
Kretes предоставляет согласованную среду для разработки приложений с помощью TypeScript, инструментов сборки и глубокой интеграции с редактором кода Visual Studio. Этот инструмент позволяет повысить производительность при запуске разработки приложений.
Устойчивый к отклонению
Библиотека PHP для обработки настраиваемых уведомлений об отклонении в области администрирования WordPress. Он оптимизирует вызов базы данных под капотом и совместим с настройкой WordPress Multisite из коробки. В целом это удобная библиотека PHP для разработчиков плагинов WordPress.
BrandBird
BrandBird поможет вам создать идеальный образ для вашего сайта. Это полезный инструмент, позволяющий убедиться, что ваш бренд хорошо выглядит в социальных сетях, и поможет избежать неудобной автоматической обрезки при публикации в социальных сетях, таких как Twitter. Вы можете установить фон, радиус границы, тени и некоторые другие элементы изображения.
Стили Bumbag
Коллекция UI React и ReactNative составные части. Он настраивается, компонуется и доступен прямо из коробки. Эта библиотека позволяет быстро создавать приложения, работающие на разных платформах.
Схема валидатора
Онлайн-инструмент для проверки структуры схемы на веб-сайте. Он совместим с несколькими спецификациями, включая JSON-LD, RDFa и Microdata. Он отобразит эти данные и покажет, определяет ли он синтаксическую ошибку.
TypeSense
TypeSense – это инструмент, предназначенный для повышения производительности и точности поиска за счет допуска опечаток, настраиваемого ранжирования, синонимов, группировки и многого другого. Его легко настроить и бесплатно, что делает его отличной альтернативой ElasticSearch и Algolia.
MermaidJS
Mermaid.js – это библиотека JavaScript, которая позволяет создавать блок-схемы, диаграммы и другие типы визуализаций, используя только текст и синтаксис кода; это как Markdown для графики. Библиотека предоставляет API для настройки и интеграции. Скорее всего, эта библиотека уже интегрирована в ваш любимый инструмент или приложение; видеть эта страница «Интеграция».
WinterCMS
WinterCMS является форком своего предшественника OctoberCMS, в связи с переключением проекта на проприетарную CMS. WinterCMS наследует функции и гибкость, включая тему и плагины.

Команда также предлагает захватывающий план дальнейшего развития WinterCMS, такой как поддержка Laravel 9 LTS, CSS и пользовательский интерфейс на основе Tailwind, а также интерфейс командной строки для повышения продуктивности разработчиков.