Всем привет!
Только что выложили бету DBGlass PostgreSQL GUI клиент — https://github.com/web-pal/DBGlass.
Стандартные функции клиента — просмотр и редактирование данных.
К сожалению мы не являемся специалистами в области баз данных и PostgreSQL, явно упустили важный функционал или особенности работы базы. Будем рады фидбэку или пулл реквестам.
Для тех, кто не знаком с интерфейсом гитхаба, скачать бинарники можно тут — http://dbglass.web-pal.com
Рубрика «ReactJS» - 54
DBGlass — Open-Source кросс-платформенный PostgreSQL GUI клиент
2016-10-07 в 17:32, admin, рубрики: electron, javascript, postgresql, React, ReactJS, reduxУниверсальний (изоморфный) «шлем» для React js или Как удобно работать с head на React js
2016-10-07 в 8:11, admin, рубрики: javascript, node.js, react-helmet js node js javascript, ReactJS, метки: react-helmet js node js javascript
Ребята из nfl вылечили одну из болей React js, работу с head. Речь пойдет о библиотеке react-helmet. Она работает как на клиенте, так и на сервере.
Читать полностью »
JSX: антипаттерн или нет?
2016-09-28 в 12:14, admin, рубрики: javascript, jsx, react.js, ReactJS, Разработка веб-сайтов, уже в который разДовольно часто приходится слышать, что React и особенно JSX-шаблоны – это плохо, и хороший разработчик так не делает. Однако нечасто объясняется, чем именно вредит смешивание верстки и шаблонов в одном файле. И с этим мы попробуем сегодня разобраться.
Подход "каждой технологии свой файл" использовался с начала существования веба, поэтому неудивительно, что слом этого шаблона вызывает отторжение некоторых разработчиков. Но перед тем, как заявлять "нет, мы так делать не будем никогда", будет полезно разобраться истории и понять, почему JSX пользоваться можно, а смешивать скрипты и html – нет.
Javascript-фреймворки: должен остаться только один
2016-09-27 в 0:24, admin, рубрики: AngularJS, javascript, javascript framework, Meteor.JS, ReactJS, Блог компании Конференции Олега Бунина (Онтико), сергей аверин, метки: сергей аверинСергей Аверин (
XEK )
Изначально я хотел сделать доклад про сравнение фреймворков, но потом подумал, что закидают помидорами, поэтому доклад — просто адский троллинг, как водится у меня. И он, скорее, не про HighLoad, а про менеджерскую задачу, которая стоит над всем этим делом, включая фронтенд.
Про что же, все-таки, получился доклад? Доклад про то, как выбирали новый фреймворк, почему выбирали, и какие задачи решали.
Читать полностью »
Redux Action Creators. Без констант и головной боли
2016-09-26 в 9:35, admin, рубрики: front-end development, front-end разработка, javascript, npm, React, ReactJS, redux, Разработка веб-сайтов
Всем привет! Эта статья будет полезна тем, кто устал использовать constants в Redux (частично показано на превью выше). Под катом я покажу очередной возможный велосипед и как на нем кататься.
Как использовать Mongoose-схему для генерации graphQL-типов
2016-09-23 в 11:43, admin, рубрики: graphql, javascript, mongo, mongodb, mongoose, node.js, nodejs, npm, React, ReactJSВ данной статье я расскажу вам как исходя из своего опыта я написал небольшой npm-модуль, который помог мне и, думаю, может помочь вам сэкономить приличное количество времени и сократить код практически в два раза.
Все начал с того что я решил написать изоморфный CMS для одного из моих проектов с использованием следующих технологий:
- React — для постройки UI
- Express — в качестве сервера
- MongoDb + Mongoose — noSQL база данных
- graphQL — основной API для взаимодействия с базой данных
- Apollo-Client — коннектор для удобного вызова запросов и мутаций через graphQL
- webpack — для сборки проекта и разделения клиентского и серверного кода
Упрощенная архитектура выглядит следующим образом:
__root
1 |__client
2 |__public
3 |__middleware
4 |__server
- React-компоненты
- Бандл клиентского кода и остальные публичные файлы
- Mongoose: схемы, дополнительные методы и graphQL: типы, класс с запросами, класс с мутациями, схема
- Бандл серверного кода вместе с express сервером
React.js: собираем с нуля изоморфное – универсальное приложение. Часть 2: добавляем bootstrap, страницы и роутинг
2016-09-21 в 7:36, admin, рубрики: Bootstrap, isomorphic, javascript, node.js, react-router, react.js, ReactJS, redux
Разработка изоморфного приложения глазами моей жены
Это продолжение статьи про разработку изоморфного приложения с нуля на React.js. В этой части мы добавим несколько страниц, bootstrap, роутинг, концепцию Flux и ее популярную реализацию Redux.
Нянчим проект на React-redux с пелёнок
2016-09-21 в 7:28, admin, рубрики: javascript, React, ReactJS, redux, архитектура проектов, Блог компании HeadHunter, Программирование
В начале этого года мы в HeadHunter начали проект, нацеленный на автоматизацию различных HR-процессов у компаний-клиентов. Архитектурой этого проекта на фронте выбрали React-Redux стек.
За 9 месяцев он вырос из небольшого приложения для тестирования сотрудников в многомодульный проект, который сегодня называется “Оценка талантов”. По мере его роста мы сталкивались с вопросами:
- хранения стейта, его нормализации;
- построения масштабируемой архитектуры проекта, удобной иерархии — как в структуре, так и в бизнес-логике.
Это проявлялось в изменении подхода к построению компонентов, архитектуры редьюсеров.
Давайте поговорим о том, как мы развивали проект и какие решения принимали. Некоторые из них могут оказаться “холиварными”, а другие, напротив, “классикой” в построении большого проекта на redux. Надеюсь, что описанные ниже практики помогут вам при построении react-redux приложений, а живые примеры помогут разобраться, как работает тот или иной подход.
Читать полностью »
Доводы в пользу function tree
2016-09-18 в 20:50, admin, рубрики: AngularJS, cerebraljs, functions, javascript, pure functions, ReactJS, redux, side effects, state, функциональное программированиеВ этой статье мы поговорим о написании хорошего кода и о проблемах, с которыми мы при этом сталкиваемся. Понятный, декларативный, компонуемый и тестируемый — эти термины употребляются, когда речь заходит о написании хорошего кода. Решением проблем часто называют чистые функции. Но написание веб-приложений, в основном, связано с побочными эффектами и сложными асинхронными потоками операций, концепциями, которые по своей сути не являются чистыми. Ниже описан подход, который позволяет охватывать работу с побочными эффектами и сложными асинхронными потоками, сохраняя преимущества чистых функций.
Написание хорошего кода
Чистые функции — Святой Грааль в написании хорошего кода. Чистая функция — это функция, которая при одинаковых аргументах всегда возвращает одни и те же значения и не имеет видимых побочных эффектов.
function add(numA, numB) {
return numA + numB
}
Полезным свойством чистых функций является то, что их легко тестировать.
test.equals(add(2, 2), 4)
Компонуемость тоже является их сильной стороной.
test.equals(multiply(add(4, 4), 2), 16)
К тому же их очень легко использовать декларативно.
const totalPoints = users
.map(takePoints)
.reduce(sum, 0)
Но давайте взглянем на ваше приложение. Какая его часть действительно может быть выражена чистыми функциями? Насколько часто речь идёт о преобразовании значений, которые традиционно выполняют чистые функции? Могу предположить, что большая часть вашего кода работает с побочными эффектами. Вы выполняете сетевые запросы, DOM манипуляции, используете вебсокеты, локальные хранилища, изменяете состояние приложения и так далее. Это всё описывает разработку приложения, по крайней мере в Интернете.Читать полностью »
React.js: собираем с нуля изоморфное – универсальное приложение. Часть 1: собираем стек
2016-09-14 в 7:45, admin, рубрики: babel, eslint, express.js, isomorphic, javascript, node.js, react.js, ReactJS, Universal, webpack
Лицо моей жены, когда она вычитывала эту статью
Я решил написать цикл статей, который и сам был бы счастлив найти где-то полгода назад. Он будет интересен в первую очередь тем, кто хотел бы начать разрабатывать классные приложения на React.js, но не знает, как подступиться к зоопарку разных технологий и инструментов, которые необходимо знать для полноценной front-end разработки в наши дни.
Я хочу с нуля реализовать, пожалуй, наиболее востребованный сценарий: у нас есть серверная часть, которая предоставляет REST API. Часть его методов требует, чтобы пользователь веб-приложения был авторизован.