Закладки Фронт-Эндера

frontend_bookmarks Yoqadi 2 OP

Мои личные закладки musthave ресурсов/сервисов для фронт-энд разработки.
Буду рад Вашим интересным ссылкам (автор подписывается)
Кидать мне: @oxyyyyy
Kanal tili va GEOsi
Rossiya, Rus tili


Muallifga yozish
Kanalning GEOsi
Rossiya
Kanal tili
Rus tili
Toifa
Texnologiyalar
Indeksga qo'shilgan
25.01.2018 17:24
So'nggi yangilash
13.12.2018 02:19
47
obunachilar
~0
1 ta nashr qamrovi
~5
kunlik qamrov
N/A
bir kundagi postlar
N/A
ERR %
0.1
tsitatalash indeksi
So'nggi nashlar
Удалённые
С упоминаниями
Repostlar
Дебажим красиво
#js #other

https://dev.to/wangonya/better-consolelogs-448c
Актуальные gulp, npm модули на 2018 год
Лист полезных в веб-разработке модулей
#plugin #npm #gulp

https://github.com/Pestov/essential-gulp-plugins
Генератор CSS
Генерация градиентов, бордер-радиусов, шумов и теней.
#css

https://www.cssmatic.com/
Топы веб-страниц
Каждый день премия лучшем сайту по результатам голосования.
Отличный источник идей, вдохновления, интересные решения и креативные реализации.
#design #other

https://www.awwwards.com/
Бесплатные PSD макеты для тренировок
Более тысячи бесплатных темплейтов. Дизайны современные, не отстаём от трендов. Разная сложность макетов.
#templates #design

https://freebiesbug.com/psd-freebies/website-template/
История JavaScript в трёх частях
У IT тоже есть своя история. И она бывает намного интереснее, чем кажется на первый взгляд.
Её знание определенно станет твоим козырем.
История JS от Netscape до ES7.
#history

https://habrahabr.ru/company/livetyping/blog/324196/
Гайд на Gulp
Хороший, объемный гайд. В прочем, на CSS-Tricks только годнота.
На английском (Intermediate+)
#guide

https://css-tricks.com/gulp-for-beginners/
input маски
jQuery-зависимый плагин. Подключается быстро, широкая настройка.
#js #plugin

http://igorescobar.github.io/jQuery-Mask-Plugin/
Удаленный обработчик форм
Мощная штука. За три шага создатите форму отправки писем на указаную почту. Очень просто, очень быстро. Работает. Конфигурируется. Сам пользуюсь.

https://formspree.io/
IMG-заглушки
Часто бывает, что в проекте на начальном этапе не даны изображения, иконки. В таком случае я пользуюсь этой фичей: достаточно в пути к изображению (например в атрибуте src тега ) прописать данный путь http://via.placeholder.com/350x150 , где в конце ссылки указать разрешение "заглушки".
Пользуюсь очень часто. Позже очень просто заменить реальными изображениями.
#design

https://placeholder.com/
Гайд на HTML, CSS для самых маленьких
Написаный на доступном языке, хорошо иллюстрированный, стильный гайд с примерами по основам верстки для начинающих.
На английском (Intermediate+)
#guide #begginer

https://internetingishard.com/html-and-css/
Чеклист тру разработчика
Хорошая подсказка для каждого этапа разработки. Возможно, некоторые пункты будут не нужны, но в целом, есть главные моменты и полезные ссылки.
#other

http://webdevchecklist.com/
JS-плагин на круглый, анимированый прогресс-бар
Широкая настройка, простой монтаж. bower, npm.
Сам использовал в проектах, работает безотказно.
#js #plugin

http://kottenator.github.io/jquery-circle-progress/
Необычное dropdown меню (контекстное меню) в стиле material
Три варианта использования - главная навигация на странице (вертикальная, fixed), вспомогательное меню (горизонтальное, fixed) и контекстное dropdown-меню.
Интересный вариант, достаточно юзабельно.
#js #plugin #design

https://codyhouse.co/gem/stretchy-navigation/
JS-плагин на анимированый счетчик
Простой, быстрый счетчик с широкой конфигурацией, красивая анимация. Отсчет в обеих направлениях, доступны методы (старт, пауза, апдейт и т.д.).
Генератор конфигурации и эспорт кода.
#js #plugin

http://inorganik.github.io/countUp.js/
Красивый js-плагин на фон с эффектом плавучих частиц
Широкий спектр конфигураций, экспорт в JSON-конфиг, простой монтаж в проект, индикатор fps в углу (мелочь, а приятно).
Супер залипательно! Рекомендую хотя бы взглянуть.
#js #plugin #animation #design

https://vincentgarreau.com/particles.js/
Симулятор flex-box
Если вы до сих пор не умеете пользоваться flex-box (почему?), этот сайт наглядно покажет работу свойств и выведет HTML и CSS код.
Куда же в эру grid'а без флексбока?)
#css #sandbox

http://flexible-boxes.wstone.io
Очень крутые паттерны для фонов
Мой любимый вариант, когда нужно быстро залить фон чем то красивым и монотонным.
Удобный просмотр паттерна (заливает фон всей страницы выбранным), экспорт в png, поиск, гигантская база.
#css #design

https://www.toptal.com/designers/subtlepatterns/
Генератор и коллекция CSS анимаций
Полезная вещь для изучения, либо генерацию анимаций на CSS. Работа с keyframe, готовые пресеты, максимум кастомизации. Также закладки в аккаунте и, естественно, экспорт кода.
#css #animation #sandbox

http://animista.net/
Отличный сервис работы с иконками.
Огромное количество паков в разных стилях, разные форматы на экспорт.
#css #design #icons

https://www.flaticon.com/