Pull to refresh
6.2
Karma
0
Rating
Борис Могила @BoryaMogila

js, php — разработчик

  • Followers 58
  • Following 4
  • Posts
  • Comments

Svelte, исчезающий фреймворк, который уже не исчезнет

JavaScriptAngularReactJSVueJSSvelteJS
Когда на днях в наш уютный чатик @sveltejs в телеграм запостили ссылку на очередную «разоблачающую» статью про Svelte, я очень обрадовался, предвосхищая интересный технический батл или хотя бы увлекательное чтиво чужого практического опыта. Кроме того, что это всегда интересно и полезно, определенное стечение обстоятельств — плановый отпуск и карантин — заставляют меня скучать дома, а подобная статья могла бы несколько разнообразить мой день. Каково же было мое разочарование, вы даже представить себе не можете… но давайте по делу.


Читать дальше →
Total votes 112: ↑78 and ↓34+44
Views23K
Comments 241

Методы обхода защитных средств веб-приложений при эксплуатации XSS-векторов

OWASP corporate blogInformation Security
image

 
Несмотря на большое количество рекомендаций по защите веб-приложения от клиент-сайд атак, таких как XSS (cross site scripting) многие разработчики ими пренебрегают, либо выполняют эти требования не полностью. В статье будут рассмотрены способы обхода средств фильтрации и при эксплуатации xss-векторов.

Читать дальше →
Total votes 36: ↑35 and ↓1+34
Views28K
Comments 12

Современная JWT авторизация для современного Node.js фреймворка Koa

JavaScriptNode.JS
Sandbox
image
Задача авторизации возникает практически в каждом Node.js проекте, однако, чтобы ее правильно настроить, необходимо подключить большое количество модулей и собрать кучу информации из разных источников.

В этой статье я опишу полноценное решение по авторизации на основе JSON Web Token (JWT) для Node.js и Koa с хранением хэшей паролей в MongoDB. От читателя ожидаются базовые знания Node.js и принципов работы с MongoDB через Mongoose.
Читать дальше →
Total votes 18: ↑17 and ↓1+16
Views76K
Comments 17

Упрощаем универсальное/изоморфное приложение на React + Router + Redux + Express

JavaScriptClient optimizationNode.JSReactJS

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


import Express from "express";
import config from "./webpack.config";
import createRouter from "./src/createRouter";
import createStore from "./src/createStore";
import {createExpressServer} from "create-react-server";

createExpressServer({
  createRouter: (history) => (createRouter(history)),
  createStore: ({req, res}) => (createStore()),
  port: 3000
}));

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

Читать дальше →
Total votes 18: ↑14 and ↓4+10
Views18K
Comments 22

Ускоряем Node.js с помощью Rust

Node.JSRust


В последнее время в сети довольно часто упоминается «молодой и перспективный» язык Rust. Он пробудил во мне любопытство и желание сделать на нём что-то более-менее полезное, чтобы как-то примерить — впору ли он мне. Это вылилось в достаточно любопытный, как мне кажется, опыт скрещивания ужа с ежом при содействии кукушки.

Читать дальше →
Total votes 48: ↑47 and ↓1+46
Views16K
Comments 82

Как слямзить Хабр по-быстрому

Website developmentJavaScriptReactJS
Tutorial

Это произошло в понедельник 13 февраля, мир больше не будет прежним. Открыта вакансия:



Для работы над нашими проектами мы ищем сильного front-end разработчика. Вам предстоит амбициозная задача: внедрить компонентный подход в разработку всех текущих и новых проектов компании.

Отлично, работаем дальше! Выполняю "тестовое задание".

Читать дальше →
Total votes 59: ↑34 and ↓25+9
Views42K
Comments 66

Производительность старта JavaScript

Mail.ru Group corporate blogHigh performanceWebsite developmentJavaScriptClient optimization
Translation


Веб-разработчики знают, как легко разрастаются размеры веб-страниц. Но загрузка страницы — это не просто передача байтов по проводу. Когда браузер загрузил скрипты, ему нужно их отпарсить, интерпретировать и запустить. В статье мы внимательно рассмотрим эту фазу и узнаем, почему она может стать причиной замедления запуска вашего приложения и как это исправить.
Читать дальше →
Total votes 55: ↑55 and ↓0+55
Views26K
Comments 3

Первый официальный релиз Webpack 2. Что нового по сравнению с Webpack 1?

Developer Soft corporate blogJavaScriptProgrammingNode.JSReactJS
Translation

Webpack 2 Release


Предупреждение: проверьте, как установлена версия Webpack в package.json. Возможно скоро ваш continuous integration сломается.


Наконец-то Webpack 2 преодолел рубеж beta и release candidate. Это значит, что всё работает стабильно, и можно без опаски использовать его в production.


Список изменений/улучшений:


  • Нативная поддержка ES6-модулей;
  • Разбиение кода на чанки — Code Splitting with ES6;
  • Поддержка динамических выражений при загрузке модулей — Dynamic expressions;
  • Изменения при работе с Babel;
  • ES6-специфичные оптимизации;
  • Breaking Changes;
  • Новый сайт с документацией.

Подробности под катом.

Читать дальше →
Total votes 60: ↑58 and ↓2+56
Views39K
Comments 19

Изоморфные React-приложения: производительность и масштабирование

Конференции Олега Бунина (Онтико) corporate blogJavaScriptClient optimizationAngularReactJS


Денис Измайлов ( DenisIzmaylov )


Всем привет! Вкратце расскажу о себе. Я — Денис Измайлов. Последние 5 лет сосредоточился на JS-разработке, делал много Single Page Application, highload, React, выступал на MoscowJS несколько раз, каммитил webpack и т.д.

Сегодня хотел бы поговорить вот о чем: почему от Single Page Application в его классическом виде стоит отказаться; как изоморфные приложения отразятся на Вашей зарплате; и что вы будете делать на этих выходных?
Читать дальше →
Total votes 43: ↑26 and ↓17+9
Views31K
Comments 55

Оптимизируем redux хранилище для более производительных изменений

JavaScriptReactJS
Этот пост является продолжением поста про оптимизацию производительности списка в React приложении.

Внимание. В данном посте примеры подготовлены специально для Redux приложений. Но сам подход возможно применить и с другими библиотеками. Так же нижеприведенный совет работает в react-redux версии 5. Я не смог достичь желаемого результата в версии 4. Глубоко разбираться в причинах я не стал.

И так, стандартный способ хранить некоторое множество элементов в приложении — это хранить их в массиве:

const state = {
  targets: [{id: 'target1', radius: 10}, {id: 'target2', radius: 2}]
};
Читать дальше →
Total votes 18: ↑18 and ↓0+18
Views10K
Comments 5

Быстрый курс Redux + websockets для бэкендера

PythonReactJS
Sandbox
Всем привет из 2018! Оригинальный react-redux-universal-hot-example прекратил развитие в 2017 году, но его можно собрать на версии 6.14.2, на 8 и выше версии будут ошибки. Но есть его форк
https://github.com/bertho-zero/react-redux-universal-hot-example, где продолжается разработка и поддерживаются более свежие версии Nodejs.

Это краткое руководство и обучение по фронтэнеду для бэкендера. В данном руководстве я решаю проблему быстрого построения пользовательского интерфейса к серверному приложению в виде одностраничного веб-приложения (single page app).


Основной целью моего исследования является возможность за разумное время (для одного нормального человека) получить удобный и простой в использовании интерфейс-черновик к серверному приложению. Мы (как разработчики серверной части) понимаем, что наш приоритет — серверная часть. Когда (в гипотетическом проекте) появятся во фронте профи своего дела, они все сделают красиво и "правильно".


В роли учебной задачи представлена страничка чата с каким-то умозрительным "ботом", который работает на стороне сервера и принимает сообщение только через WebSocket. Бот при этом выполняет эхо ваших сообщений (мы тут не рассматриваем серверную часть вообще).

Читать дальше →
Total votes 37: ↑33 and ↓4+29
Views45K
Comments 32

Идеальный программист. Часть 1

Development ManagementProject managementFreelanceProduct ManagementPersonnel Management
Статья-конспект по книге Роберта Мартина «Идеальный программист». После прочтения книги у меня поменялось отношение к программистической жизни. В книге рассматривается процесс написания кода, сам код, отношение к задачам, TDD и много других полезностей. Читать нужно разработчикам и менеджерам проектов. Частично применимо к дизайнерам.


Читать дальше →
Total votes 77: ↑61 and ↓16+45
Views86K
Comments 201

Нейронные сети на JS. Создавая сеть с нуля

EPAM corporate blogJavaScriptProgrammingAlgorithmsMachine learning

КПДВ про нейронные сети


Нейронные сети сейчас в тренде. Каждый день мы читаем про то, как они учатся писать комментарии в интернете, торговаться на рынках, обрабатывать фотографии. Список бесконечен. Когда я впервые посмотрел на масштаб кода, который приводит это в движение, я был напуган и хотел больше не видеть эти исходники.


Но врожденные любознательность и энтузиазм довели меня до того, что я стал одним из разработчиков Synaptic — проекта фреймворка для построения нейронных сетей на JS с 3к+ звезд на GitHub. Сейчас мы с автором фреймворка занимаемся созданием Synaptic 2.0 с ускорением на GPU и WebWorker-ах и с поддержкой почти всех основных фич любого приличного NN-фреймворка.


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

Читать дальше →
Total votes 53: ↑51 and ↓2+49
Views84K
Comments 43

Готовим IndexedDB

Website developmentJavaScriptProgramming


На Хабре уже рассказывали про IndexedDB — стандарт хранения больших структурированных данных на клиенте. Но это было давно и API сильно изменился. Несмотря на это в поиске статья всплывает одной из первых и вводит в заблуждение многих, кто начинает пытатся работать с этой технологией. Поэтому я решил написать новую статью с информацией об актуальном API.
Читать дальше →
Total votes 28: ↑27 and ↓1+26
Views65K
Comments 8

React, Web Components, Angular и jQuery — друзья навеки. Универсальные JavaScript-компоненты

Developer Soft corporate blogJavaScriptProgrammingHTMLReactJS
Tutorial

image
Эта статья о том, как написать универсальный JavaScript-компонент, который можно будет использовать


  • как React-компонент;
  • как Preact-компонент;
  • как Angular-компонент;
  • как Web Component;
  • как jQuery функцию для рендеринга в DOMElement;
  • как нативную функцию для рендеринга в DOMElement.

Зачем и кому это нужно


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

Читать дальше →
Total votes 57: ↑54 and ↓3+51
Views23K
Comments 53

Как избежать излишней сложности состояния приложения [перевод]

Designing and refactoringReactJS
Sandbox


Реализации Flux, такие как Redux, мотивируют нас уделять больше внимания проектированию состояния приложения. Оказывается, это нетривиальная задача. Это похоже на классический пример из теории хаоса, когда, казалось бы, безобидный взмах крыльев бабочки ведёт к далеко идущим последствиям. Ниже приведены советы, которые помогут вам лучше организовать состояние приложения.
Читать дальше →
Total votes 19: ↑19 and ↓0+19
Views16K
Comments 7

Fedora 25. Новая надежда: Wayland, Storaged, поддержка Raspberry Pi…

*nix
Fedora 25

22 ноября Fedora опять зарелизилась. 25-й релиз, на мой взгляд, получился очень удачный:

  • Замена старого сервера X.Org или X11 на Wayland. Поддержка сеанса на базе X11 сохранена в качестве опции
  • UDisks2 заменён на Storaged, предоставляющий унифицированный D-Bus API для управления LVM2, iSCSI, Btrfs, BCache, LSM и ZRam
  • Поддержка устройств Raspberry Pi 2 и 3

Читать дальше →
Total votes 21: ↑21 and ↓0+21
Views13K
Comments 11

Автоматически генерируемая CMS использую вашу готовую GraphQL-схему

JavaScriptNode.JSReactJS
image

вторая версия GraphQL CMS

В моей предыдущей статье "ну Русском. Оригинал" я рассказывал как можно вдвое сократить свой код и время, если вы используете GraphQL вместе с Mongoose.

Сегодня речь также пойдет о технологии GraphQL и если вы работаете с ней то данная статья сможет помочь вам сохранить приличное количество времени на разработку. Оригинал статьи на английском вы можете найту по ссылке.

» Ссылка на сам модуль: graphql-auto-generating-cms.

Как вы уже наверное догадались данный модуль использует вашу готовую GraphQL схему для генерации полнофункциональной CMS. Вам не нужно будет тратить кучу времени на разработку административной панели, и вы сможете больше сосредоточиться на бизнес процессах вашего проекта и на его архитектуре.

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

У вас есть два способа использовать данный модуль.

  1. Первый максимально быстрый и подойдет для нового проекта. От вас требуется только GraphQL схема и следование легкому паттерну по наименованию GraphQL методов и типов.

  2. И второй способ который не требует от вас следованию никаких паттернов, и может быть легко интегрирован в уже готовый проект. Все что от вас нужно предоставить конфигурационный объект вместе с GraphQL схемой.

На данный момент модуль не поддерживает GraphQLList, вложенные объекты и загрузку файлов, их поддержка будет реализована в будущих версиях. На данный момент вы можете легко обойти эти ограничения используя самописные функции и компоненты которыми вы можете дополнить CMS, мы рассмотрим как это сделать в данной статье.

Исходя из всего выше перечисленного давайте разделим текущую статью на несколько пунктов:

  • Общие правила
  • Подготовка к работе
  • Первый способ использования, с паттерном
  • Второй способ использования, с конфигурационным объектом
  • Дополнение CMS своими компонентами и функциями
Читать дальше →
Total votes 13: ↑11 and ↓2+9
Views8.9K
Comments 9

Как спасти принцессу, используя 8(+45) языков программирования, в пятницу

Edison corporate blogJavaScriptProgrammingJavaC
Translation


У вас есть JavaScript. Вы тратите несколько часов на сбор библиотек, настройку node и постройку фреймворка для замка. К тому времени, как вы разберетесь с фреймворком, форт уже будет заброшен, а принцесса переберется в другой замок.



У вас есть С. У вас есть библиотека для замка и для принцессы. В атаку! Вы спасаете принцессу, ее собаку, весь ее гардероб и всё, что она когда-либо съела. Fuck, неужели я забыл null-terminator?
Читать дальше →
Total votes 122: ↑81 and ↓41+40
Views64K
Comments 205

Redux-form. Когда работать с формами просто

JavaScriptNode.JSReactJS
Tutorial
Думаю, большинство знает схему работы библиотеки redux: view → action → middlewares → reducers → state → view

Подробности здесь.

Хочу представить вашему вниманию библиотеку, которая работает по тому же принципу для форм.

image
Читать дальше →
Total votes 14: ↑13 and ↓1+12
Views61K
Comments 20
1

Information

Rating
Does not participate
Location
Винница, Винницкая обл., Украина
Date of birth
Registered
Activity