Front-end дайджест #35: Hermes, JS-in-CSS и VS Code на стероидах
В выпуске: начинаем использовать СSS Custom Properties, в очередной раз упрощаем React приложения вместе с Hook’ами, а также смотрим доклады фронтенд-конференций за июнь/июль (поверьте их было много)!
CSS, CSS in JS и наоборот
JS-in-CSS — пишем CSS на JS вместе с Houdini CSS
11 JavaScript Animation Libraries For 2019 — подборка полезных JS-библиотек для анимаций
Статьи от CSS Tricks:
- Restricting a (pseudo) element to its parent’s border-box
- Animating with Clip-Path — анимируем изменение формы объекта при помощи clip-path
- Color Inputs: A Deep Dive into Cross-Browser Differences — глубокий разбор стилевых свойств color input в различных браузерах
- Position Sticky and Table Headers — делаем фиксированным заголовок таблицы вместе с position sticky
- Managing Multiple Backgrounds with Custom Properties — пример применения CSS Custom Properties для мультибэкграунда
- Multi-Line Truncation with Pure CSS — выставляем количество линий в тексте на чистом CSS
Статьи от Smashing Magazine:
- CSS Custom Properties In The Cascade — делаем код наших стилей чище вместе с CSS Custom Properties
- CSS Lists, Markers, And Counters — стилизуем списки при помощи псевдоклассов
- Everything You Need To Know About CSS Margins — CSS Margins под микроскопом
JavaScript
The Secret of Good Electron Apps — как фоновые процессы помогают писать Electron-приложения
Weak references and finalizers — обзор WeakMaps и WeakSets
Tips for rolling your own lazy loading — создаем собственный lazy loader
A Peek at New Methods Coming to Promises — изучаем новые методы Promise: allSettled, any
Object-Oriented Programming — The Trillion Dollar Disaster
Why [’1′, ’7′, ’11’].map(parseInt) returns [1, NaN, 3] in Javascript — забавный ресерч, почему map выдает непредсказуемый результат
@Surma (ведущий инженер Гугл) в своем блоге:
- When should you be using Web Workers? — анализирует работу Web Worker’ов
- Is postMessage slow? — исследует перфоманс postMessage’а все в тех же Web Worker’ах
VS Code тулзы:
- 21 VSCode Shortcuts to Make Coding Faster and More Fun
- 26 Miraculous VSCode Tools for JavaScript Developers in 2019
Tutorials
How To Build A Sketch Plugin With JavaScript, HTML And CSS
How to create a simple bitcoin API with NodeJS & GraphQL
React и React Native
Hermes — новый JS-движок для Android-приложений на React Native
Упрощаем код вместе с React Hooks:
- Build a Chat App Using React Hooks in 100 Lines of Code
- How To Fetch Data From An API With React Hooks
A Guide to Component Driven Development (CDD)
Smooth Animations With React and Framer Motion — создаем анимируем React-приложение вместе с Frame Motion
Life after Redux — переписываем Redux на Event Stream
Vue.js
Protecting Vue Routes with Navigation Guards
Vue.js Advanced Reactivity API and Caching Method-style Getters
Building an Interactive and Distraction-Free Form with Vue
Why every Vue developer should be excited by Quasar 1.0
Angular
Web Workers with the Angular CLI
All you need to know about Ivy, The new Angular engine!
Улучшаем код Angular компонентов:
- The Principles for Writing Awesome Angular Components
- How to Write Better Components in Angular
- Reducing the forms boilerplate — make your Angular forms reusable
Angular Platforms in depth
- Part 1. What are Angular Platforms?
- Part 2. Application bootstrap process
- Part 3. Rendering Angular applications in Terminal
Посмотреть
GraphQL: The Documentary — документальный фильм про GraphQL
Траспиляция из async/await в генераторы — от „Пятиминутки React”
GraphQL — курс по GraphQL
Послушать
Frontend Weekend:
- #93 — Наталия Короткова о том, как переехать в Лондон и на месте найти работу разработчиком
- #94 — Денис Мишунов о том, почему стоит уезжать в Норвегию и удалённо работать в GitLab
Веб-стандарты:
- Выпуск 182: Node.js, npm и JetBrains, сервис-воркеры и WASM, цена JS, современный CSS, доступность
- Выпуск 183. Sass и кастомные свойства, веб-шрифты, безусловный JS, веб-компоненты, WebRTC
- Выпуск 184. 10 лет WSD, самое важное за полгода, ответы на вопросы
devschacht:
- Выпуск 85: Вадим Макеев про историю и принципы WSD
- Выпуск 86: Проблема 10 тысяч соединений
- Выпуск 87: Андрей Лось про путь от Java до JS и про внедрение GraphQL в Revolut
Фронтенд Юность (18+):
CSSSR:
- Новости 512 — эволюция high-load монолита на NodeJS, настройка Webpack 4, SOLID и плохой UI
- Новости 512 — выдыхай, Huawei, новые фичи на Github и git-клиенты, релизы и документалка про GraphQL
- Новости 512 — Vue 3 RFC обновлён, ещё о микросервисах, новый убийца Redux и интересные публикации
- Новости 512 — Vue 3 разборки, микросервисы, бенчмарки, свежие релизы и немного о супер-компьютерах
Конференции и митапы
GraphQL Conf
WSD:
JSConf:
Остальное
Announcing TypeScript 3.6 Beta — что нового TypeScript?
How to SSR in a serverless environment and make your visitors 400% happier! — как SSR улучшить ваш продукт и жизнь
Grammarly ищет талантливых Front-End инженеров для усовершенствования нашего продукта, создания минималистичных элегантных пользовательских интерфейсов и решения сложных технических задач. Нашим продуктом пользуются миллионы пользователей каждый день. У нас замечательная команда, вместе с которой мы используем самые передовые технологии. И если вам интересно стать частью её, то смотрите открытые вакансии здесь, или стучитесь ко мне в Facebook.
С вами был Григорий Шехет. До новых встреч =^.^=
← Предыдущий выпуск: Frontend дайджест #34.
