WebDEV. Страница 55

UIkit — это легкий и модульный фреймворк для разработки быстрых и мощных веб-интерфейсов.

Он поставляется с широким спектром многоразовых и сочетающихся компонентов. Все UIkit классы с уникальными именами, поэтому они не будут мешать работе других конструкций и расширений, которые используются совместно не вызывая ошибок. Начальные размеры стартуют с 55Kb (js – 33Kb / css – 22Kb).

Демо | GitHub

#css #framework #ui

7 популярных трендов типографики в веб-дизайне сайтов в 2020 году

В настоящее типографика стала неотъемлемым элементом веб-дизайна. В этой статье мы рассмотрим актуальные для данного направления тенденции дизайна, что появились в 2019 и уверенно идут в 2020 год.

Читать статью

#article #design #typography

Spectre.css — лёгкий, отзывчивый и современный CSS фреймворк для ускоренной и расширяемой разработки. Spectre предоставляет базовые стили для шрифтового оформления и элементов, адаптивную систему макетов на основе Flexbox, а также чистые компоненты и утилиты CSS.

Особенности: лёгкий (~ 10 КБ в сжатом виде); эстетически приятные компоненты и цветовая палитра; интуитивно понятный синтаксис; гибкость: JS не требуется.

Демо | GitHub

#css #framework

Clarity — это опенсорсная система дизайна, созданная VMware. Она представляет собой комбинацию из реализации рекомендаций по UX-дизайну, HTML/CSS фреймворка и компонентов для Angular. Clarity даёт разработчику обширный набор высокопроизводительных компонентов с привязкой данных.

Демо | GitHub

#library #angular #ux #design

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

Задумка Svelte в том, что он является лишь инструментов для создания кода. После создания приложения оно может существовать отдельно от Svelte. Фреймворк будет применяться только в случае внесения правок.

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

Демо | GitHub

#framework #react #js #ractive

Numeral.js — это библиотека для удобного форматирования чисел. Numeral.js позволяет задавать число знаков после запятой, символы-разделители для дробной части и групп разрядов, формат представления валют, процентов, времени, аббревиатуры для миллионов, миллиардов, мегабайтов и т.п. Кроме того, можно восстанавливать числовые значения из существующего строкового представления. Библиотека распространяется под лицензией MIT.

Numeral работает в браузерах и под Node.js.

Демо | GitHub

#library #js #nodejs

Как правильно создать страницу ошибки 404

Каждый из нас сталкивался с 404-й ошибкой на сайте и такую страницу хотелось покинуть как можно скорее. Но некоторые компании, интернет-магазины, медиа создают страницы с 404 ответом сервера, которые срочно добавляешь в закладки. Давайте поговорим о том, как добиться такого эффекта и «выжать» из 404 максимум.

Читать статью

#article #error

Поздравляем всех программистов с Новым Годом! Достигайте новых вершин. Желаем вам расти, развиваться и видеть говнокод только на нашем канале Говнокод.

Читайте в новом году наш новый проект:
Daily Coding — это платформа (канал + сайт), которая научит вас программировать лучше и эффективнее.

🥳

5 трендов UI/UX-дизайна в 2020 году

Сегодня почти каждый, кто работает с ПК слышал о UI/UX-дизайне. Они так тесно связаны, что иногда грань между понятиями размывается. Поэтому обычно проектированием интерфейсов занимается один дизайнер и его профессия пишется через слеш.

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

Читать статью

#article #design #trends

PivotTable.js — одна из самых популярных опенсорсных сводных таблиц в сети. Она хорошо известна своей встроенной визуализацией тепловой карты, статистическими агрегациями и драгндроп-функциями.

PivotTable.js предлагает уйму возможностей настройки, но использовать сторонние плагины все равно придется, например, для экспорта в Excel или PDF. Таким образом, потребуется время, чтобы подогнать данный инструмент к требованиям проекта. Но есть и плюс – возможность экспортировать сетку в TSV “из коробки”.

Если вам нужно интегрировать PivotTabl в другие библиотеки, доступны связки для D3, C3, Plotly и Google.

Демо | GitHub

#library #js #table

C3.js — это библиотека для создания диаграмм, которые можно применять в веб-приложениях. Библиотека предоставляет открытые классы для каждого элемента, так что можно настроить функционал и внешний вид полностью “под себя”. Она также предоставляет различные API и колбеки для получения доступа к состоянию диаграммы. С их помощью можно обновить диаграмму даже после того, как она отрендерится.

Демо | GitHub

#js #library #graphic #d3

Да, это npx, а не npm — объясняем разницу

Недавно, когда я начала изучать React, я увидел, что многие люди (включая меня) запутались, увидев npx вместо известного всем npm. Объясняем различия.

Читать статью

#article #js #npm

Wheelnav.js (Wheel navigation JavaScript library) — библиотека на основе SVG для создания анимированного навигационного меню. Она позволяет создавать округлые, табулированные и многие другие форматы меню навигации. Библиотека включает в себя предопределенные CSS-классы, а также поддерживает data-атрибуты HTML5.

Демо | GitHub

#js #nav #slider

Prime NG — это библиотека, включающая в себя обширный набор из более чем 70-ти компонентов пользовательского интерфейса. При этом здесь доступны разные виды их стилизации, например — Material Design и Flat Design. У Prime NG примерно 3.3 тысячи звёзд на GitHub, ей пользуются такие компании, как eBay, Fox, и многие другие. Всё это говорит о том, что данная библиотека достойна внимания тех, кто ищет подходящий набор компонентов для своего проекта.

Демо | GitHub

#library #angular

Интересные новые функции в ES2018

Включая оператор spread в объектах, оператор rest, асинхронную итерацию и многое другое.

Читать статью

#article #js #es2018

Material Components Web — это библиотека, которая разработана командой инженеров и UX-дизайнеров из Google. Входящие в неё компоненты позволяют организовать рабочий процесс, на выходе которого можно ожидать появления привлекательных и функциональных веб-проектов. Эта библиотека заменила библиотеку react-mdl (которая теперь признана устаревшей) и набрала уже около 7 тысяч звёзд на GitHub.

Демо | GitHub

#react #library #ux

Вирусы на сайтах

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

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

Читать статью

#article #security

ItemSlide.js — простой и красивый сенсорный слайдер-карусель.

Инструмент можно настраивать под любые экраны — как удобную "бегущую" строку, так и широкоформатный слайдер.

Демо | GitHub

#js #library #jquery