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
Какое свойство в CSS Grid отвечает за одинаковое пространство между элементами вдоль оси строки?
Anonymous Quiz
9%
flex-direction: row
10%
align-items: center
4%
float: align-border
64%
justify-content: space-around
13%
location: divide-equally
Ubuntu Web Remix — альтернатива Chrome OS.

Ubuntu Web Remix. Его начали разрабатывать в начале лета, а сейчас он доступен для загрузки. Основа дистрибутива — Ubuntu. Но разработчик постарался следовать минимализму Chrome OS, упростив интерфейс оригинальной операционной системы. Вместо Google Chrome здесь используется браузер Firefox, несколько веб-приложений из /e/, плюс Anbox, инструмент, который дает возможность запускать Android-приложения на Linux.

Дистрибутив дает возможность установить практически любое приложение для Ubuntu при помощи apt-get, но вот Ubuntu Software Center в этой ОС нет. Вместо этого используется линк на “Open Web Store”, размещенный в таскабре. При клике по ярлыку пользователь попадает на сат, где можно найти набор приложений на все случаи жизни. После загрузки и установки они отображаются в списке приложений ОС.

Для работы каждого из эти веб-приложений используется браузер Firefox. Каждое новое запущенное приложение открывается в новой вкладке.

#инструменты
Quasar - это фреймворк на основе Vue.js с открытым исходным кодом, который позволяет вам как веб-разработчику быстро создавать адаптивные веб-сайты / приложения.

Quasar никак не ограничивает возможности Vue, в нём нет навязанных паттернов и он не тянет за собой тонны зависимостей, по крайней мере поначалу — по умолчанию модули устанавливаются по мере необходимости, но при желании можно загрузить всё и сразу.

При помощи Quasar можно создавать:
- SPA (одностраничное приложение)
- SSR (серверное приложение с рендерингом) (+ необязательная подмена клиента PWA)
- PWA (прогрессивное веб-приложение)
- BEX (расширение для браузера)
- Мобильные приложения (Android, iOS,…) через Cordova или Capacitor
- Многоплатформенные настольные приложения (с использованием Electron)

#vue
Ресурсы для обучения или закрепления знаний по CSS.

1) CSS и CSS3. Свойства для форматирования HTML элементов — Html5Book;
2) Cascading Style Sheets (CSS) — Mozilla (MDN);
3) Справочник по CSS — Webref;
4) Инструменты разработчика Chrome DevTools для просмотра стилей;
5) Вёрстка на Flexbox в CSS. Полный справочник (перевод и оригинал на CSS Tricks);
6) БЭМ Методология;
7) БЭМ для начинающих. Очевидные и неочевидные вопросы верстки.

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

Рейтинг:
— JavaScript (12.4 млн разработчиков)
— Python (9.0 млн разработчиков)
— Java (8.2 млн разработчиков)
— C/C++ (6.3 млн разработчиков)
— PHP (6.1 млн разработчиков)
— C# (6.0 млн разработчиков)
— Swift (2.4 млн разработчиков)
— Kotlin (2.3 млн разработчиков)
— Go (1.5 млн разработчиков)
— Ruby (1.5 млн разработчиков)

#статьи
🔥 Лучшее на канале за последнюю неделю

1) Ресурсы для обучения или закрепления знаний по CSS.
2) Книга "Как создать сайт. Комикс-путеводитель по HTML, CSS и WordPress".
3) Animated Illustrations — коллекция анимированных иллюстраций.
4) Sortable - это библиотека JavaScript для переупорядочиваемых перетаскиваемых списков.
5) Umami - это простая и быстрая альтернатива Google Analytics с открытым исходным кодом для веб-аналитики.

Всем успешной разработки!

#Лучшее
This media is not supported in your browser
VIEW IN TELEGRAM
Profile Card Hover Effect - простая, но интересная реализация отображения информации профиля в виде карточек на чистом CSS.

#html #css
Fluid Framework - это набор клиентских библиотек от Microsoft для распределения и синхронизации общего состояния. Эти библиотеки позволяют нескольким клиентам одновременно создавать и работать с общими структурами данных, используя шаблоны кодирования, аналогичные темы, которые используются для работы с локальными данными.

#typescript
PDF Converter - полезный сервис по работе с PDF материалами. Его главное преимущество в том, что он может работать с большими файлами, больше 100мб. Сжимает и объединяет большое количество файлов.

#инструменты
Code Spell Checker - базовая проверка орфографии, которая хорошо работает с кодом camelCase.
Цель этого средства проверки правописания - помочь выявить распространенные орфографические ошибки, сохраняя при этом низкое количество ложных срабатываний.

#vscode #расширения
Animista - набор готовых решений для создания анимаций на вашем проекте при помощи CSS. Выбираете анимацию, которая понравилась, копируете код себе и добавляем в CSS-файл.

#css
Selectize - это гибрид текстового поля и поля <select>. Он основан на jQuery и полезен для добавления тегов, списков контактов, выбора страны и т.д.

Его размер составляет около 7 КБ (в сжатом виде). Цель состоит в том, чтобы предоставить надежный и удобный пользовательский интерфейс с чистым и мощным API. Поддерживает Bootstrap 2, 3, 4 версии.

#jquery
Evericons - это коллекция из 460+ хорошо продуманных иконок для вашего проекта. Они бесплатны для личного и коммерческого использования.

#Графика
📖 Вы не знаете JS. Замыкания и объекты

Автор: Кайл Симпсон
О книге: 2019 год, 336 страниц, Русский язык, 3.97Mb

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

#книги
DarkModeJS - легкий и кроссбраузерный, помогает автоматически определять время пользователя и переключать тему на темную режим. Кроме того, он весит всего 2,39 КБ (1,05 КБ в сжатом виде) и написан на чистом Javascript, без каких-либо плагинов!

#javascript
Calltoidea - это платформа для дизайнеров, которая может найти подходящие примеры элементов сайта для вдохновение в соответствии с потребностями.

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

#инструменты
Grid Garden — интерактивная игра, где вы напишете CSS-код, чтобы вырастить морковный сад, тем самым познакомитесь с Grid разметкой.

#css
Date-FNS обеспечивает наиболее полный, но простой и последовательный набор инструментов
для манипулирования даты на JavaScript и Node.js.

#javascript #node
Как в СSS указать селектор с атрибутом, чтобы потом его стилизовать на примере поля ввода.
Anonymous Quiz
14%
input(type="text")
7%
input:type(text)
63%
input[type="text"]
8%
input:type["text"]
7%
input[form="text"]
🔥 Лучшее на канале за последнюю неделю

1) Animista - набор готовых решений для создания анимаций на вашем проекте при помощи CSS.
2) Profile Card Hover Effect - простая, но интересная реализация отображения информации профиля в виде карточек на чистом CSS.
3) DarkModeJS - легкий и кроссбраузерный, помогает автоматически определять время пользователя и переключать тему на темную режим. 
4) Evericons - это коллекция из 460+ хорошо продуманных иконок для вашего проекта.
5) Calltoidea - это платформа для дизайнеров, которая может найти подходящие примеры элементов сайта для вдохновение в соответствии с потребностями.

Всем успешной разработки!

#Лучшее
FullPage.js - простая и удобная в использовании библиотека для создания веб-сайтов с полноэкранной прокруткой (также известных, как одностраничные сайты). Она позволяет создавать веб-сайты с полноэкранной прокруткой, а также добавлять горизонтальные ползунки для разделов сайта.

#javascript