Рубрика «ReactJS» - 48

в 13:26, , рубрики: ES6, javascript, mobx, ReactJS, todolist

React + mobx путь с нуля. Mobx + react, взгляд со стороны - 1

В «настоящих» проектах мы получаем данные от сервера или пользовательского ввода, форматируем, валидируем, нормализуем и производим другие операции над ними. Всё это принято считать бизнес логикой и должно быть помещено в Model. Так как react — это только треть MVC пирога, для создания пользовательских интерфейсов, то нам потребуется еще что-то для бизнес логики. Некоторые используют паттерны redux или flux, некоторые — backbone.js или даже angular, мы же будем использовать mobx.js в качестве Model.
Читать полностью »

в 8:15, , рубрики: react.js, ReactJS, scala, scala.js, Разработка веб-сайтов

Перевод статьи Pedro Palma Ramos "Building Web applications with Scala.js and React — Part 1"

Мне, как Scala-программисту, разрабатывающему веб-приложения, обычно неприятен переход от аккуратного, функционального и типобезопасного Scala бэкенда к фронтенду, написанному на JavaScript. К счастью, существует мощная и зрелая альтернатива нашему (не всегда) любимому стандартному языку для Web.

Scala.js — это реализация Scala за авторством Sébastien Doeraene, которая компилирует код Scala в JavaScript, а не в байт-код JVM. Она поддерживает полную двустороннюю функциональную совместимость между Scala и JavaScript-кодом и, следовательно, позволяет разрабатывать фронтенд веб-приложения на Scala с использованием библиотек и фреймворков JavaScript. Она также способствует уменьшению дублирования кода по сравнению с обычным веб-приложением на Scala, поскольку позволяет повторно использовать на фронтэнде модели и бизнес-логику, разработанные для серверной части.

React, с другой стороны, представляет собой веб-фреймворк для создания пользовательских интерфейсов в JavaScript, разработанный и поддерживаемый Facebook и другими компаниями. Он способствует чистому разделению между обновлением состояния приложения в ответ на пользовательские события и визуализацией представлений на основе указанного состояния. Поэтому фреймворк React особенно подходит для функциональной парадигмы, которая используется при программировании на Scala.

Читать полностью »

в 13:52, , рубрики: javascript, ReactJS, метки:

image

Оригинал статьи

Если вы все еще не знаете, мобильная версия Twitter’а написана на новом стеке веб-технологий, состоящего из React и Redux.

Услышав эту новость, я подумал, что было бы не плохо покопаться в ихнем Redux хранилище и посмотреть как они в том аде организовали все твиты в двереве состояния.

Читать полностью »

в 13:46, , рубрики: ES6, javascript, mobx, React, ReactJS, webpack

Готовим плацдарм для react-приложения - 1

Я хочу рассказать о процессе создание платформы для react приложения, которая использует mobx в качестве Model-и. Пройти путь от пустой директории проекта до рабочего примера. Рассмотреть основные моменты, на которые я обращал внимание в процессе разработки. Постараюсь насытить текст уточняющими ссылками, дополнительные заметки будут выделены курсивом с пометкой «Note:».

Рассказ будет состоять из двух частей:

  1. Готовим плацдарм для react приложения
  2. Mobx + react, взгляд со стороны

Буду писать «как я вижу», поэтому предложения и замечания по улучшению приветствуются. Надеюсь, читатель знает, что такое npm, node.js и react.js, имеет базовые знания о props и state. На момент написания статьи, у меня стоит windows и нестабильная node.js 7.3.0 версии.
Читать полностью »

в 1:02, , рубрики: electrode, javascript, next.js, node.js, React, ReactJS, redux, server-rendering, webpack, Клиентская оптимизация, Разработка веб-сайтов

Каждый раз начиная писать React приложение, вы так или иначе выберите какой-то вариант:

  • копи-паст вашего предыдущего проекта
  • какой-то бойлерплейт или даже генератор (типа Yeoman)
  • готовый фреймворк не требующий конфигурации
  • пишете сами все с нуля

Каждый из способов имеет свои сильные и слабые стороны, как на длинной, так и на короткой дистанции.

Некоторые решения скрывают сложность в начале, позволяя сделать быстрый старт. Это что-то вроде решения под ключ, но в результате такие решения могут оказаться недостаточно гибкими и сложными в подстройке. С другой стороны, в начале все может казаться слегка монструозным и неповоротливым, и чтоб начать нужно немного повозиться, но зато потом преимущества станут очевидными. Всегда есть возможность сделать все с нуля, ровно так, как хочется, но в таком случае Вы будете отвечать за бесчисленные аспекты и Вам потребуются очень глубокие знания во всех участвующих технологиях.Читать полностью »

в 6:36, , рубрики: express.js, isomorphic, javascript, node.js, React, ReactJS, redux, Universal, universal apps, Клиентская оптимизация

На Хабре уже было предостаточно статей про то, как делать универсальное (изоморфное) приложение на стеке React + Redux + Router + Koa/Express (Google в помощь), однако я заметил, что все они содержат повторяющийся код для серверного рендеринга. Я решил упростить задачу и выделить этот общий код в библиотеку, так и появился на свет react-router-redux-middleware, работает примерно так:

import Express from "express";
import config from "./webpack.config";
import createRouter from "./src/createRouter";
import createStore from "./src/createStore";
import {createExpressMiddleware} from "react-router-redux-middleware";

const app = Express();
app.use(createExpressMiddleware({
  createRouter: (history) => (createRouter(history)),
  createStore: ({req, res}) => (createStore())
}));
app.use(Express.static(config.output.path));
app.listen(port);

Предлагаемый способ может сэкономить силы и избавить от копи-паста. В самом подходе нет чего-то принципиально нового, и для более глубокого понимания можно почитать официальную документацию, а также статьи по ссылкам выше. Далее я постараюсь кратко изложить суть серверного рендеринга и необходимые подготовительные этапы.Читать полностью »

в 23:08, , рубрики: javascript, react native, ReactJS, вискас, разработка мобильных приложений

Итак, пришла пора быстро погрузиться в тему. Для усиления эффекта, использую разные техники трансформации информации в знания. В частности, представляю конспект доклада Алексея Андросова (старшего разработчика интерфейсов, Yandex).

Читать полностью »

в 13:35, , рубрики: ecmascript 2015, javascript, React, ReactJS, redux

Современный JavaScript или как сделать ваш Redux-модуль готовым к переиспользованию - 1

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

Читать полностью »

в 11:16, , рубрики: javascript, JS, open source, ReactJS, Блог компании Программа «Единая фронтальная система», Сбербанк, Сбертех

Программисты всегда пользовались генераторами документации, когда это было возможно. Это упрощает документирование, позволяет получить справку по продукту без обращения к коду самого проекта. В Программе долгое время использовался JavaDoc, т.к. большинство проектов написаны на Java, но это было до недавнего времени. Сейчас проекты развиваются  - мало кто представляет хороший продукт без хорошего UI. Отрасль frontend дала жизнь новому направлению разработки — разработчик UI. Концентрируясь на удобстве пользователя, а не на бизнес-процессах, UI-разработка позволяет избегать  сложности бизнес-приложений — камень преткновения многих enterprise-решений.

image
Читать полностью »

в 10:59, , рубрики: javascript, React, ReactJS, vuejs, Блог компании RUVDS.com, Веб-разработка, Разработка веб-сайтов

На чём делать фронтенд? Самый верный способ найти ответ – попробовать лучшие библиотеки самостоятельно. В идеале, хорошо бы начать с самого простого и понять, как таинственные для непосвящённого конструкции превращаются в готовые к выводу страницы. Дальше же, вооружившись пониманием основ, можно осмысленно читать документацию и усложнять собственные эксперименты до тех пор, пока ответ не покажется очевидным.

React или Vue? Выбираем библиотеку для фронтенд-разработки - 1

Сегодня мы поговорим о React.js и Vue.js. Это – одни из самых популярных JavaScript-библиотек в мире. Взгляните на этот список, посмотрите их репозитории на GitHub. И та, и другая обладают впечатляющими возможностями и служат для создания пользовательских интерфейсов. Работать с ними довольно просто, главное – сразу понять, что к чему, сделать правильный первый шаг. Собственно говоря, этому вот первому шагу в разработке с использованием React и Vue и посвящён данный материал.
Читать полностью »

1...1020...474849...60...62
Главная   |  Архив новостей  |   Android  |   Google  |   Apple  |   Microsoft  |   Информационная безопасность  |   Веб – разработка
Публикации RSS  |  Комментарии RSS
https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js