CodeRoll | Frontend
4.98K subscribers
1.6K photos
73 videos
1 file
913 links
— Лучшее для разработчика и дизайнера / IT инструменты, курсы и книги
— Веб-разработка на JS, HTML, CSS, React, Vue,Angular

Купить рекламу: https://telega.in/c/coderoll

Чат: https://t.me/coderoll_chat

По всем вопросам пишите сюда - @yankovsky_ads
Download Telegram
Callback

Простое и забавное объяснение с иллюстрациями callback функций.

Если не до конца разобрались в этой теме, то рекомендуем почитать эту статью!

#js
noUiSlider

JavaScript-библиотека для создания слайдера диапазона с поддержкой для сенсорных экранов.

Слайдер адаптирован под разные расширения экрана и протестирован на кроссбраузерность.

А еще, эта библиотека мало весит!

#инструменты
Поздравляем вас с наступающим 2022 годом!

Пусть в наступающем году будут мегабайты хорошего настроения, гигабайты везения и терабайты успеха! 

Желаем продвижения в карьере, удачных ревью кода, поменьше багов и повыше зарплат!

До 9 января канал будет на каникулах.
Встретимся в новом году!
🎉1
Хостинг

В статье представлен список хостинг провайдеров и условия для бесплатного размещения вашего сайта.

Да-да! Помимо Github Pages можно еще где-то размещать свои сайты!

#статьи
transform

Очень подробная статья о свойстве transform и всех его значениях. 

Много визуального и интерактивного контента, чтобы подвигать, попереворачивать элементы и разобраться, как работает rotate, translate и другие значения этого свойства!

#css
Метод flatMap

Данный метод был представлен в стандарте ES10 (ECMAScript2019).

flatMap сначала применяет функцию к каждому элементу, а затем полученный результат преобразует в плоскую структуру.

Сравнение с методом map и примеры использования подробно в статье!

#js
Обучение Git 

Ресурс для интерактивного обучения использованию Git.

На практике изучите основные команды и попробуете те, которые еще никогда не использовали в своих проектах. Например, cherry-pick!

#инструменты
Собеседование React

Знание одного из фреймворков сейчас является обязательным требованием для frontend-разработчика при трудоустройстве почти в каждую компанию.

И React пока лидер по популярности!

Для вас очень полезный ресурс с вопросами и ответами для подготовки.

#react
О Node.js

Интересно, а в курсе ли вы вообще, то такое Node.js?

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

Специально на эту тему статья.

#nodejs
Неоморфизм

Если вы как разработчик, никогда не слышали о неоморфизме, то немного расскажем, что это такое.

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

В статье рассказывается как создать такой эффект с помощью CSS. Там и демо с примерами есть, и ссылки на генераторы CSS кода.

Может пригодиться вам для дизайна ваших проектов. Да и вообще всегда полезно расширять кругозор!

#дизайн
Ревью кода

Ревью кода является важной составляющей для создания качественного продукта, поскольку позволяет отлавливать ошибки на всех фазах разработки.

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

#статьи
Flexbox

Бесплатный курс по Flexbox.

На курсе вы изучите все основы по флексам, как центрировать элементы с помощью этой технологии, как использовать flex-grow, flex-shrink и flex-basis на практике. Там есть парочку интересных примеров, которые вам пригодятся!

Курс всего состоит из 20 уроков и доступен после подписки по e-mail.

#css
👍1
Массивы

Массивы предоставляют кучу возможностей для обработки данных.

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

Читать статью

#js
👍5
Справочник для разработчика

Документация по HTML, CSS, JavaScript на русском языке!
На этом ресурсе вы также найдете информацию о Docker, Webpack, Node.js и многом другом.

Еще хочется отметить материалы на тему операционных систем, веб-серверах и о том как устроена сеть. Это очень полезно знать разработчику!

Смотреть справочник.

#инструменты
👍15
Перерисовка компонента

Постоянная перерисовка компонентов нагружает приложение. 
Не все разработчики знают, как предотвратить нежелательную перерисовку.
И оказывается для этого есть немало способов!

5 из них вы найдете в статье.

Читать статью

#react
👍7
CMS на Node.js

Список лучших CMS на Node.js с описанием преимуществ и какую функциональность они предоставляют.

Читать статью

#nodejs
👍6
Векторные логотипы

Ресурс на котором собраны логотипы различных мировых брендов в формате SVG.
Там можно найти логотипы и на IT тематику. Например, php, vue, node.js и другие.
Или же иконки популярных соцсетей: facebook, instagram, vkontakte.

Сохраняйте в закладки!

Ссылка на ресурс

#дизайн
👍8
Скелетные шаблоны

Скелетные шаблоны - что это? Их еще называют заполнителями контента, превью интерфейса.
Скорее всего, вы уже видели их раньше, так как они используются некоторыми крупными компаниями, такими, как YouTube, Facebook и Medium.
Главное назначение этих заполнителей - скрывать еще не подгрузившийся контент.

Более подробное объяснение и примеры, как создать такие шаблоны читайте в статье.

Читать статью

#статьи
🔥4
CSS 2022

Предсказания автора о том, что же стоит ожидать для CSS в 2022 году.

@layer, функции color-mix(), color-contrast(), :has()... Все это вам не знакомо?

Для знакомства советуем почитать данную статью. Там еще много всего интересного!

Читать статью

#css
👍5
Чистый код

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

Читать статью

#js
👍8
survey.js

JavaScript библиотека для создания различных опросов, анкет и тестов, которые легко можно встроить в ваше приложение.
Доступны версии библиотеки для Angular, jQuery, React и Vue.js.

Смотреть

#инструменты
👍6👎1