Web Developer Checklist - интересный сервис для веб-разработчика, который поможет по пунктам проверить готовность проекта к запуску. Доступен в виде сайта и расширения. Сервис поможет максимально понять, на сколько ваш сайт готов к аудитории и поисковикам.
#Инструменты
#Инструменты
May 8, 2020
Кто какой язык изучает или уже знает? Можно выбрать несколько вариантов. Свой вариант пишите в чат.
Anonymous Poll
28%
PHP
38%
Python
59%
JavaScript
13%
Java
15%
C++
5%
Go
2%
Ruby
14%
Я не программист
May 8, 2020
TinyPng - сервис для сжатия изображений PNG и JPEG.
В наши дни очень актуально оптимизировать свой сайт. А основную нагрузку несут тяжелые изображения. Чтобы ускорить загрузку веб страницы, необходимо максимально оптимизировать эти изображения.
Как работает TinyPng?
TinyPNG использует умные методы сжатия без потери качества, чтобы уменьшить размер файлов PNG и JPEG. Из-за выборочного уменьшения количества цветов в изображении требуется меньше байтов для хранения данных. Эффект почти невидим, но он очень сильно влияет на размер файла!
В бесплатной версии разрешается загружать до 20 файлов, размером не более 5Мб каждое.
В наши дни очень актуально оптимизировать свой сайт. А основную нагрузку несут тяжелые изображения. Чтобы ускорить загрузку веб страницы, необходимо максимально оптимизировать эти изображения.
Как работает TinyPng?
TinyPNG использует умные методы сжатия без потери качества, чтобы уменьшить размер файлов PNG и JPEG. Из-за выборочного уменьшения количества цветов в изображении требуется меньше байтов для хранения данных. Эффект почти невидим, но он очень сильно влияет на размер файла!
В бесплатной версии разрешается загружать до 20 файлов, размером не более 5Мб каждое.
May 8, 2020
MODX Revolution - по словам разработчиков, это самая быстрая, самая безопасная, масштабируемая и гибкая система управления контентом в мире, идеально подходящая для современных веб-сайтов, которые должны выделяться.
Основные особенности:
— Доступны любые варианты дизайна для "натягивания" на систему. При необходимости можно создавать новые шаблоны и применять их в зависимости от типа добавляемого контента.
— Функция одновременной работы над двумя сайтами. Это особенно удобно при наличии сетки ресурсов.
— Удобный свой синтаксис тегов. Это одно их главных отличий данного инструмента от других CMS с открытым исходным кодом.
— Универсальность. Можно задавать ЧПУ-адреса страниц, все нужные заголовки, описания.
— Удобное использование на хостинге. Перенос на удаленный сервер максимально упрощен.
— Интуитивно понятная панель администрирования, с ней достаточно легко разобраться новичку.
Основные особенности:
— Доступны любые варианты дизайна для "натягивания" на систему. При необходимости можно создавать новые шаблоны и применять их в зависимости от типа добавляемого контента.
— Функция одновременной работы над двумя сайтами. Это особенно удобно при наличии сетки ресурсов.
— Удобный свой синтаксис тегов. Это одно их главных отличий данного инструмента от других CMS с открытым исходным кодом.
— Универсальность. Можно задавать ЧПУ-адреса страниц, все нужные заголовки, описания.
— Удобное использование на хостинге. Перенос на удаленный сервер максимально упрощен.
— Интуитивно понятная панель администрирования, с ней достаточно легко разобраться новичку.
May 9, 2020
Вводим новую рубрику, которая будет выходить по воскресеньям - дайджест лучших постов за неделю. Информация лучшего берется из нашей статистики. Будет полезно тем, кто не успевает отслеживать ленту.
Лучшее за неделю:
1. Wappalyzer - расширение для браузера, которое определит технологический стэк.
2. Web Developer Checklist - интересный сервис для проверки готовности проекта к запуску.
3. October CMS - это бесплатная платформа CMS с открытым исходным кодом, основанная на Laravel PHP Framework .
4. WhatFont - расширение для браузера Chrome, чтобы определить шрифт сайта.
5. TinyPng - сервис для сжатия изображений PNG и JPEG.
Давайте наберем 50 огоньков под постом чтобы понимать, на сколько вам интересен такой формат, а лучше 100). Всем спасибо за участие и хорошие отзывы о нашей работе.
#Лучшее
Лучшее за неделю:
1. Wappalyzer - расширение для браузера, которое определит технологический стэк.
2. Web Developer Checklist - интересный сервис для проверки готовности проекта к запуску.
3. October CMS - это бесплатная платформа CMS с открытым исходным кодом, основанная на Laravel PHP Framework .
4. WhatFont - расширение для браузера Chrome, чтобы определить шрифт сайта.
5. TinyPng - сервис для сжатия изображений PNG и JPEG.
Давайте наберем 50 огоньков под постом чтобы понимать, на сколько вам интересен такой формат, а лучше 100). Всем спасибо за участие и хорошие отзывы о нашей работе.
#Лучшее
May 10, 2020
RemoveBg - классный сервис для удаления фона с изображения. Благодаря умному искусственному интеллекту RemoveBg, Вы можете сократить время редактирования и получить больше удовольствия от работы с постами!
Так же для более удобной работы, вы можете интегрировать этот сервис в свои графические редакторы.
#Инструменты
Так же для более удобной работы, вы можете интегрировать этот сервис в свои графические редакторы.
#Инструменты
May 11, 2020
Directus - современная Headless CMS (система, которая отображает контент через RESTful API) с открытым исходным кодом, который объединяет пользовательские базы данных SQL с динамическим API и предоставляет интуитивно понятное приложение администратора для управления его содержимым.
Основные возможности:
— Настройка библиотек, инструментов и стека, которые лучше всего подходят для вашего проекта.
— Полностью бесплатное программное обеспечение премиум-класса, без ограничений функций или лицензий, для личного или коммерческого использования.
— Directus отражает именно то, что находится в вашей базе данных SQL. Нет проприетарной модели данных или хранилища контента.
— Система компоновки сетки позволяет упорядочивать, группировать и позиционировать поля, создавая индивидуальные формы для всех ваших сборов данных. Вы можете выбрать из более чем 50 различных полевых интерфейсов.
— Управление многоязычным контентом в любом количестве языков.
#CMS
Основные возможности:
— Настройка библиотек, инструментов и стека, которые лучше всего подходят для вашего проекта.
— Полностью бесплатное программное обеспечение премиум-класса, без ограничений функций или лицензий, для личного или коммерческого использования.
— Directus отражает именно то, что находится в вашей базе данных SQL. Нет проприетарной модели данных или хранилища контента.
— Система компоновки сетки позволяет упорядочивать, группировать и позиционировать поля, создавая индивидуальные формы для всех ваших сборов данных. Вы можете выбрать из более чем 50 различных полевых интерфейсов.
— Управление многоязычным контентом в любом количестве языков.
#CMS
May 11, 2020
Что такое Канбан и для чего он нужен.
Канбан — система организации производства и снабжения, позволяющая реализовать принцип «точно в срок». Грубо говоря, это процесс, где нет простоя незавершенных задач.
Основные возможности использования канбана
— Уменьшение времени прохождения каждой конкретной задачи, а в последствии, выполнение всего проекта в целом;
— Быстрая обратная связь от отдела тестирования;
— Раннее вовлечение тестировщиков, благодаря чему при запуске проекта становится меньше проблем;
— Высокое вовлечение команды в процесс разработки;
— Выполнение проекта в срок за счёт уменьшения времени простоев и автоматизации интеграции;
— Высокое качество продукта.
Канбан — система организации производства и снабжения, позволяющая реализовать принцип «точно в срок». Грубо говоря, это процесс, где нет простоя незавершенных задач.
Основные возможности использования канбана
— Уменьшение времени прохождения каждой конкретной задачи, а в последствии, выполнение всего проекта в целом;
— Быстрая обратная связь от отдела тестирования;
— Раннее вовлечение тестировщиков, благодаря чему при запуске проекта становится меньше проблем;
— Высокое вовлечение команды в процесс разработки;
— Выполнение проекта в срок за счёт уменьшения времени простоев и автоматизации интеграции;
— Высокое качество продукта.
May 12, 2020
jQuery Mask Plugin - плагин на jquery для создания масок в полях формы. Поддерживает огромное кол-во различных типов полей, от банковских карт до ip адресов.
Особенности плагина:
— Легкий (~ 2kb минимизированный, ~ 1kb gziped).
— Встроенная поддержка динамически добавляемых элементов.
— Маски для любого элемента HTML (больше не нужно маскировать на стороне сервера)
— Поддержка нотации HTML (data-mask, data-mask-recursive, data-mask-clearifnotmatch).
— Необязательные цифры.
— Рекурсивные цифры.
— Резервные цифры.
— Расширенная инициализация маски.
— Расширенные обратные вызовы.
— Смена маски на лету.
— Удаление маски.
— Полная настройка.
— Совместимость с React / UMD / Zepto.js / Angular.JS.
— Поддержка заполнителя HTML5.
—Очистка полей, если они не соответствует формату.
#jQuery
Особенности плагина:
— Легкий (~ 2kb минимизированный, ~ 1kb gziped).
— Встроенная поддержка динамически добавляемых элементов.
— Маски для любого элемента HTML (больше не нужно маскировать на стороне сервера)
— Поддержка нотации HTML (data-mask, data-mask-recursive, data-mask-clearifnotmatch).
— Необязательные цифры.
— Рекурсивные цифры.
— Резервные цифры.
— Расширенная инициализация маски.
— Расширенные обратные вызовы.
— Смена маски на лету.
— Удаление маски.
— Полная настройка.
— Совместимость с React / UMD / Zepto.js / Angular.JS.
— Поддержка заполнителя HTML5.
—Очистка полей, если они не соответствует формату.
#jQuery
May 12, 2020
Важно Ваше мнение! Что вам больше всего интересно было бы читать на канале и на что больше обратить внимание?
Anonymous Poll
56%
Веб-инструменты
47%
Уроки разработки
16%
Обзоры CMS
21%
Шаблоны и плагины для CMS
30%
HTML шаблоны
42%
Библиотеки и фреймворки
48%
Советы и статьи
43%
Обучающие курсы
May 12, 2020
Leno - Mobile App Landing Page
Leno - это бесплатный HTML-шаблон целевой страницы мобильного приложения в темном стиле, созданный с помощью Bootstrap 4, чтобы помочь вам создать запоминающийся сайт-визитку для вашего приложения и превратить посетителей в пользователей.
#Шаблоны
Leno - это бесплатный HTML-шаблон целевой страницы мобильного приложения в темном стиле, созданный с помощью Bootstrap 4, чтобы помочь вам создать запоминающийся сайт-визитку для вашего приложения и превратить посетителей в пользователей.
#Шаблоны
May 12, 2020
LanguageTool - расширение для браузера Chrome, которое корректирует грамматику и орфографию. Находит множество ошибок, которые не могут обнаружить простые средства проверки орфографии.
Основные возможности:
- Не требует регистрации
- Поддерживает свыше 25 языков (см. ниже)
- Работает практически на всех сайтах, включая Gmail, Facebook, twitter
#Инструменты
Основные возможности:
- Не требует регистрации
- Поддерживает свыше 25 языков (см. ниже)
- Работает практически на всех сайтах, включая Gmail, Facebook, twitter
#Инструменты
May 13, 2020
Что такое API и для чего он необходим?
API (Application Programming Interface) - это составляющая часть сервера, которая получает запросы и отправляет ответы. То есть, если говорить простым языком, API - это некая часть приложения, которая при взаимодействии с ней выдает или получает какой то набор данных.
Для чего необходим API вашему приложению?
Если вы занимаетесь разработкой приложений под различные платформы, то API это незаменимый помощник. По сути, вам не нужно создавать под каждую платформу отдельную базу данных, а все общение будет происходить через API.
Благодаря API идет четкое разделение на Фронтенд и Бэкенд.
Фронтенд — аппаратная часть сервиса со стороны пользовательского интерфейса клиента.
Бэкенд — является частью программно-аппаратной частью всего сервиса.
#Статьи
API (Application Programming Interface) - это составляющая часть сервера, которая получает запросы и отправляет ответы. То есть, если говорить простым языком, API - это некая часть приложения, которая при взаимодействии с ней выдает или получает какой то набор данных.
Для чего необходим API вашему приложению?
Если вы занимаетесь разработкой приложений под различные платформы, то API это незаменимый помощник. По сути, вам не нужно создавать под каждую платформу отдельную базу данных, а все общение будет происходить через API.
Благодаря API идет четкое разделение на Фронтенд и Бэкенд.
Фронтенд — аппаратная часть сервиса со стороны пользовательского интерфейса клиента.
Бэкенд — является частью программно-аппаратной частью всего сервиса.
#Статьи
May 13, 2020
May 13, 2020
Блоки в форме плитки на чистом CSS
Очень часто возникает такая ситуация, что когда размещаешь несколько блоков в один ряд с разным контентом, то эти блоки становятся не на одном уровне и создается впечатление, что они прыгают и образуется пустая видимая область между рядами. Эту проблему можно решить очень простым способом при помощи CSS. Мы создадим вывод постов в виде плиток. Плиточный вид создаст ощущение целостности страницы.
Очень часто возникает такая ситуация, что когда размещаешь несколько блоков в один ряд с разным контентом, то эти блоки становятся не на одном уровне и создается впечатление, что они прыгают и образуется пустая видимая область между рядами. Эту проблему можно решить очень простым способом при помощи CSS. Мы создадим вывод постов в виде плиток. Плиточный вид создаст ощущение целостности страницы.
May 14, 2020
May 14, 2020
The Front-End Checklist - замечательный помощник фронтэндеру при разработке.
Все элементы во внешнем контрольном списке являются обязательными для большинства проектов, но некоторые элементы могут быть пропущены или не обязательны (в случае административного веб-приложения вам может не понадобиться, например, RSS-лента).
Сервис использует 3 уровня гибкости:
1) Зеленый круг означает, что элемент рекомендуется, но может быть опущен в некоторых конкретных ситуациях.
2) Желтый треугольник означает, что этот пункт настоятельно рекомендуется и может быть опущен в некоторых действительно особых случаях. Некоторые элементы, если будут пропущены, то могут иметь плохие последствия с точки зрения производительности или SEO.
3) Красный квадрат означает, что элемент не может быть опущен по любой причине. Вы можете вызвать дисфункцию на своей странице или проблемы с доступностью или SEO. Приоритет тестирования должен быть в первую очередь для этих элементов.
#Инструменты
Все элементы во внешнем контрольном списке являются обязательными для большинства проектов, но некоторые элементы могут быть пропущены или не обязательны (в случае административного веб-приложения вам может не понадобиться, например, RSS-лента).
Сервис использует 3 уровня гибкости:
1) Зеленый круг означает, что элемент рекомендуется, но может быть опущен в некоторых конкретных ситуациях.
2) Желтый треугольник означает, что этот пункт настоятельно рекомендуется и может быть опущен в некоторых действительно особых случаях. Некоторые элементы, если будут пропущены, то могут иметь плохие последствия с точки зрения производительности или SEO.
3) Красный квадрат означает, что элемент не может быть опущен по любой причине. Вы можете вызвать дисфункцию на своей странице или проблемы с доступностью или SEO. Приоритет тестирования должен быть в первую очередь для этих элементов.
#Инструменты
May 15, 2020
Easy - это бесплатный шаблон Bootstrap 4, подходящий для SaaS или целевых страниц приложения. Он построен с учетом выдающихся особенностей, которые будут эффективно привлекать и конвертировать посетителей. В частности, такие эффекты как анимации при прокрутке, классная таблица цен, интеграция видео, плавный, потрясающий слайдер и многое другое! Проверьте это и не забудьте поделиться этим инновационным шаблоном!
А еще хотим поделиться с Вами нашим каналом по веб-интерфейсам. Создан он больше для вдохновения @interfacer
#Шаблоны
А еще хотим поделиться с Вами нашим каналом по веб-интерфейсам. Создан он больше для вдохновения @interfacer
#Шаблоны
May 15, 2020
SEO META в 1 клик - расширение для браузера Chrome, которое отображает все метаданные и основную информацию SEO по сайту.
Основные возможности:
— Определяет заголовок и его длину,
— Определяет описание и его длину,
— URL (и метаканонический URL тоже),
— Мета-роботы,
— Отображение заголовков в порядке их появления в HTML (H1, H2, H3, H4, H5 и H6),
— количество изображений с и без ALT,
— количество ссылок (внутренних, уникальных, ...)
— График социальных данных
— Robots.txt и sitemap.xml
#Инструменты
Основные возможности:
— Определяет заголовок и его длину,
— Определяет описание и его длину,
— URL (и метаканонический URL тоже),
— Мета-роботы,
— Отображение заголовков в порядке их появления в HTML (H1, H2, H3, H4, H5 и H6),
— количество изображений с и без ALT,
— количество ссылок (внутренних, уникальных, ...)
— График социальных данных
— Robots.txt и sitemap.xml
#Инструменты
May 16, 2020
Лучшее на канале за последнюю неделю
1) RemoveBg - классный сервис для удаления фона с изображения.
2) LanguageTool - расширение для браузера Chrome, которое корректирует грамматику и орфографию.
3) Easy - бесплатный шаблон Bootstrap 4
4) Javascript. Основы ES6 - курс от CodeDojo
5) The Front-End Checklist - замечательный помощник фронтэндеру при разработке.
Всем успешной разработки!
#Лучшее
1) RemoveBg - классный сервис для удаления фона с изображения.
2) LanguageTool - расширение для браузера Chrome, которое корректирует грамматику и орфографию.
3) Easy - бесплатный шаблон Bootstrap 4
4) Javascript. Основы ES6 - курс от CodeDojo
5) The Front-End Checklist - замечательный помощник фронтэндеру при разработке.
Всем успешной разработки!
#Лучшее
May 17, 2020
Magic CSS3 Animations — это библиотека крутых кросс-браузерных анимаций, которые можно использовать на своем проекте в качестве привлечения внимания на каком либо моменте.
Как установить Magic CSS3 Animations.
Шаг 1.
Скачиваем архив с библиотекой. Загружаем его на свой проект и подключаем файл перед закрывающим тегом
Шаг 2.
Для необходимого блока добавляем класс основной класс
#Библиотека
Как установить Magic CSS3 Animations.
Шаг 1.
Скачиваем архив с библиотекой. Загружаем его на свой проект и подключаем файл перед закрывающим тегом
</head><link rel="stylesheet" href="yourpath/magic.min.css">Шаг 2.
Для необходимого блока добавляем класс основной класс
magictime и класс самой анимации, например puffIn. В итоге должно получится так<div class="magictime puffIn">Ваш блок</div>#Библиотека
May 18, 2020