Кастомная новая вкладка браузера

UPD: кажется нашел способ сделать чисто на клиентсайде без сервера, выпущу новый пост если чо

Зачем своя новая страница, если есть, допустим закладки?

1) Синхронизация между браузерами/устройствами. Мои закладки хранятся в одном месте, и одинаковые будь я на ПК или с телефона. Синхронизацию также могут предложить определенные браузеры, типа Яндекса, но для этого нужно чтобы на всех устройствах был браузер от одного вендора, что меня не устраивает - на ПК у меня edge, а на телефоне kiwi(из-за расширений и девтулсов). И, очевидно, при переезде на другой браузер всё свое, всё с собой.

2) Удобство новой страницы над закладками. С телефона для доступа к закладкам нужно открывать отдельное меню = лишний шаг. С ПК им уделяется небольшое место сверху, помещается мало. На новой же вкладке помещается намного больше, сами кнопки больше и с иконками.

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

2) Удобный контейнер иконок в мобильной версии. По умолчанию показаны лишь первые иконки, скроллом можно раскрывать контейнер снизу, близко размещенный к пальцам.

1) Self-hosted сложная установка. Это не скачать exe'шник и запустить, это не зайти на сайт и создать аккаунт. Нужно иметь NodeJS/NPM, склонировать репозиторий, и где-то это чудо хранить активным. Можно арендовать отдельный сервер, но я использую в качестве сервера свой же телефон через Termux. Использую телефона а не пк, т.к. телефон всегда включен, и не будет ситуации что я не смогу с телефона открыть новую вкладку из-за того что компьютер выключен. На компьютере также всегда будет работать т.к. в одной сети с телефоном. Бонусом идет постоянное висячее уведомление от Termux. Ранее я для этого имел дома отдельный телефон-сервер всегда подключенный к зарядке и подключался к странице даже на улице через проброс портов и бесплатный домен третьего уровня с afraid.freedns, но из-за бесплатного домена подключение могло занимать аж до двух секунд

2) Все-таки у некоторых сайтов автоматически иконки спарсить не получится, и, надо или самому их сидеть искать скачивать с сайта, или найти сайт с похожей иконкой, или забить. UPD: теперь использую для этого сторонний сервис, и с этим намного лучше, находит иконку в 99% случаев

Я знаю, что тут все айтишники, но на всякий распишу для работяг с завода с достаточным упорством для работы с линуксом из-за аниме-девочки на новой вкладке.

1) В случае с телефоном устанавливаем Termux. Однако делаем это не с Google Play, а с 4PDA(нужна регистрация), при ошибках в духе не удалось подключиться к зеркалам - искать там же.

2) Установка NodeJS&NPM. на Termux: pkg install nodejs-lts или pkg install nodejs. LTS - более стабильная, не LTS - более новая. Помню у меня не запускался один из NodeJS проектов из-за слишком высокой установленной версии NodeJS, так что имейте это ввиду. На линуксе можно посмотреть команды для установки в оф репозитории, или вот к инструкции обратиться через nvm, собственно первая ссылка в яндексе. В общем, если что, идем в поисковик.

3) Клонируем репозиторий. Собственно для этого нужно сначала установить git. Термуксойды - pkg install git. Ubuntu'исты - sudo apt install git. Вводим в желаемой локации git clone github.com/AriesAlex/ariex-custom-tabpage. Будет создана подпапка ariex-custom-tabpage. При желании можно переименовать.

4) Идем в подпапку cd ariex-custom-tabpage. Вводим npm run init. Эта команда сбилдит статику и сразу запустит сайт на порте 4554. Остановить сервер можно хоткеем Ctrl+C. Для повторного запуска сайта билдить не нужно, просто будучи в папке ariex-custom-tabpage ввести npm run start. Если появится от меня какой апдейт можно его скачать командой git pull, после этого скорее всего все-таки придется пересобрать статику - npm run build-static

5) Собственно сайт работает. Если не устраивают дефолтные видео-обои, то в папке data есть video.mp4 и video_mini.mp4 для телефона. Если у вас нет отдельного видео для телефона можно попробовать просто скопировать одно и то же видео как video так и video_mini. За видео-обоями можно пойти в мастерскую Wallpaper Engine в стиме. Скачивать через всякие онлайн Steam Workshop Downloader в гугле. Ну или если куплен в стиме скачать и искать на ПК. Мне повезло, что автор текущих обоев сделал версию как для ПК так и для телефона, собственно вот ссылка на пк, вот для телефона. Автор Cybust, у него на ютубе есть ролики как он из артов делает живые обои.

6) Установка в браузер. Собственно в моем хромоподобном на телефоне делается так

Перед тем как использовать на компьютере, сначала надо бы прописать для телефона статический локальный айпишник.

Важно знать какой у вас текущий айпишник и шлюз(роутер), посмотрите там же в настройках сети, или через ipconfig на пк(гугл в помощь). 192.168 вначале всегда одинаковый, однако третья цифра скорее всего у вас или 0 или 1 в зависимости от настроек роутера. Собственно в новом айпишнике пишите третью цифру такую же как была, а последнюю - как захотите, примерно от 1 до 255, например 100, 101 или 200. Если никак не можете в своем андройде найти подобное меню с айпишником, то ищите лучше, скорее всего оно есть. Если что, в гугл)

Теперь когда в локальной сети у нашего телефона постоянный один и тот же айпишник, время для настройки на ПК

Я использую Edge, и у него в настройках нет возможности заменить дефолтную страницу. Но можно через регистр. Если у вас другой браузер, поищите в настройках/интернете. Если Edge, то качаем reg файл, где в последней строчке заменяем ip на телефона выбранный выше. Закрываем полностью Edge, через диспетчер задач, или win+r и команда taskkill /f /im msedge.exe, запускаем .reg файл, открываем браузер. Советую включить закрытие окна браузера при закрытии последней вкладки, а для перехода в новую вкладку когда всего одна вкладка приучить себя использовать кнопку домика(включается в настройках)

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

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

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