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

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

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

По всем вопросам пишите сюда - @yankovsky_ads
Download Telegram
Продуктивность

Продуктивность не сводится к количеству часов, которые вы проводите за компьютером.

Напротив, продуктивность - это про то, как за меньшее время выполнять больше работы.

В статье вы найдете 6 советов как ее повысить.

#статьи
CSS переменные

Как обходиться без препроцессоров и переиспользовать повторяющиеся стили?
Воспользуйтесь переменными CSS.

О синтаксисе и о том, как их использовать подробно в статье.

#css
Сравнение дат

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

В примерах учитываются нюансы, которые вы могли не брать во внимание раньше. 
Например, часовой пояс.

#javascript
Mo.js

JavaScript библиотека для создания анимации. 
С помощью нее можно создавать интересные анимации текста.

Очень проста в работе и подходит для всех типов устройств.

#инструменты
Фильтрация

В статье показано, как просто реализовать фильтрацию категорий в React с помощью useState. 

#react
Организация кода Node.js приложений

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

#nodjs
Дизайнерские способности

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

Определи располагается ли элемент четко по центру!

#дизайн
Сherry-pick

Слышали о такой команде git? 
Если еще нет, то советуем данную статью к прочтению.

А если это не в новинку для вас, вспомнить - лишним не будет!

#статьи
Flexbox vs. Grid

Часто бывают ситуации, когда сомневаешься, что лучше использовать Flexbox или Grid.

Небольшая статья, разъясняющая какая технология для чего больше подходит.

#css
Алгоритмы в JavaScript

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

Автор постарался изложить все доступно и с иллюстрациями.

#js
Каталог библиотек

Крутой ресурс на котором представлен каталог библиотек для различных эффектов и UI элементов.
 
Все разделено по категориям. Кликая на одну из которых, вам предлагается список возможных вариантов библиотек.
Очень много библиотек для React и Vue.

#инструменты
Redux VS Context API

Сравнение двух вариантов управления состоянием, их преимущества и недостатки, случаи использования каждого из них.
Обо всем этом подробно в статье.

#react
Сервер на Node.js

Из этой статьи вы узнаете как за несколько шагов создать сервер, а ещё напишите код для обработки запросов и отправки ответов.

Если вы знакомы только с фронтендом, то это хороший шанс стать чуть ближе к бэкэнду!

#nodejs
UI/UX советы

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

Очень полезно ознакомиться и попробовать применить в своих личных проектах.

#дизайн
README.md

Всегда игнорировали файл README?
А это очень полезная вещь, которую стоит добавлять в свои проекты!

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

#статьи
:root

Вы когда-то слышали о псевдоклассе :root или использовали его в работе?
Возможно, вы найдете ему применение в своих проектах!

О том, для чего он нужен и в чем его польза подробно в статье.

#css
map

В статье представлен небольшой обзор метода map и 6 примеров его использования, которые пригодятся на практике.

#js
atropos js

Это JavaScript библиотека для создания параллакс эффекта по наведению на элемент. Параллакс работает как для событий мыши, так и для сенсорных экранов.

От создателей Swiper.

#инструменты
React App на GitHub Pages

Создали React приложение, но не получается опубликовать его на GitHub Pages?

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

#react
React и Node.js

Что может быть лучше фронтенда и бэкэнда на одном языке?
Это упрощает процесс разработки приложения!

Если интересно, как комбинировать React с Node.js, то рекомендуем к прочтению данную статью.

#nodejs #react
OwlLabs

Яркий дизайн лэндинга для устройства Owl Labs в формате Figma.

Уровень сложности: простой
Ссылка: https://www.figma.com/file/PFvW6PZlbfBAanaS8uYzOY/Owl-Labs?node-id=2%3A8

#дизайн