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

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

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

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

Решил для Вас сделать подборку курсов с Udemy, на которые сейчас проходят акции и в ограниченный срок вы можете их забрать себе и изучать в дальнейшем. Если нужна такая рубрика - ставим огонек под постом и делимся с друзьями!

1) Курс Bootstrap 5: полное руководство (шаг за шагом).
2) Создавайте новые и современные адаптивные веб-сайты.
3) Классификатор изображений с Django и React.
4) Современный JavaScript для React JS - ES6.

#Курсы

100 days css - испытайте себя и станьте экспертом CSS за 100 дней. Проявите творческий подход, представьте свой результат и проверьте, что создали другие.

#CSS