Введение в Immutable.js и основные концепции функционального программирования

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

#javascript #functional

Temper — Управлять состоянием в React стало проще

https://temperjs.org/

​Modern Full-Stack Development (2020)
Автор: Frank Zammetti
Количество страниц: 395

React - один из самых популярных фреймворков веб-разработки, доступных сегодня, а Node.js чрезвычайно популярен для разработки на стороне сервера. Тот факт, что оба используют JavaScript, является хорошим аргументом в пользу их использования, но по мере того, как разработчики все больше используют этот язык, они начинают видеть и некоторые несовершенства; именно поэтому существует и быстро набирает популярность TypeScript. Добавьте к этому стеку Webpack и Docker, и вы получите мощный набор инструментов разработки, с которым можно создавать приложения. Работая с книгой, вы увидите, как эти инструменты действуют вместе и научитесь ими пользоваться.

Во время чтения книги вы:
✔️Запустите проект и логически структурируете его;
✔️Сделаете интерфейс пользователя с React и MAterial-UI;
✔️Используете вебсокеты для коммуникаций клиента с сервером;
✔️Создадите REST API с Node и Express.

Достоинства:
➕Множество примеров кода;
➕Широкий спектр инструментов.

Недостатки:
➖Некоторые темы описаны поверхностно.

Скачать книгу

#english #book #intermediate

Курс по JS - бесплатный сегодня-завтра.
Подписуемся, кому не хватает знаний)

JavaScript Fundamentals: A Course for Absolute Beginners

FREE For 48 Hrs

Learn JavaScript Fundamentals from the Scratch

https://coursevania.com/courses/javascript-fundamentals-a-course-for-absolute-beginners/

Всем привет!

Знаю, что у нас на канале большинство ещё учиться.
Если кто задумался о Реакте, инфа для вас.
Введение в React, которого нам не хватало

#react

Jotai, новая библиотека управления состоянием для React

https://www.infoq.com/news/2020/09/jotai-react-state-management/

Свежачок!

React – The Complete Guide with React Hook Redux 2020 in 4hr

FREE For 48 Hrs

Learn how to create high performance web app with react. Hooks, Redux, React Routing, useContext, Fireabase and more

https://coursevania.com/courses/react-the-complete-guide-with-react-hook-redux-2020-in-4hr/

Complete Progressive Web App Bootcamp

FREE For 48 Hrs

Learn to build discoverable, engaging Progressive Webs Apps (PWAs) from scratch,

https://coursevania.com/courses/complete-progressive-web-app-bootcamp/

Введение в Wouter: альтернативу React Router

https://blog.logrocket.com/an-introduction-to-wouter-a-react-router-alternative/

​ReactJS - Путь Самурая 2.0

Большой (и бесплатный!) видео-курс по React.js от IT-KAMASUTRA: https://prglb.ru/3e94n

#video #react #courses #frameworks

Рассказываем о различных вариантах использования сервис-воркера (ServiceWorker API) и интерфейса кэширования (Cache API).

Читать статью

Освоим обработку ошибок и исключений в React Hooks за 5 минут! Рассмотрим сценарий использования на примере утилиты для деления двух значений и узнаем, как присходит отслеживание появляющихся ошибок. Попробуем создать в виртуальном редакторе свой сценарий в режиме реального времени.

https://nuancesprog.ru/p/9823

@nuancesprog #статьи #React

​Улучшаем SEO с помощью Next.js

Это бесплатный открытый JavaScript-фреймворк, созданный поверх React, и работает он по принципу SSR.

В подходе SPA всё отрисовывается на стороне клиента, поэтому код подгружается, когда пользователь заходит на страницу. Но поисковый робот может просмотреть только изначальный код страницы, ещё не обработанный React’ом. И тут на помощь приходит технология SSR, которая позволяет запускать код на сервере и улучшать таким образом SEO.

Подробнее о Next.js и серверном рендеринге можно почитать здесь:

https://tprg.ru/HSR3

#javascript

How to create a simple HTML5 Canvas Game with JavaScript

FREE

Create an HTML5 Game from scratch using JavaScript to draw on canvas apply animations and interaction with keyboard

https://coursevania.com/courses/how-to-create-a-simple-html5-canvas-game-with-javascript/

Классная статья - Оптимизация подключения REST API для React приложений

Спойлер - там не только про Реакт. Рекомендую всем почитать

#js #api

​React JSX

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

JSX это — расширение языка JavaScript. Фундаментально, JSX является синтаксическим сахаром для функции React.createElement(component, props, ...children)

JSX код:

 <MyButton color="blue" shadowSize={2}>
   Click Me
 </MyButton>

компилируется в:

 React.createElement(
   'div',
   {className: 'sidebar'},
   null
 )

React можно использовать и без JSX, но большинство людей ценит его за наглядность при работе с UI, живущем в JavaScript-коде. Помимо этого, JSX помогает React делать сообщения об ошибках и предупреждениях понятнее.

JSX допускает использование любых корректных JavaScript-выражений внутри фигурных скобок.
const user = {
firstName: 'Марья',
};

const element = (
<h1>
Здравствуй, {user.name}!
</h1>
);

​​visx | visualization components for #react

visx is a collection of reusable low-level visualization components. visx combines the power of d3 to generate your visualization with the benefits of react for updating the DOM.

https://github.com/airbnb/visx

#ts