Библиотека фронтендера | Frontend, JS, JavaScript, React.js, Angular.js, Vue.js
23.2K subscribers
2.2K photos
120 videos
38 files
4.61K links
Все самое полезное для фронтенда в одном канале.

По рекламе: @proglib_adv

Учиться у нас: https://proglib.io/w/77178ed4

Наши каналы: https://yangx.top/proglibrary/9197

РКН: https://gosuslugi.ru/snet/67a5b6884689c2151c820bb4
加入频道
В поисках идеального JavaScript-фреймворка

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

- Грамотные абстракции, в которых легко разобраться
- Доступ к ключевым точкам логики
- Удобная и производительная работа с DOM
- Ослабление связи между JavaScript логикой и HTML селекторами
- Интуитивное управление зависимостями
- Удобные шаблоны
- Грамотный API
- Модульная структура и возможность брать только нужные компоненты
- Простота тестирования
- Хорошая документация

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

Читать: https://prglb.ru/2jbkz

#frameworks
Архитектура фронтенда: Средний круг (Библиотеки и сервисы)

Вспомогательным модулям и библиотекам часто не уделяется столько внимания, как фреймворкам - а зря! Их вклад в архитектуру приложения нельзя недооценивать.

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

Читать: https://prglb.ru/23ntf

Автор статьи утверждает, что все инструменты, находящиеся на этом уровне, должны иметь максимально независимую модульную структуру.

#frontend #architecture
10 отличных JavaScript библиотек на 2020 год

Самые востребованные и эффективные JS-библиотеки, которые вам точно пригодятся.

Смотреть и использовать: https://prglb.ru/3a5qx

#tools #library #digest
Архитектура фронтенда: Малый круг (Визуальные элементы и компоненты)

UI-компоненты - это лицо и начинка любого фронтенда. Есть разные способы для их создания, но общий подход к организации остается неизменным - от малого к большему.

Система компонентов должна быть гибкой и легкой в использовании.

Читать: https://prglb.ru/39mbr

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

#frontend #architecture
Суперменом может стать каждый: разделяем дизайн и данные в React

Забавный рассказ с интерактивными иллюстрациями (и соответствующим кодом) о ментальной модели, которая поможет новичкам в React запомнить, как правильно с ним работать.

Читать: https://proglib.io/p/supermenom-mozhet-stat-kazhdyy-razdelyaem-dizayn-i-dannye-v-react-2020-04-08

#react #frameworks #beginners
Архитектура фронтенда: Стратегия и метрики автоматизированного тестирования

Тесты - очень важная часть системы, и у них есть свое место в архитектуре. Вопрос "писать или не писать тесты?" обычно не стоит - но всегда есть вопрос "какие тесты и как много?"

Читать: https://prglb.ru/23o12

Статья расскажет, об основных подходах к тестированию, важности автоматизации и почему 100% покрытия - это не хорошо.

#testing #architecture
Тесты, которые должен писать разработчик

Обзор видов тестов, которые должны писать именно разработчики, с описанием:

👉 Модульные тесты (Unit)
👉 Системные тесты
👉 Интеграционные тесты (API)
👉 Функциональные тесты (E2E)
👉 Снэпшоты
👉 Проверка работоспособности (Smoke test)
👉 Учебные тесты
👉 Регрессионные тесты (Проблемные)
👉 Приемочные тесты (Story test)
👉 Проверка на уязвимости (Pentest)
👉 Фаззинг тесты (Random)

Подробно: https://prglb.ru/qe3x
Хочешь стать программистом, но нет времени смотреть часовые видео на YouTube и мониторить туториалы? Ты можешь обойтись без всего этого с нашим курсом по Frontend-разработке!

Вот что ждет тебя на курсе:
- Изучение основ HTML и CSS
- Знакомство с синтаксисом языка
- Разработка собственного сайта
- Отработка знаний написания кода в тренажерах
- Проверка домашних работ
- Поддержка ментора
- Сообщество студентов

Всего за шесть месяцев мы сделаем из вас хорошего Junior-специалиста со знаниями JavaScript, React, Node.JS, Vue и Angular.

⚡️Давно откладывали обучение? Самое лучшее время – сейчас! Получите курс со скидкой: https://clc.to/WKnEwQ
Архитектура фронтенда: Оболочка

В этой статье речь пойдет о типах приложений и выборе модели рендеринга.

В современных условиях границы между десктопными, мобильными и веб-приложениями стираются. Мы уже можем использовать для них одни и те же инструменты. Но стоит ли это делать?

Раньше все приложения рендерились на сервере, потом появилась клиентская модель. Но теперь мы снова переходим на сервер - почему?

Подробнее: https://prglb.ru/34eb7

#frontend #architecture #bestpractices
Создание ПК программы на JavaScript

Постройте полноценное desktop-приложение с помощью библиотеки Electron JS.

Ссылка: https://prglb.ru/1403p

#video #electron #desktop
Стрелочные функции в JavaScript. Зачем они нужны, когда ими нужно пользоваться?

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

Читать: https://prglb.ru/1c1sa

#javascript #core
Самый лучший способ изучения фронтенд-разработки

Руководство к действию для начинающих.

Подробно: https://prglb.ru/3ljgc

#beginners
Канал, на котором выкладывают задачки по JavaScript разного уровня и решение на них.

Грех не подписаться на такой полезный канал 👉🏻 @js_test
SEO в React-приложениях: трудности и решения

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

Но в React-проектах с этим есть сложности:

☹️ Единый урл для всех страниц
☹️ Единые мета-теги для все страниц
☹️ Нет контента без работающего JS в браузере

Сообщество давно разработало инструменты для решения этих проблем даже без SSR:

☺️ React Router для изменения урлов
☺️ React Helmet для обновления метаданных
☺️ А также - грамотное использование Google Search Console!

Подробнее: https://prglb.ru/4h5bg
Во время самоизоляции многие работодатели наконец-то признали, что удалённые работники вполне эффективны. Пути назад нет — бизнес идёт туда, где ему выгодно, и скоро всё меньше рабочих мест будут требовать физического присутствия работника в офисе.

Мы предлагаем встретить эти перемены во всеоружии. С 14 по 16 апреля GeekBrains проводит серию бесплатных вебинаров «Все об удалёнке: как работать эффективно и зарабатывать»

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

Переходите по ссылке, чтобы узнать больше и записаться: https://proglib.io/w/5d56bc63
15 важных методов DOM

Все, что нужно, чтобы манипулировать элементами в браузере.

Читать: https://prglb.ru/54q7b

#javascript #browser
Учи JavaScript правильно. Путеводитель для растерявшихся

Заблудились в JavaScript? Это совсем неудивительно. Вам нужен гид, который расскажет, что на самом деле важно. У нас как раз есть такой.

https://proglib.io/p/learn-javascript

#javascript #beginners
GitHub авторизация на Node.js

Реализуем авторизацию через github-аккаунт с помощью Node.js и Express

Подробнее: https://prglb.ru/535ln

#node #api
Пожалуйста, отложите TypeScript ненадолго

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

Читать: https://prglb.ru/21rg9

#typescript
CSS псевдокласс :is() — как и где его использовать

Новый CSS псевдокласс :is() — это отличный способ выбирать нужные элементы, при этом не писать много лишнего кода, сохранять код читабельным.

Читать: https://prglb.ru/4y1wz

#css