Frontend дайджест #18: Angular 2.0, TypeScript 2.0, Progressive Web Apps з пісочниці
У випуску: Ден Абрамов про Redux, компоненти на будь-який смак для React Native, а також матеріали по React, GraphQL і ELM.
Почитати
Developing Extensible HTML and CSS Components .
Fun Times With CSS Pixel Art .
Flexible typography with CSS locks .
You can kinda invent your own weird design language with attributes and attribute selectors .
Methods for Controlling Spacing in Web Typography .
KharkivCSS — текстова трансляція.
Why there is no CSS4 — explaining CSS Levels .
How To Use WebPageTest and its API .
A Case Study on Boosting Front-End Performance .
HTTP/2 connection coalescing .
400,000 GitHub repositories, 1 billion files, 14 terabytes of code: Spaces or Tabs?
WebDriver Support in Safari 10 .
Bringing WebVR to Microsoft Edge .
Simple sharing on the web with navigator.share .
Writing a lambda-calculus interpreter in javascript .
Що нового в Marionette.js 3.0?
DevTools Digest, September 2016: Перфорація Roundup .
Cross-origin Service Workers: Experimenting with Foreign Fetch .
Everything You Should Know About Progressive Web Apps .
Things I learned making a Progressive Web App for "super selfies" .
How we made the RioRun progressive web app .
Create React PWA — Прогресивне веб-додаток на React.
Air Berlin: реалізація Progressive Web App .
Untangling Deeply-Nested Promise Chains — рефакторинг промисов.
A $100 cellular webpagetest agent .
Bundling With Rollup—The Basics .
11 Simple npm Tricks That Will Knock Your Wombat Socks Off .
The State Of JavaScript: Front-End Frameworks .
How To Scale React Applications .
Offline-first додаток з Hoodie&React:
— Частина перша: браузерна база даних ;
— Частина друга: авторизація .
Interesting React-Native projects to learn from .
Configure create-react-app without ejecting .
How to safely use React context .
Better Cross-Platform React Native Component .
Redux Patterns and Anti-Patterns .
10 Tips for Better Redux Architecture .
You Might Not Need Redux — Ден Абрамов.
If not Redux then what? — реакція на статтю Абрамова.
React Native UI Challenge #2 .
New awesome UI toolkit for React-Native Apps .
Github GraphQL API React Example .
Why Learning Angular 2 Was Excruciating .
Using the New Release of Angular 2's Router 3.0.0 .
Angular Router Final is Released .
The 4 Stages of Perf Tuning for your Angular2 App .
Dependency Injection in Angular 1 and Angular 2 .
Three Ways to Test Angular 2 Components .
Angular — Introduction to Reactive Extensions (RxJS) .
Understanding Reactive Programming and RxJS .
Why We won't Be Writing JavaScript in Five Years .
10 reasons why you should give Elm a try .
Why Elm is Going to Change the World .
Move fast and don't break things. Running a startup on Elm .
So You Want to be a Functional: Part 1 , 2 , 3 , 4 .
Статті від Apollo:
— GraphQL Concepts Visualized ;
— All you need to know about GraphQL.js 0.7 ;
— GraphQL: The next generation of API design ;
— Data management and AJAX server fetching for Angular Components ;
— GraphQL Subscriptions in Apollo Client ;
— The new GitHub GraphQL API ;
— GraphQL.org just got a makeover ;
— Bringing GraphQL to iOS ;
— Native code generation at Facebook .
How to automate tests and of deployments Node.js apps .
.
Туторіали
An Introduction to Chart.js 2.0 — Six Simple Examples .
How to Translate from DOM to SVG Coordinates and Back Again .
perfschool — воркшоп з основ клієнтської оптимізації.
Build a Music Streaming App with Electron, React & ES6 .
Building a Game with Three.js, ReactJS and WebGL .
Building Animated Components, or How React Makes D3 Better .
Подивитися
.
ElmLive .
Developer Diary c Підлогою Льюїсом.
TomskJS .
Послухати
Веб-стандарти — 29 , 30 , 31 , 32 , 33 , 34 , 35 випуски.
Frontflip Podcast: 20. Elm і отруйний качкодзьоб. Ігор Капков .
JavaScript Air:
— 36. Managing Dependencies like a boss ;
— 37. On-site at React Rally ;
— 38. Typed JavaScript with TypeScript and Flow ;
— 39. Node.js and Community ;
— 40. On-site at The Strange Loop ;
— 41. Test all the things with Cypress .
Бібліотеки
Tape Enzyme — Tape на стероїдах.
Appmetrics.js — результати Timing API Google Analytics.
ProtectJS — приватні методи для JS об'єктів.
Shoutem UI — набір компонент для React Native.
React with styles — CSS-in-JavaScript від Airbnb.
Neuron — ES6 React Electron starter kit.
Демо
Bouncy Ball — рівняння технік анімації.
SetIdle — моніторинг бездіяльності користувача.
Fuse.js — реалізація fuzzy search.
Regl — WebGL у функціональному стилі.
Pairs — гра на Elm + Elixir/Phoenix.
Minesweeper — сапер на Elm.
Інше
Chrome Beta 54: Custom Elements V1, BroadcastChannel, and media platform improvements .
Opera 40 .
Carbide .
Nucleus .
Our First 50,000 Stars — історія React.
Observatory — перевірка безпеки від Mozilla.
VSCode — iOS Web on Windows Debugging and Mac .
Перший мобільний браузер з підтримкою розширень для Chromium. Нова альфа Яндекс.Браузера .
Shoutem UI toolkit — набір компонентів для React Native.
GitKit.js — гіт на JavaScript в браузері.
30 Learning Resources For Mastering Angular 2 .
Ramme — Instagram клієнт на Electron.
Vue HackerNews 2.0 — на Vue 2.0.
WhatsApp — на React Native.
Grammarly шукає талановитих інженерів. Нашим продуктом користуються мільйони користувачів щодня. У нас чудова команда , ми використовуємо передові технології і вирішуємо цікаві технічні завдання. Дивіться відкриті позиції і приєднуйтесь.
З вами був Григорій Шехет. За допомогу в оформленні дайджесту дякую своїх колег.
? Попередній випуск: Frontend дайджест #17 .
Опубліковано: 30/09/16 @ 06:29
Розділ javascript
Рекомендуємо:
10 жовтня, Київ — Курс «IP-телефонія Asterisk»
Псссс, пацан
12 листопада, Київ — Курс iOS advanced
10 жовтня, Дніпро — Курс FullStack Developer з працевлаштуванням в Дніпрі
Кейс: Зростання трафіку на 27% за 3,5 місяця і збільшення продажів на 35%