100

One Punch Web - автоматизация всего что можно до одной кнопки

Всем привет!

Последние пару лет я занимаюсь node.js разработкой, из которых несколько месяцев делаю свой "швейцарский нож(костыльный монстр) на все случаи жизни" - One Punch Web.

One Punch Web - автоматизация всего что можно до одной кнопки Nodejs, Приложение, Гифка, Длиннопост

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


Постараюсь как можно более подробно описать детали проекта. Надеюсь, кому-то это покажется интересным и не сильно скучным)

Используемые технологии

- Nw.js как ядро проекта, для окошек gui и обработки сочетаний клавиш

- Vue.js + Element.js для интерфейса

- Node.js для написания инструментов командной строки (CLI)

- Sublime text как текстовый редактор

- Wireframe.cc для управления wireframes

- Xmind для редактирования интеллект-карт

- Яндекс диск для бекапов

- Nedb.js как база данных всего приложения


В центре всего окошко One Punch Menu, которое вызывается поверх всех окон из любого места по сочетанию клавиш (которое я повесил на кнопку мышки). До вызова оно ждет своего часа в трее системы

One Punch Web - автоматизация всего что можно до одной кнопки Nodejs, Приложение, Гифка, Длиннопост

Карта функционала проекта

One Punch Web - автоматизация всего что можно до одной кнопки Nodejs, Приложение, Гифка, Длиннопост

Основные фичи

1. One Punch Snippet

Все сниппеты(куски кода для переиспользования), плагины и расширения для sublime text хранятся в папке проекта One Punch Web. При изменениях, или добавлении новых объектов идет синхронизация (перезапись старых, удаление лишних) с папкой sublime text. Основной задачей было сделать быстрый доступ для создания, изменения, удаления сниппетов.

One Punch Web - автоматизация всего что можно до одной кнопки Nodejs, Приложение, Гифка, Длиннопост

2. One Punch Cli

Так же как и сниппеты, быстро создаются, редактируются и удаляются.

Это node.js скрипты, которые можно вызвать из командной строки в текущей папке. Используются для генерации приложений и автоматизации рутинных задач.

Пример в гифке - подготовка файла шрифта для вставки на сайт

One Punch Web - автоматизация всего что можно до одной кнопки Nodejs, Приложение, Гифка, Длиннопост

3. One Punch Code (codeprocessors)

Есть препроцессоры кода, есть постпроцессоры. Почему бы не сделать просто процессоры?

Бывает лень/долго разворачивать(на маленьких проектах) gulp/webpack когда, к примеру, хочу использовать некоторые функции less. Решением было написание плагина для sublime, который отправляет фрагмент выделенного текста в проект One Punch Web и возвращает на его место обработанный результат.

Пример - less2css, autoprefix, css-beautify, css в одну линию и сохранение сниппета из выделения

One Punch Web - автоматизация всего что можно до одной кнопки Nodejs, Приложение, Гифка, Длиннопост

4. One Punch Search

Вместо открытия вкладки google в браузере, я отрываю google в One Punch Menu.

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

Помогает когда не могу найти что гуглил ранее, либо когда ищу одно и то же


5. One Punch Mindmap

Для визуализации причинно следственных связей в проектах.

Были разработаны 2 cli для создания и открытия mindmap файлов через xmind


6. One Punch Wireframe

Для схематичных набросок пользовательских интерфейсов. Для этого интегрировал сайт wireframe.cc. В базе программы хранятся только ссылки на wireframes.


7. One Punch Backup

На работе у меня linux(ubuntu), дома ноутбук и стационарник с виндой. С проработкой функционала под кроссплатформ проблем особо не было, а вот с переносом всего добра они периодически возникали. Раньше использовал git, но по некоторым причинам решил сделать иначе.

Сейчас это zip-архивы, которые лежат на яндекс диске (мне повезло с аккаунтом на 200гб).

Чтобы перенести все наработки, достаточно нажать одну кнопку и через минуту я буду во всеоружии



Планы на ближайшее будущее


- One Punch Cheatsheet

Для создания своей документации к технологиям и библиотекам. Вдохновила эта реализация


- One Punch Guide

Для периодических тренировок/code kata


- One Punch Chrome

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

Огромное спасибо всем, особенно тем кто дочитал до этого момента)

Проект находится в процессе разработки, буду искренне рад любой критике.

Оставлю пару комментариев для минусов, на всякий случай

Найдены дубликаты

+7

Сложна...

Но плюсану, на всякий случай. Дрочить не имеет смысла, я думаю...

раскрыть ветку 1
+4
Смысла может и не имело, но что сделано, то сделано
+3
Изобрели selenium?
раскрыть ветку 2
+6

это не только костыльный монстр, но еще и велосипедный парк)

+2

Скорее IDEA, селениум (в любой его ипостаси) - это сильно про другое.
На деле тоже непонятно: это какое же количество проектов в неделю надо клепать, чтобы требовалась ТАКАЯ реюзабельность

+2

ссылку то дай посмотреть в живую )

раскрыть ветку 1
0

как только сделаю полноценную релиз версию, так сразу) Сейчас слишком много нюансов при установке

+2
Какие тут все умные однако.
+1
@webkitten,привет! Ты статистику забросил что-ли?
раскрыть ветку 2
+1

привет) Нет, я как правило с 5 по 7 выкладываю. На данный момент стата собирается

раскрыть ветку 1
+2
А, ну подождем
Иллюстрация к комментарию
+1

очень специфичный кейс нужен для этого монстра Врядли комуто пригодится. И что сллжного в развертывании гулпа? Копипастнуть готовый гулп файл?

раскрыть ветку 3
+4

Проект сам вырос до таких масштабов, он подстраивался под мои нужны исходя из разных ситуаций. Я работал в веб студиях и фрилансил в проектах в которых даже не слышали о каких-то там gulp-ах. По ощущениям, они застряли в году так 2011 (и таких реально много)

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


В посте еще не весь функционал программы описан. Проект готов к новым испытаниям, я буду его еще обкатывать. Со временем ненужный функционал отпадет и может быть он окажется полезным кому-либо еще кроме меня)

раскрыть ветку 2
+1

Привет)как успехи с программой?

раскрыть ветку 1
+1

Хм. Я попал на хабр?

раскрыть ветку 2
+5

думал как-то разбавить посты статистики пикабу)

раскрыть ветку 1
+1

неплохая штука. Использовать её я конечно же не буду

0

ТС, привет

у тебя есть что-то подобное?

https://der.ttyh.ru/stat/gui.html?top=top_rating_1

а то тут немного устаревшая информация

раскрыть ветку 1
+1

привет) Это выборка из собранной мной базы, она еще не сильно устарела. И похоже, закрыли тему с просмотром подписчиков через мобильное апи

-1

как заипали сайты с этими тоннами фреймворков-библиотек и прочего говна

-3

для минусов 2

раскрыть ветку 2
0

Ещё раз, в кратце, для каких целей?

раскрыть ветку 1
+2

Для комплексного подхода к задачам на работе/фрилансе, обучению(структуризации знаний), автоматизации (в планах разворачивать чистые шаблоны cms за 10 сек)


когда я берусь за изучение какой-нибудь новой библиотеки, то

- составляю mindmap

- делаю заметку(markdown), куда выписываю важные детали

- делаю cheatsheet

- создаю guide для закрепления полученных знаний на практике путем повторений

Потом у меня есть доступ ко всему этому)

-3

для минусов 1

Похожие посты
Похожие посты не найдены. Возможно, вас заинтересуют другие посты по тегам: