Сообщество - Web-технологии

Web-технологии

521 пост 5 813 подписчиков

Популярные теги в сообществе:

0

Явное управление ресурсами в TypeScript — using

Явное управление ресурсами в TypeScript — using Кросспостинг, Pikabu Publish Bot, Typescript, Frontend, Текст, Telegram (ссылка), Программирование, IT, Длиннопост

Недавно, когда я рассказывал, как мы пишем тесты, я уже упоминал, что в TypeScript’е появилось новое ключевое слово using. Оно позволяет нам сделать код чище и более линейным, избавившись от try/finally.

Но мы можем использовать using не только, когда открываем файл или подключение к базе данных, иначе его использование ограничилось бы исключительно сервером.

Мне нравится рассматривать using, как Undo/Redo только наоборот, сперва мы выполняем какое-то действие, а в конце отменяем его:
- создали объект, удалили
- показали спиннер и скрыли, когда получили данные

Причем отмена удобно происходит в самом конце функции, даже если мы используем async/await.

Вот простой пример, как можно использовать using, чтобы показывать/скрывать спиннер в React коде.

// обычный код на React
useEffect(() => {
try {
setIsLoading(true);
await await Promise.resolve().then(() => console.log("promise.resolve"));
} finally {
setIsLoading(false);
}
}, [])


// такой же код, с использованием using
useEffect(() => {
using manager = new LoadingManager(setIsLoading);
await await Promise.resolve().then(() => console.log("promise.resolve"));
}, []);

/**
* Класс, который управляет состоянием спиннера
*/
class LoadingManager {
constructor(private setIsLoading: (value: boolean) => any) {
this.setIsLoading(true);
console.log("constructor");
}

[Symbol.dispose]() {
this.setIsLoading(false);
console.log("disposer")
}
}

// В консоли будет выведено в следующем порядке
// constructor
// promise.resolve
// disposer

Код можно открыть в песочнице.

К сожалению, нельзя опустить переменную manager, но это лучше, чем лепить везде try / finally.

Ещё по теме:
- using Declarations and Explicit Resource Management
- Явное управление ресурсами: пробуем новую фичу JavaScript и TypeScript

https://t.me/cherkashindev/164

Показать полностью

Видосик

Требуется помощь веб-разработчиков (сила Пикабу!)

upd^ СПАСИБО , ПОМОГЛИ!!!

Ребятушки- кулцхакеры, есть к вам просьба.

Есть такая приложуха iSki, которая пишет треки. Таких много, но у этой отличие в том что можно добавлять друзей и смотреть их движ, кто где катается.

Но у приложухи есть несколько недостатков, один из них в том что нет экспорта чистого GPS-трека.

Есть только экспорт ссылки по которой его можно посмотреть, пример: https://share.iski.cc/shares/share_iski/tracks/bDMZCqdpzdFyx...

Требуется помощь веб-разработчиков (сила Пикабу!) Веб-разработка, Web-программирование, Парсинг, Хакеры

Вопрос:

1) есть ли данные трека в файлах этой веб-страницы, которые прилетают на комп, или все рисуется на сервере?

2) можете ли вы помочь - подсказать как выцепить эти данные? хотя бы в каком файле или как их посмотреть?

Я лет 20 назад кодил на JS и PHP, но мои знания уже безнадежно устарели....

Показать полностью 1
7

Pinky Chat — PHP-скрипт живого чата

Pinky Chat — PHP-скрипт живого чата Программирование, Скрипт, Скачивание, Telegram, Веб-разработка, IT, Программист, Длиннопост
Pinky Chat — PHP-скрипт живого чата Программирование, Скрипт, Скачивание, Telegram, Веб-разработка, IT, Программист, Длиннопост
Pinky Chat — PHP-скрипт живого чата Программирование, Скрипт, Скачивание, Telegram, Веб-разработка, IT, Программист, Длиннопост

v1.6 (10.01.2024)

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

Функционал:

- Неограниченное общение в реальном времени

- Двусторонний обмен файлами

- Чат между операторами

- Стандартные ответы (ярлыки)

- Многоязычная поддержка (переводится на любой язык)

- Адаптивное окно чата (удобно для мобильных устройств)

- Междоменная поддержка

- Отправка транскриптов пользователям

- Несколько Поддержка отделов

- Страница контактов, когда нет операторов онлайн

- Черный список отображения виджетов

- Поддержка встроенных виджетов

- Полноэкранный режим чата

- Настраиваемые аватары, смайлики, тон уведомлений и т. д.

- Разговор нескольких операторов и гостей

- Звуки уведомлений о сообщениях

- Пользовательские шаблоны чата

- Встроенная аналитика ( Отслеживайте трафик посетителей, источник трафика и т. д.)

- Отслеживание пути посетителей

- Настройки производительности

- Пользовательские позиции виджетов

- Обнаружение Adblock

- Режим обслуживания

- Защита от капчи (включена Google reCAPTCHA)

- Поддержка как SMTP, так и собственной почты PHP

- Поддержка надстроек

- Система коротких кодов

- Блокировка нежелательных IP-адресов пользователей

- Простая панель установщика

Больше информации и сам скрипт можно скачать тут

Показать полностью 2
0

WhatsApp вводит в приложение функцию создания пользовательских стикеров

WhatsApp вводит в приложение функцию создания пользовательских стикеров Информационная безопасность, Интернет

Стикеры WhatsApp станут еще более интересными и личными. Приложение для обмена сообщениями, внедряет новую функцию для iOS, которая позволит пользователям создавать, редактировать и делиться своими собственными стикерами.

Раньше стикеры обнаруживались и распространялись через сторонних поставщиков или через галерею телефона человека. Теперь пользователи могут создавать стикеры в приложении или редактировать существующие стикеры с помощью набора инструментов редактирования.

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

Стикеры, изготовленные на заказ, после отправки автоматически сохраняются в лотке для наклеек пользователя.

http://t.me/Infooasis

Показать полностью
13

Обновление на сайте SQLtest.online

Привет подписчикам и всем, кто изучает SQL! Совсем недавно мы выпустили очередное обновление на сайте SQLtest.online, а именно – добавили возможность входа.

Логин на сайте абсолютно не обязателен. Вы можете продолжать решать SQL-задачи и без него. Кстати, у нас теперь появились новые увлекательные задачи, и их уже целых 27! Единственное, что предоставляет логин – это возможность сохранить свой прогресс. Для каждой задачи мы сохраняем дату последней попытки, дату решения и ваш вариант решения. Дополнительно к этим данным сохраняется ваш логин (без пароля), и все, никаких персональных данных не хранится!

В настоящее время логин возможен только через Яндекс и GitHub, но со временем добавим больше вариантов. Пока что, если вы заинтересованы, просто нажмите "Login"!

Обновление на сайте SQLtest.online SQL, Mysql, Обучение, Тестирование, IT, It обучение

До следующей встречи! 🚀

11

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу

Всем доброго времени суток! Как-никак, а шило кое-где есть, поэтому недавно познакомился с красивой-прекрасной библиотекой playwright. Ее, вообще, для тестирования используют. Проверять, как работает сервис. Но отдельно у нее есть апишка, которая позволяет отдельно, вне тестирования, запускать процесс браузера и совершать действия внутри него.

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

Технологии, которые нужно понимать перед началом:

JavaScript
Node JS
NPM

  1. Создаем проект и устанавливаем зависимости

    Сначала создаем папку pikabu в любом удобном месте.

    Внутри папки открываем терминал\любой редактор кода с терминалом, вводит следующие команды:

    npm init -y

    npm i playwright

    npx playwright install

    Когда все готово, создаем файл index.js в корне каталога.

    2. Работаем с браузером и учим робота вводить данные

Импортируем chromium из playwright

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу Программа, Windows, Linux, Гайд, Инструкция, Программирование, Гифка, Длиннопост

Создаем контекст браузера, создаем новую страницу.

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу Программа, Windows, Linux, Гайд, Инструкция, Программирование, Гифка, Длиннопост

Абсолютно все команды в библиотеке асинхронные и возвращают промисы. Поэтому отвечаем им await.

Значение headless в инициализации браузера отвечает за то, появится ли UI браузера при запуске программы. При тестировании ставим false, когда программа готова - true

Отправляем нашу программу на главную страницу Пикабу:

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу Программа, Windows, Linux, Гайд, Инструкция, Программирование, Гифка, Длиннопост

И запускаем программу при помощи node index.js

Результат:

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу Программа, Windows, Linux, Гайд, Инструкция, Программирование, Гифка, Длиннопост

Открывается браузер, открывает пикабу, висит, ничего не делает. Все работает!

3. Взаимодействуем со страницей

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

В данном случае нам нужна форма авторизации.

Чтобы узнать уникальный идентификатор элемента открываем в браузере инструменты разработчика, кнопкой f12. Выделяем нужный элемент и смотрим атрибуты, которые принадлежат только ему.

инпут с логином можно найти через идентификатор input[name="username"], а с паролем - input[name="username"].

Пропишем код, который позволит программе найти эти инпуты:

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу Программа, Windows, Linux, Гайд, Инструкция, Программирование, Гифка, Длиннопост

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

Инпуты получили и можем их заполнить:

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу Программа, Windows, Linux, Гайд, Инструкция, Программирование, Гифка, Длиннопост

Включаем программу:

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу Программа, Windows, Linux, Гайд, Инструкция, Программирование, Гифка, Длиннопост

Инпуты заполняются, но форма не передается. Нужно определить кнопку, которая запустит процесс авторизации и нажать на нее:

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу Программа, Windows, Linux, Гайд, Инструкция, Программирование, Гифка, Длиннопост

дополняем инструкцией, чтобы браузер закрылся:

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу Программа, Windows, Linux, Гайд, Инструкция, Программирование, Гифка, Длиннопост

Пробуем:

Пишем интернет-бота при помощи джавскрипт на примере авторизации на Пикабу Программа, Windows, Linux, Гайд, Инструкция, Программирование, Гифка, Длиннопост

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

Показать полностью 10
2

Проект SQLtest: Открытое Программирование и GitHub Сообщество

Привет, друзья! Хочу поделиться с вами новыми подробностями разработки моего нового проекта sqltest.online, который я решил разрабатывать публично. Весь код проекта будет доступен на GitHub по адресу https://github.com/rozhnev/sqltest

Предыдущие вытуски серии можно увидеть здесь, здесь и тут.

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

Никаких претензий на звание "идеального кода" у меня нет. Это будет функциональный код, который делает свою работу. Если у вас появятся вопросы или предложения по коду, вы можете обсудить их с помощью стандартных инструментов на GitHub.com.

На сервере я создал пользователя с именем deployer и предоставил ему доступ к загрузке кода из репозитория. Теперь я могу легко применять все обновления сайта одной простой командой.

После этого я выполнил клонирование кода проекта из репозитория на сервер и изменил настройки Apache так чтобы он использовал для сайта папку проекта

Если сейчас зайти на сайт при помощи браузера он покажет содержимое папки.

Проект SQLtest: Открытое Программирование и GitHub Сообщество Linux, Git, Github

Сайт показывает список файлов проекта

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

После этого я смогу применять все обновления сайта простой командой

sudo su - deployer

cd /var/www/sqltest

git pull

Следите за новостями и присоединяйтесь к обсуждению на GitHub! 🚀

Задавайте вопросы по проекту в телеграм-чате

Показать полностью 1
Отличная работа, все прочитано!