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

В то время, как мы используем WSL для запуска консольных приложений, для программирования мы пользуемся редакторами кода и IDE. Они, в свою очередь, требуют наличия исполняемых файлов для интеграции, например, для управления репозиторием, запуска скриптов NPM, установки зависимостей, запуска Language Server’а для лучшего автодополнения и прочее.

В данном посте поговорим про то, как настроить Docker — платформу для исполнения ваших проектов в изолированных окружениях.

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

Недавно Microsoft на своей конференции для разработчиков — Build 2019 — рассказали о будущей версии WSL 2, которая будет напрямую использовать ядро Linux. Что позволит совершать все системные вызовы, делая возможным запуск Docker в WSL.

Когда мы разобрались с терминалом, пора приступить к настройке инструментов, используемых при работе над проектом. Я, в основном, работаю на стеках с PHP и Node.js, поэтому в данном посте рассмотрим их установку и настройку.

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

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

Правильный дизайн проекта сильно влияет на привлечения клиентов. Это гарантирует, что ваши клиенты (и потенциальные клиенты) получат один и тот же опыт от посещения вашего сайта и в конечном итоге закажут ваши услуги. С этим трудно справиться на самом деле, чтобы всем клиентам одинаково был понятен дизайн и всем нравился и не раздражал. Вот почему в сегодняшнем посту мы говорим о проектных аудитах. Они помогают обеспечить, чтобы все было последовательным и точным. Мы обсудим, что именно аудит представляет собой, как проводить и какие результаты ожидать

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

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

Сегодня мы хотим рассказать о вкладках и выпадающим контентом для них, мы давно уже не рассказывали о вкладках, и сегодня настал именно тот день, у нас будет по умолчанию четыре эластичные вкладки которые будут дергаться и подпрыгивать при нажатии, кроме этого внизу будет добавлена панель с выбором цвета для них; после нажатия будет происходить разворот содержания каждой вкладки с эффектом «bounce» с отскоком, что весьма приятно смотрится, весь текст будет содержаться в блоке, который стилизован тенями и создает эффект «вдавленности» в страницу.

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

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