Одной из проблем, которую придется решать при написании Server Side rendering приложения — это работа с метатегами, которые должны быть у каждой страницы, которые помогают при индексации их поисковыми системами.
Начиная гуглить, первое решение, к которому приведут скорее всего к React Helmet
Одно из преимуществ, что библиотеку в некотором роде можно считать изоморфной и может прекрасно работать как на стороне клиента, так и на стороне сервера.
Читать полностью »
Рубрика «React» - 26
ReactJS, Server Side rendering и некоторые тонкости обработки метатегов страницы
2020-01-18 в 11:58, admin, рубрики: nodejs, React, react-helmet, ReactJS, seo, ssrНовый фронтенд Одноклассников: запуск React в Java. Часть I
2020-01-16 в 6:00, admin, рубрики: graalvm, java, javascript, ok.ru, React, react.js, ReactJS, Блог компании Одноклассники, одноклассники, ок.tech, Разработка веб-сайтов
Многие слышали название GraalVM, но опробовать эту технологию в продакшене пока довелось не всем. Для Однокласснииков эта технология уже стала «священным Граалем», меняющим фронтенд.
В этой статье я хочу рассказать о том, как нам удалось подружить Java и JavaScript, и начать миграцию в огромной системе с большим количеством legacy-кода, а так же как на этом пути помогает GraalVM.
Во время написания статьи оказалось, что весь объём материала не влезает в традиционный для ХАБРа размер и если выложить публикацию целиком, то на её прочтение уйдет несколько часов. Поэтому мы решили разделить статью на 2 части.
Из первой части вы узнаете об истории фронтенда в Одноклассниках и познакомитесь с его историческими особенностями, пройдете путь поиска решения проблем, которые накопились у нас за 11 лет существования проекта, а в самом конце окунетесь в технические особенности серверной реализации принятого нами решения.
Читать полностью »
5 фич JavaScript, без которых я не мог бы писать код (перевод)
2020-01-13 в 15:32, admin, рубрики: async/await, javascript, Node, node.js, promise, React, ReactJS
Доброго времени суток, друзья!
Представляю Вашему вниманию перевод статьи Kent Dodds «5 JavaScript Features I Couldn't Code Without».
Это мой первый перевод, так что буду рад любым замечаниям.
5 фич JavaScript, без которых я не мог бы писать код
Прежде чем мы начнем, позвольте мне немного рассказать о коде, который я пишу. Почти весь мой код состоит из Javascript, плюс немного HTML и CSS. Я пишу как клиентский, так и серверный JS. Я тестирую свой код. Я создаю и распространяю библиотеки с открытым исходным кодом, которые используются тысячами разработчиков по всему миру. Для фронтенда я использую React, для бэкенда — Express или бессерверные вычисления.
Вот 5 фич JS, без которых я не мог бы писать код. В произвольном порядке. Разумеется, «без которых я не мог бы писать код» — это гипербола. Это фичи, которые мне по-настоящему нравятся и используются мной постоянно.
Читать полностью »
Дайджест свежих материалов из мира фронтенда за последнюю неделю №397 (6 — 12 января 2020)
2020-01-12 в 21:31, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Дайджест свежих материалов из мира фронтенда за последнюю неделю №396 (30 декабря 2019 — 5 января 2020)
2020-01-05 в 21:19, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Дайджест свежих материалов из мира фронтенда за последнюю неделю №395 (23 — 29 декабря 2019)
2019-12-29 в 21:04, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Дайджест свежих материалов из мира фронтенда за последнюю неделю №394 (15 — 22 декабря 2019)
2019-12-22 в 21:46, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Redux Toolkit как средство эффективной Redux-разработки
2019-12-22 в 20:00, admin, рубрики: action, flux, flux and react, front-end разработка, immer, javascript, React, react.js, ReactJS, reducer, redux, redux middleware, redux-create-action, redux-create-reducer, redux-dev-tools, redux-immutable-state-invariant, redux-starter-kit, redux-thunk, redux-toolkit, redux-utils, reduxjs, reduxtoolkit, reselect, starters kit, state, store, toolkit, TypeScript, web-development, Блог компании Inobitec, Программирование, хранение данных, хранилища данных, хранилище данных
В настоящее время разработка львиной доли веб-приложений, основанных на фреймворке React, ведется с использованием библиотеки Redux. Данная библиотека является самой популярной реализацией FLUX-архитектуры и, несмотря на ряд очевидных преимуществ, имеет весьма существенные недостатки, такие как:
- сложность и “многословность” рекомендованных паттернов для написания и организации кода, что влечет за собой большое количество бойлерплейта;
- отсутствие встроенных средств управления асинхронным поведением и побочными эффектами, что приводит к необходимости выбора подходящего инструмента из множества аддонов, написанных сторонними разработчиками.
Для устранения этих недостатков разработчики Redux представили библиотеку Redux Toolkit. Этот инструмент представляет собой набор практических решений и методов, предназначенных для упрощения разработки приложений с использованием Redux. Разработчики данной библиотеки преследовали цель упростить типичные случаи использования Redux. Данный инструмент не является универсальным решением в каждом из возможных случаев использования Redux, но позволяет упростить тот код, который требуется написать разработчику.
В данной статье мы расскажем об основных инструментах, входящих в Redux Toolkit, а также, на примере фрагмента нашего внутреннего приложения, покажем, как их использовать в уже имеющемся коде.
Скрытая цена CSS-in-JS-библиотек в React-приложениях
2019-12-18 в 9:30, admin, рубрики: css, javascript, React, ReactJS, Блог компании RUVDS.com, разработка, Разработка веб-сайтовВ современных фронтенд-приложениях технология CSS-in-JS пользуется определённой популярностью. Всё дело в том, что она даёт разработчикам механизм работы со стилями, который удобнее обычного CSS. Не поймите меня неправильно. Мне очень нравится CSS, но создание хорошей CSS-архитектуры — задача не из простых. Технология CSS-in-JS может похвастаться некоторыми серьёзными преимуществами перед обычными CSS-стилями. Но, к сожалению, применение CSS-in-JS способно, в определённых приложениях, привести к проблемам с производительностью. В этом материале я попытаюсь разобрать высокоуровневые особенности наиболее популярных CSS-in-JS-библиотек, расскажу о некоторых проблемах, которые иногда возникают при их использовании, и предложу способы смягчения этих проблем.
Дайджест свежих материалов из мира фронтенда за последнюю неделю №393 (9 — 15 декабря 2019)
2019-12-15 в 21:15, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
