Це друга стаття про Server Side Rendering і ізоморфних/універсальних програмах на React. Перша під назвою "Спрощуємо універсальне/ізоморфне додаток на React + Router + Redux + Express" була більше про кастомное рішення, ця ж стаття націлена більше на тих, кому не хочеться морочитися, а хочеться готове рішення, з ком'юніті, і взагалі поменше головного болю з налаштуванням, налагодженням, підбором бібліотек і т. д.
+
В даній статті будемо розглядати Next.JS, який володіє перевагами у вигляді відсутності конфігурації, серверного рендеринга і готової екосистеми.
З коробки Next.JS не вміє працювати з Redux, тому в процесі написання пробного проекту я виділив отриманий загальний код в окремий репозиторій next-redux-wrapper, за допомогою якого в цій статті ми зберемо додаток-приклад на Next.JS + Redux.
Читати далі →

Кожен раз починаючи писати React додаток, ви так чи інакше виберіть якийсь варіант:
  • копі-паст вашого попереднього проекту
  • якийсь бойлерплейт або навіть генератор (типу Yeoman)
  • готовий фреймворк не вимагає конфігурації
  • пишете самі все з нуля
Кожен із способів має свої сильні і слабкі сторони, як на довгому, так і на короткій дистанції.
Деякі рішення приховують складність на початку, дозволяючи зробити швидкий старт. Це щось подібне рішення під ключ, але в результаті такі рішення можуть виявитися недостатньо гнучкими і складними в підстроюванні. З іншого боку, на початку все може здаватися злегка монструозным і неповоротким, і щоб почати потрібно трохи повозитися, але зате потім переваги стануть очевидними. Завжди є можливість зробити все з нуля, рівно так, як хочеться, але в такому випадку Ви будете відповідати за незліченні аспекти і Вам будуть потрібні глибокі знання у всіх що беруть участь технологіях.
Читати далі →

На Хабре вже було предостатньо статей про те, як робити універсальне (ізоморфне) додаток на стеку React + Redux + Router + Koa/Express (Google в допомогу), проте я помітив, що всі вони містять повторюваний код для серверного рендеринга. Я вирішив спростити завдання і виділити цей загальний код в бібліотеку, так і з'явився на світ react-router-redux-middleware, працює приблизно так:
import Express from "express";
import from config "./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.слухати(port);

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

Тестування смарт контрактів Ethereum на прикладі DAO

При створенні смарт контрактів на платформі Ethereum розробник закладає певну логіку роботи, що визначає, як методи повинні змінювати стан контракту, які повинні емітуватися події, коли і кому потрібно здійснити переказ коштів, а коли кинути виняток. Інструменти налагодження смарт контрактів ще не дуже розвинені, тому тести найчастіше стають необхідним інструментом розробки, т. к. запускати контракти після кожної зміни може бути досить тривалою процедурою. Також, у випадку виявлення помилок, змінити код розгорнутого в мережі контракту вже неможливо, можна тільки знищити контракт і створити новий, тому тестування варто проводити максимально докладно, особливо методи пов'язані з платежами. У статті будуть показані деякі прийоми тестування, з якими стикаються розробники при створенні і налагодженні смарт контрактів на Solidity.
Читати далі →

Тестування untestable JS c допомогою Babel snarejs

image

У процесі розробки сучасних JS додатків особливе місце приділяється тестуванню.
Test Coverage на сьогодні є чи не основним показником якості JS коду.
Останнім часом з'явилася величезна кількість фреймворків які вирішують задачі тестування: jest, mocha, sinon, chai, jasmine, список можна довго продовжувати довго, але навіть маючи таку свободу вибору інструментів для написання тестів залишаються кейси які складно перевірити.

Про те як протестувати те що в загальному може бути untestable піде мова далі.

Читати далі →

PHP 7.1.1 FPM vs Node.js 7.4.0 в якості web backend сервера

Всім привіт, вирішив поділитися з вами результатами синтетичного тесту продуктивності свіжих версій PHP і Node.js.

Конфігурація сервера:

Простий VDS — 1 ядро процесора 2ГГц, 1 гб оперативы, 10Гб SSD.
ОС: Debian 8.6.
Так само зроблені базові налаштування ядра, щоб сервер в принципі міг обробляти велику кількість з'єднань.

Випробовувані:

— PHP 7.1.1 FPM
— Node.js 7.4.0

Перший етап:

Тут операції, які в основному використовує backend. А саме: склеювання рядків, мережевий введення-виведення, арифметика і робота з масивами.

Читати далі →

CodeceptJS — сучасні end2end тести для NodeJS

image
У світі NodeJS твориться повний хаос, кожен день з'являються нові фреймворки, розміри залежностей звичайного package.json виростають на сотні мегабайт, а бібліотека, яку ви додали в проект ще вчора, сьогодні вже морально застаріла. І якщо у світі фронтенд фреймворків вже намітилися явні фаворити: AngularJS, React, Vue, Ember, то що для приймального тестування абсолютно незрозуміло. Кожен фреймворк надає свій синтаксис і свої круті штуки, а також у кожного є свій характерний набір проблем. Наприклад, кожен по-своєму реалізує взаємодію з браузером, кожен по різному бореться з асинхронностью.
Ох, ця горезвісна асинхронність...
Читати далі →

Історія мого стартапу: 500000 користувачів за 5 днів на стодолларовом сервері

Схоже, все в світі стартапів згодні з тим, що перші версії додатків повинні представляти собою мінімально життєздатний продукт (MVP, Minimal Viable Product), створюючи який можна не особливо піклуватися про його масштабування з технічної точки зору. Мені багато разів доводилося чути про те, що найголовніше в подібних справах – скоріше випустити щось працююче. І, до тих пір, поки бізнес-модель нормально функціонує в умовах зростання клієнтської бази – все нормально. А витрачати час і гроші на те, щоб зробити систему, яка зможе витримати раптовий наплив користувачів, не варто. Турбуватися потрібно лише про перевірку припущень, про оцінку ринку і про розкрутку бізнесу. Масштабованість – це те, що можна відкласти на потім. До нещастя, ось така сліпа віра в шаблонні ідеї вже не раз призводила до оглушливим провалів. Pokémon GO, і, зокрема, пов'язані з цим проектом програми, служать нагадуванням про це.



Читати далі →

Рецепт розробки бота під Telegram



Добрий день, шановні читачі Хабрахабра!

В цьому топіку я хочу поділитися з вами досвідом розробки бота під Telegram за 4 дні. Цей бот переводить всі голосові повідомлення, які отримує, в текст. Намагався зробити швидко, але якісно — підучив пару-трійку технологій. Постараюся максимально детально описати свій процес подолання помилок і перешкод; довести, що, навіть не маючи потрібних навичок, запустити свій продукт не так-то й складно.

Стаття може бути цікава як новачкам у програмуванні — побачити, скільки перешкод стоять на шляху у готового продукту, так і більш просунутим фахівцям — десь посміятись, десь поплакати, десь написати коментар «життєво».

Преамбула
І так, що ж може зробити один програміст за 4 дні?

Читати далі →

Electrode — open source платформа від WalmartLabs для ReactJS/NodeJS додатків

image

Менше ніж за рік Wallmart.com завершив міграцію React/Node.js і ми раді повідомити вам про це! Мета міграції полягала у створенні нової платформи для підвищення ефективності WalmartLabs та її інженерів в майбутньому.
Ми раді повідомити про те, що ми виклали в open source Electrode — платформу, на якій побудований Walmart.com.

Читати далі →