Force.js — это простой способ анимировать скроллинг или другой элемент на странице. Библиотека имеет много различных функций для анимации и пытается использовать CSS-анимации по умолчанию, что очень хорошо, однако, если браузер не поддерживает CSS3, будут использованы средства javascript. Force.js поддерживает даже настолько старые браузеры, которые не поддерживают свойство transition.

Демо | GitHub

#js #css

7 практических советов по улучшению дизайна

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

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

#article #design #web

GraphicsJS — это мощная графическая JavaScript-библиотека с открытым исходным кодом, основанная на технологии SVG (VML для старых версий IE).

Давайте рассмотрим, чем эта библиотека хороша и выделяется среди прочих.

Во-первых, GraphicsJS весит совсем немного и обладает очень гибким JavaScript API. Она предоставляет богатые возможности для форматирования текста, а также виртуальный DOM – независимый от специфики HTML DOM в разных браузерах.

Во-вторых, в отличие от других продуктов AnyChart – JavaScript-библиотек для построения графиков – GraphicsJS бесплатна для использования как в коммерческих, так и в некоммерческих целях.

В-третьих, GraphicsJS обладает кросс-браузерной совместимостью, включая поддержку Internet Explorer 6.0+, Safari 3.0+, Firefox 3.0+, Opera 9.5+. В старых версиях IE библиотека использует VML, во всех остальных браузерах – SVG.

Наконец, GraphicsJS позволяет эффективно комбинировать графику и анимацию.

Демо | GitHub

#js #svg

Bamboo.js — фреймворк для разработки адаптивных веб-приложений, в которых необходимо использовать скользящее меню и фиксированную шапку сайта с возможностью прокрутки контента. Традиционная кнопка раскрывает и скрывает меню навигации. Если окно браузера будет меньше ширины веб-страницы, то меню будет постоянно отображаться с левой стороны.

Демо | GitHub

#js #responsive

Мы запустили новый канало про дизайн.

Если вы интересуетесь UI/UX дизайном, то рекомендуем подписаться на Daily Design 🔥

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

@dailydezign

📖 Fullstack React. Полное руководство по ReactJS
🖋 А. Аккомаззо, 2020

Обновленное, подробное руководство по React. Станьте экспертом ReactJS уже сегодня. Прекратите тратить свое время на запутанные и неполные уроки и книги.

Что вы узнаете?
— Передовые, глубокие знания о том, как работает React
— Полное понимание использования Redux
— Как взаимодействовать с REST, GraphQL и Relay
— Вводные знания React Native
— И многое, многое другое

Скачать книгу | Больше книг

#book #react

🛠 TensorFlow.js — это открытая библиотека для определения, тренировки и развертывания моделей машинного обучения в браузере. Позволяет строить нейронные сети с нуля, используя высокоуровневое API, умеет импортировать переобучать и запускать существующие нейронные сети. Поддерживает WebGL и умеет подключать к работе вычислительные мощности видеокарты.

Демо | GitHub

#tools #js #ai

Redux — это библиотека для JavaScript с открытым исходным кодом, предназначенная для управления состоянием приложения. Чаще всего используется в связке с React или Angular для разработки клиентской части. Содержит ряд инструментов, позволяющих значительно упростить передачу данных хранилища через контекст.

Демо | GitHub

#js #library #react #angular

Упрости свой JavaScript – используй map, reduce и filter

Бросай forEach – открывай новые горизонты! Введение в перебирающие методы массивов, которые должен знать каждый JavaScript разработчик.

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

#article #js #arrays

📖 Изучаем TypeScript 3
🖋 Н. Розенталс, 2019

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

К концу книги вы создадите всеобъемлющее комплексное веб-приложение, которое покажет, как можно объединить в реальном сценарии возможности языка TypeScript, шаблоны проектирования и передовые практики разработки.

💾 Скачать книгу | 📚 Больше книг

#book #ts #js

🛠 Spine.js — небольшой MVC фреймворк, во многом он базируется на Backbone.js API. Веб приложения создаются непосредственно на JavaScript, что дает логическое разделение создаваемого кода и наследование моделей. Фреймворк довольно прост, входной порог невысок. Есть расширение Spine Moblie для работы с приложениями под мобильные устройства. Нет проблем с работой в разных браузерах, поддерживаются все современные. Отметим и очень подробную документацию.

🔍 Демо | 📂 GitHub

#js #framework #mvc

🛠 Polymer.js — библиотека от Google, которая позволяет создавать самодостаточные веб-компоненты, подходящие для многократного использования, которые работают по тому же принципу, что и стандартные HTML-элементы. Пользоваться этими веб-компонентами так же просто, как и обычными HTML-элементами. В репозитории PolymerElements собрано более 100 веб-компонентов, созданных средствами Polymer, представленных в виде самостоятельных репозиториев.

🔍 Демо | 📂 GitHub

#js #webcomponents

📑 Как изменить цвет вкладки для мобильного Chrome

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

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

#article #tips

📑 Как правильно пользоваться консолью JavaScript

Умеешь только в простейшие консольные команды типа console.log? Мы сделаем тебя великим мастером консоли!

Давайте начистоту – как вы дебажите код? Ну не отрицайте, конечно же, логируете сообщения в консоль браузера – все мы так делаем. console.log отлично работает, он быстрый, удобный – но не оптимальный. Раз уж мы идем по легкому пути, давайте делать это с шиком!

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

#article #js #tips

🛠 Iconate.js — это библиотека, которая добавляет красивые анимации к иконкам на вашем сайте. Работает с разными типами шрифтов.

🔍 Демо | 📂 GitHub

#js #animation #icons

📑 Стрелочные функции в JavaScript. Зачем они нужны, когда ими нужно пользоваться?

Одной из самых заметных новшеств современного JavaScript стало появление стрелочных функций.

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

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

#article #js

📖 Git для профессионального программиста
🖋 С. Чакон, Б. Штрауб, 2019

Эта книга представляет собой обновленное руководство по использованию Git в современных условиях. Эффективный и хорошо реализованный контроль версий необходим для любого успешного веб-проекта. Второе издание книги было обновлено для Git-версии 2.0 и уделяет большое внимание GitHub.

💾 Скачать | 📚 Больше книг

#book #git

🛠 Knockout.js — JavaScript каркас веб-приложений, реализующий Model-View-View-Model шаблон. Основными принципами являются: чёткое разделение доменных данных, компонентов отображения и отображаемых данных; наличие чётко определённого слоя специализированного кода, задающего отношение компонентов отображения.

🔍 Демо | 📂 GitHub

#js #framework

📑 Простым языком о ES6

В этой статье мы подробно расскажем вам о 16 основных фишках ECMAScript 6 простым языком с понятными примерами.

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

#article #js #es6

🛠 Yako.js — это миниатюрная библиотека для построения графиков без использования DOM, разработанная для быстрого рендеринга как на клиентской, так и на серверной стороне. Библиотека предназначена для создания простеньких легких SVG-графиков, которые работают гораздо быстрее по сравнению с Highcharts / Flot / D3.

🔍 Демо | 📂 GitHub

#js #charts

🛠 CSS Peek — это полезное расширение для VS Code, которое позволяет добавить опцию "Go to definition" к CSS классам в HTML коде. Кликнув на эту опцию вы сразу перейдете к коду класса. Это невероятно удобная мелочь для веб-разработчиков.

💾 Установить

#tools #vscode