Live Server - расширение для Visual Studio Code, которое позволяет запускать локальный сервер разработки для тестирования кода. В нем есть функция перезагрузки в режиме реального времени как для статических, так и для динамических веб-страниц.

В этом расширении можно настроить номер порта и браузер по умолчанию, оно поддерживает HTTPS и прокси.

#Расширения #vscode

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

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

#Инструменты

Gulp 4 - Актуальное и исчерпывающее руководство для самых маленьких

Это обновлённый и переработанный видео-курс Gulp 4, в котором Вы детально разберёте работу с Gulp, ознакомитесь с новыми методами построения задач (тасков), узнаете, какими способами можно установить, настроить Gulp и как с его помощью автоматизировать и ускорить процесс веб-разработки. Знакомство с возможностями инструмента будет на реальном примере и будет создано удобное рабочее окружение для HTML вёрстки от А до Я. 

#Курсы

Выберите правильный ответ ниже. Этот и другие вопросы по разработке можно всегда обсудить в нашем чате.

RegEx 101 - бесплатный отладчик регулярных выражений на основе PCRE для различных языков программирования с объяснением в реальном времени, обнаружением ошибок и выделением.

#Инструменты

Eva Icons - это пакет из более чем 480 красиво оформленных иконок с открытым исходным кодом для пользовательского интерфейса. Кроме того, иконки поддерживают 4 типа анимации: zoom, pulse, shake и  flip. 

Загрузите на компьютер, чтобы использовать их в своих веб-проектах, iOS и Android. Иконки представлены также в двух визуальных видах: Fill и Outline и в нескольких форматах, в том числе png, svg, font, Sketch.

#Графика

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

Swiper поддерживает работу с React и Vue.

#JavaScript #React #Vue

Editor X — новый веб-конструктор, который включает в себе передовые технологии для верстки и прототипирования Вашего проекта.

#Инструменты.

Marko - декларативный язык на основе HTML, который позволяет делать создание динамических и реактивных пользовательских интерфейсов веб-приложений увлекательным.

Пример кода:

class {
onCreate() {
this.state = { count:0 };
}
increment() {
this.state.count++;
}
}

<div.count>
${state.count}
</div>
<button.example-button on-click('increment')>
Click me!
</button>

#HTML #JavaScript

Sapiens — большая бесплатная библиотека иллюстраций людей для Вашего проекта с прекрасным инструментом кастомизации любой части тела и экспортом в SVG/PNG.

#Графика

PerfectPixel — расширение для Google Chrome, которое позволяет «наложить» на веб-страницу полупрозрачную сетку и сверять по ней заданные расстояния.

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

👨‍💻 P.S. Всех с днем программиста!

#Расширения #Chrome

Be1 - комплекс инструментов для продвижения сайтов. Среди них есть инструмент «Расширение семантического ядра», который позволяет ввести URL своего сайта, а также до 10 сайтов конкурентов. Инструмент покажет запросы, по которым ранжируются конкуренты. Результат с полученными запросами можно скачать в csv. 

#Инструменты

🔥 Лучшее на канале за последнюю неделю

1) Gulp 4 - Актуальное и исчерпывающее руководство для самых маленьких.
2) Swiper - современный бесплатный мобильный сенсорный слайдер.
3) Eva Icons - это пакет из более чем 480 красиво оформленных иконок с открытым исходным кодом для пользовательского интерфейса.
4) Sapiens — большая бесплатная библиотека иллюстраций людей для Вашего проекта.
5) Editor X — новый веб-конструктор, который включает в себе передовые технологии для верстки и прототипирования.

Рекомендуйте наш канал, по возможности, друзьям. Всем успешной разработки!

#Лучшее

Идеи для проектов на JavaScript. Часть 2.

1. Приложение для прогноза погоды
При создании этого приложения, помимо обычного набора технологий, используется Dark Sky API — для сбора информации о погоде. Так что это отличная возможность научиться взаимодействовать с API.

2. Поиск книг
Приложение для поиска книги по запросу (название, автор и т. д.). Список книг отображается со всей информацией о них. Можно использовать Google Books API.

3. Карточная игра
Игра на время, в которой после клика по карточке, появляется изображение. Необходимо найти такую же картинку среди других карточек.

4. Список дел
Классическое приложение, где пользователь может записать все мысли, задачи и цели, чтобы не забыть.

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

#Статьи

Project Filter Tabs - простая реализация фильтрации контента по вкладкам на HTML и CSS без использования JavaScript.

#HTML #CSS

CSS Values ​​- это простое одностраничное веб-приложение (SPA), которое позволяет искать практически любое свойство CSS и получать простой список возможных значений.

#CSS

Фича 3. Гибкая настройка border-radius

При помощи свойства border-radius можно закруглять углы рамок. Однако, мало кому известно о возможности задавать значения закругления отдельно по оси X и Y.

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

.wrapper { border-radius: 30px 30px 30px 30px / 50px 50px 50px 50px; }

#Фичи #CSS

Spacedesk позволяет вам преобразовать iPad, старый ноутбук с Wi-Fi, или даже телефон во второй монитор для вашей основной машины.

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

#Инструменты

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

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

#Статьи #CSS

Chakra UI - это простая, модульная и доступная библиотека компонентов, которая дает вам все строительные блоки, необходимые для создания ваших приложений React.

#React