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
Please open Telegram to view this post
VIEW IN TELEGRAM
Recharts: простая визуализация данных для React 👩‍💻

Recharts — библиотека, которая поможет добавить графики и диаграммы в ваш проект. Легко подключается, настраивается и отлично работает с React. Хотите показать тренды, сравнить показатели или сделать крутой аналитический дашборд? С этой библиотекой всё это можно сделать за пару строк кода. Выбирайте линейные графики, круговые диаграммы, гистограммы или что-то своё.

👀 Посмотреть библиотеку

#инструменты
Please open Telegram to view this post
VIEW IN TELEGRAM
Тренируем регулярки на Regex101

На Regex101 вы сможете тестировать регулярные выражения в реальном времени, разбирать их структуру с подробными объяснениями каждой части, а также находить и исправлять ошибки благодаря встроенным подсказкам. Ресурс поддерживает синтаксисы для популярных языков программирования, таких как JavaScript, Python и PHP, и позволяет легко проверять ваши регулярки на примерах. Это идеальный инструмент как для новичков, так и для опытных разработчиков, желающих упростить работу с текстовыми шаблонами.

👀 Перейти к сервису

#тренажёр
Please open Telegram to view this post
VIEW IN TELEGRAM
Вопрос с собеседования:

В чем разница между HTML и XHTML?

— XHTML - это приложение XML, которое является довольно строгим языком с угловыми скобками.
— HTML - это приложение SGML, которое является гораздо менее строгим языком с угловой скобкой.
— (XML также является применением SGML.)

При написании кода XHTML придерживаются того же синтаксиса, который характерен для HTML. При этом разница между HTML и XHTML состоит в наборе некоторых обязательных правил.

Правила XHTML следующие.
// Все теги и их атрибуты должны быть набраны в нижнем регистре (строчными символами).
// Значения любых атрибутов необходимо заключать в кавычки.
// Требуется закрывать все теги, даже такие, которым не сопоставлен закрывающий тег.
// Должна соблюдаться правильная вложенность тегов.
// Нельзя использовать сокращенные атрибуты тегов.
// Вместо атрибута name следует указывать id.
// Следует определять DTD (document type definition, описание типа документа) с помощью элемента DOCTYPE.

Подробнее с примерами:
http://htmlbook.ru/xhtml/sintaksis-xhtml

Ставь ❤️если знаешь ответ
Если нет — ставь 💅
Please open Telegram to view this post
VIEW IN TELEGRAM
Codepip

Сборник мини-игр для изучения веб-технологий: Flexbox, Grid, CSS-анимации и многое другое.

👀 Потыкать игры

#тренажёры
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
Современный JavaScript. От новичка до профи [2024]

Курс. По мере прохождения вы погрузитесь в интереснейший мир JavaScript. Обучение начинается с основных концепций языка и продолжается передовыми техниками программирования.

Вне зависимости от уровня подготовки, курс обеспечит вас всей самой необходимой информацией для успешного освоения JS.

👀 Посмотреть курс

#js
Please open Telegram to view this post
VIEW IN TELEGRAM
Вопрос с собеседования:

Какое будет поведение ```<script async defer>```?

При одновременном указании async и defer в современных браузерах будет использован только async, в IE9- – только defer (не понимает async).

Подробнее

Ставь ❤️если знаешь ответ
Если нет — ставь 💅

#web
Please open Telegram to view this post
VIEW IN TELEGRAM
TsParticles

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

👀 Посмотреть

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Вопрос с собеседования:

Какие элементы в HTML5 могут иметь aria атрибут?

Любой элемент

Ставь ❤️если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
SVGOMG — онлайн-инструмент для оптимизации SVG

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

👀 Посмотреть

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Вопрос с собеседования:

Чистые и нечистые функции, что это и какие отличия между ними?

Чистая функция - Возвращает результат, основанный только на своих аргументах, без зависимости от внешних переменных или состояния программы.
Не имеет побочных эффектов, то есть не изменяет состояние программы или какие-либо внешние переменные

Нечистая функция - Изменяет состояние программы или какие-либо внешние переменные.
Может иметь побочные эффекты, такие как вывод в консоль, изменение DOM, отправка HTTP-запросов и т. д.


Ставь ❤️если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Fuse.js

Легкий и мощный инструмент для поиска по тексту. Поддерживает "нечеткий" поиск. Работает без внешних зависимостей.

👀 Посмотреть

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Вопрос с собеседования:

Какие элементы в HTML5 могут иметь aria атрибут?

Любой элемент)

Ставь ❤️если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Генератор CSS Grid для быстрого создания адаптивных сеток

Инструмент, который упрощает работу с CSS Grid. Рисуйте сетку прямо в браузере, настраивайте её поведение и получайте готовый код. Подходит как для обучения, так и для ускорения разработки.

👀 Посмотреть

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Вопрос с собеседования:

Что такое имутабельность в JS?

Иммутабельность в JavaScript означает, что данные не могут быть изменены после их создания.

Ставь ❤️если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Вопрос с собеседования:

Что такое замыкания?

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


Ставь ❤️если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Immer — библиотека для работы с состоянием

Позволяет писать чистый и лаконичный код при работе с вложенными объектами. С помощью Immer можно обновлять состояние как будто напрямую, но в итоге получать неизменяемые данные. Работает через "проекты" (draft), которые можно безопасно менять, а библиотека сама позаботится о создании нового объекта.

Отлично интегрируется с Redux Toolkit и позволяет избавиться от громоздких .map и ...spread конструкций, ускоряя разработку и делая код чище.

👀 Посмотреть

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Вопрос с собеседования:

Как объединить массивы?

1 - Можно использовать метод concat()
2 - Можно использовать spread оператор


Ставь ❤️если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Вопрос с собеседования:

Что такое NaN?

NaN (Not a Number): это значение, получаемое в результате выполнения числовой операции над нечисловым значением.

Ставь ❤️если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Игра-тренажёр по Flexbox

Раз уж вам так понравилась предыдущая игра — держите ещё одну, но уже по флексам. Суть игры — расставить пушки так, чтобы кружочки-злодеи не прошли по карте

👀 Расставить пушки

Coderoll | Frontend #css