Как создать программу в контакте

VK.com — это самая популярная социальная сеть, созданная в Европе Павлом Дуровым. Создание приложений для вконтакте — это и есть программирование. Без умения и знаний программирования, сразу начать создание приложений для вконтакте вряд ли получиться.

Начало разработки

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

Создание приложений для вконтакте делится на три основных типа:

• с помощью iframe.
• на основе flash.
• самостоятельное на различных приложений

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

Типы приложений для ВК

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

Глеб Воронцов — «Как создать мини-приложение. Часть 1»

1) Iframe приложения. Данный вид может делаться с использованием разнообразных технологий, которые предоставляются браузерами и имеющиеся на данный момент. Потом на страницах социальной сети ВКонтакте будет сразу возникать еще и определенное окошко, в котором каждый сможет пользоваться данным приложением. Передавать, а также принимать данные самой программы будет посредством благодаря JavaScript.

2) Flash-приложения. Данный тип представляют собой разнообразные файлы и для них предусмотрено расширение типа.swf. Они могут делаться в среде специального Adobe Flash:

Затем еще производится и компиляция в файле.

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

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

• Action Script
• Adobe Flash
• 3D движки
• JavaScript

Помимо этого, на сайте Юду, вы сможете заказать себе любые услуги по созданию приложений в социальной сети вконтакте. Цена на такие услуги здесь имеют предельно доступную стоимость. Заказать создание приложений для «вконтакте» стоит именно здесь и потому, что эту процедуру осуществляют высококвалифицированные специалисты, которые имеют большой опыт работ.

Заработок денег, веселое время провождения — все это возможно с развлекательными приложениями. Как можно создать игру Вконтакте? Что для этого нужно, какие вложения и уровень знаний понадобится ? Давайте попробуем разобрать эту тему.

Концепция

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

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

Все это нюансы. А вот концепция, или если хотите, идея — вот что самое главное в разработке игры.

Вы должны сделать игровой процесс действительно интересным и увлекательным. Без этого успеха не добиться. Попробуйте представить себя на месте игрока. Вам самому было бы интересно проводить время за этой игрой?

Технические моменты

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

• JavaScript
• Adobe Flash
• Action Script

Первые шаги в сервисе разработчиков

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

Вот так выглядит главная страница.

Нас с вами интересует раздел «iFrame/Flash приложения для Вконтакте» . Переходим туда.

Знакомимся с интерфейсом, листаем страницу вниз, и идем по ссылке «Как создать приложение Вконтакте» .

От кнопки «Создать приложение» до публикации в каталоге — глазами разработчика

Привет! Меня зовут Олег Чикелёв, я разработчик сервисов на VK Mini Apps. Эта история началась буднично, как и многие другие: однажды я пришёл к другу с идеей приложения, и мы загорелись быстро сделать его на этой платформе. Расскажу вам о своём опыте разработки и о том, как выглядит жизненный цикл продукта с точки зрения разработчика.

Вы узнаете, как мини-приложения тестируются в баг-трекере и как они появляются в каталоге. А в качестве примера буду использовать нашу разработку — VK API/VK Bridge Sandbox.

Этап 1. Создание мини-приложения

Итак, у вас появилась идея для сервиса — мини-приложения. Для начала зайдите на страницу «Мои приложения» ВКонтакте и нажмите на кнопку «Создать». Введите имя, описание и тип приложения (в нашем случае — VK Mini Apps, это один из стандартных шаблонов). Затем выберите категорию и перейдите к настройке.

Этап 2. Разработка

Обычно приложения на платформе пишут на JavaScript с помощью React, как это сделали и мы. Также нам пригодилась библиотека компонентов VKUI, с её помощью мы привели дизайн сервиса в соответствие с оформлением ВКонтакте. Для использования в приложении API ВК и операционной системы пользователя мы применили VK Bridge. А поскольку API ВК и VK Bridge возвращают ответы в формате JSON, мы подключили стороннюю библиотеку RenderJSON. Хотя я и начинающий разработчик, но разобраться со всеми этими подключениями было довольно легко, помогла понятная документация.

Приложение не сможет работать без всех методов VK API и VK Bridge в быстром доступе, поэтому давайте их удобно упакуем. Для этого в папке с проектом создадим файл InfoMethodBridge.js и с помощью простого скрипта-парсера добавим туда с официальной страницы все методы, а затем и параметры к ним. Результат выглядит так:

Далее в панели с VK Bridge с помощью компонента Select покажем пользователю события на выбор:

В приложении это будет выглядеть так:

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

Поскольку это был мой первый опыт разработки для VK Mini Apps, в процессе я обращался за помощью в чат разработчиков — и мне помогали участники, которые уже не первый год работают с этой платформой.

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

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

Тот самый пустой массив:

Функция для внесения значений в массив:

Ещё интересный случай: нужно было придумать, как соблюсти все требования безопасности при получении ключа доступа для пользователя. Изначально мы сделали получение токена сразу со всеми правами, но служба поддержки отказалась принять такой вариант. Остановились на компоненте из VKUI, ChipSelect: пользователь сам выбирает нужные ему права доступа.

При этом мы в зависимости от метода выводим сообщение, какие права нужны приложению. Попутно пришлось решать ещё одну задачу: когда пользователь выбирал сразу несколько прав, ChipSelect возвращал массив с ними, однако вызывать метод получения ключа доступа нужно было со строковым значением. Пришлось придумать, как переделать массив в строку.

Сначала преобразовали начальный массив: прогнали его через map() и брали из каждого элемента label. Получился простой массив с именами параметров. Затем с помощью функции join() превратили его в строку:

Третья примечательная задача заключалась вот в чём: нам требовалось внести в файл больше 100 методов и каждому из них указать по несколько параметров. Делать это вручную очень не хотелось. К счастью, в API ВК удалось найти метод, позволяющий автоматически получить всю эту информацию со страницы. После этого мой друг написал скрипт, упаковывающий эти параметры, и у нас получился JSON-файл на 10 тыс. строк. Фрагмент:

Если вам интересно взглянуть на код приложения, то он есть в открытом доступе на GitHub.

Этап 3. Отправка приложения на модерацию

Когда приложение готово к отправке на тестирование, переключитесь в управление приложением и перейдите на страницу «Модерация».

Нажмите на кнопку «Отправить заявку» —вы увидите сообщение:

Прочитайте рекомендации, поставьте галочку и снова нажмите на кнопку. Откроется следующее окно, в котором нужно указать информацию о приложении: для какой аудитории оно предназначено, какие задачи решает, где будет доступно и так далее.

Заполните все поля и отправьте приложение на модерацию. Теперь ждите ответ службы поддержки.

Через некоторое время вам ответит агент. Он может спросить про реализованные в приложении функции или уточнить любую другую информацию. Например, так выглядело первое сообщение в нашей заявке на модерацию сервиса VK API/VK Bridge Sandbox:

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

Если визуальных проблем больше нет, то придёт сообщение об отправке приложения на проверку на уязвимости.

Томительное ожидание — и вот снова уведомление от ВКонтакте:

Ура, уязвимостей не обнаружили! Когда начнётся тестирование, придёт уведомление. Ждём.

Вечером следующего дня появилось уведомление о новой записи в /testpool. Там есть наше приложение, отлично!

Также пришло сообщение от поддержки:

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

Этап 4. Баг-трекер

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

За месяц тестирования нам пришёл 61 отчёт, каждый из которых мы проверили. Часть проблем исправили сразу, некоторые исправим в ближайшем будущем. Были и отчёты, которые мы отклонили: попадались дубликаты, не баги или наше любимое — by design.

Предлагаю посмотреть на несколько небольших исправлений, которые мы сделали на этом этапе:

1. Отсутствуют параметры для метода VK Bridge VKWebAppClose. Ого, как так? Неужели мы забыли про параметры? Но ведь без них метод не работает. Перешли на страницу документации к этому событию — и действительно, есть параметры, которые мы забыли указать.

Перешли в файл со всеми методами, их описаниями и параметрами, нашли нужное событие:

Ой, параметров и правда нет. Исправили.

Добавили параметры, зашли в приложение и проверили событие.

Увидели потерянные параметры, вернулись к отчёту и присвоили статус «Исправлен».

1. Неверно формируется JSON-массив правил в примере метода.

Как некрасиво. Чтобы исправить эту проблему, пришлось немного погуглить. Прошерстив интернет, нашли ответ: нам поможет свойство CSS white-space. Погрузились в проблемный код:

Сейчас никаких стилей нет. Исправляем:

Добавили свойство style, в котором указан стиль white-space: pre-line. Вернулись в приложение:

Теперь выглядит получше. Считаем, что баг исправлен. Пришли в отчёт и присвоили статус «Исправлен».

3. Бесконечная загрузка при вызове некоторых методов. Мой друг поставил в приложение индикатор загрузки (screen spinner), «чтобы было красивее». В итоге, если Bridge или API возвращали ошибку, этот индикатор не исчезал, а зависал. Пришлось его просто убрать.

4. Ошибочно передавался параметр VK Bridge. Есть вводимый параметр целочисленного типа, а в метод он передавался как строковое значение. Из-за этого возникала ошибка, причину которой я так и не обнаружил, пришлось накостылить.

Код для записи в вызов метода значения параметра, в котором появлялась ошибка:

А вот код с костылём: если у параметра тип integer (целочисленное значение), то он будет записываться как число, то есть без кавычек, а в остальных случаях — как строка, с кавычками:

Этап 5. Каталог

Напишите в диалог с поддержкой:

И дождитесь такого сообщения:

Теперь сделайте красивую обложку, загрузите её и сообщите об этом в диалог. Получите уведомление:

Ура, сервис попал в каталог! Теперь нужно создать баннеры для продвижения приложения в каталоге. Загрузите их на платформу и сообщите в диалог. Вскоре поддержка ответит, что приложение размещено в разделе «Новые».

Если после выхода в каталог внести изменения в приложение, его могут снова отправить на тестирование.

Итак, вы успешно провели своё мини-приложение по пути от создания до выхода в каталог. Можно порадоваться, но не расслабляться — и начать думать над следующим проектом.

Жизненный цикл мини-приложения для платформы VK Mini Apps:

Немного нашей статистики. Мы вышли в каталог 19 марта 2022 года, на следующий день было 79 просмотров. 3 апреля достигли пиковой на текущий момент посещаемости — 15 тыс. просмотров в сутки. С тех пор посещаемость сервиса падает: 17 июня — около 1 000 просмотров. Всё это исключительно органика, мы пока что не рекламировали свой сервис.

А теперь главный вопрос: что с деньгами? Разработка — штука увлекательная, но на хлеб его не намажешь. VK Mini Apps предлагает разные способы монетизации мини-приложений. Мы отказались от размещения рекламы у себя, вместо этого подключили платформенный сервис VK Donut.

Небольшой совет или даже обращение к коллегам-разработчикам: не сто̒ит делать мини-приложения, главная цель которых — реклама и заработок. Программы должны приносить пользу, а не быть пустыми поделками ради сиюминутной прибыли.

Надеюсь, моя статья помогла вам понять, как можно создавать сервисы для каталога приложений на платформе VK Mini Apps. Делитесь своим опытом!

• приложения
• разработка приложений

• Блог компании VK
• JavaScript

Источник: habr.com

Как создать приложение ВК самому: пошаговая инструкция

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

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

Самостоятельное создание приложения

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

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

Если вы интересуетесь, как создать приложение ВКонтакте бесплатно, вам нужно будет перейти по следующей ссылке: https://vk.com/developers.php. В документах написано, что все разрабатываемые приложения будут использовать API. Эта аббревиатура переводится с английского как интерфейс прикладного программирования. Иными словами, это перечень команд, которые могут использовать различные программы ВКонтакте.

Самый легкий способ

Если хотите создать свою программу в максимально короткие сроки, используйте конструктор приложений ВКонтакте. Free Apps

, к примеру, позволяет создать приложение за 5 минут.

Теперь вы знаете, в общих словах, как написать приложение для ВКонтакте.

Заработок денег, веселое время провождения — все это возможно с развлекательными приложениями. Как можно создать игру Вконтакте? Что для этого нужно, какие вложения и уровень знаний понадобится

? Давайте попробуем разобрать эту тему.

Типы приложений

Прежде чем начинать раздумывать о том, как создать приложение в ВК, необходимо знать, что на этом ресурсе есть два их типа. Это, кстати, отражено в документации.

• Flash-приложения. Они представляют собой файлы, для которых предусмотрено расширение .swf. Они делаются в среде Adobe Flash, затем производится компиляция в файл, после чего осуществляется из загрузка на сервера данного ресурса либо на свой сервер.
• Iframe (ифрейм) приложения. Они могут делаться с применением различных технологий, предоставляемых браузерами, имеющимися на сегодняшний день. Потом на странице ВКонтакте будет возникать определенное окно, в котором люди смогут пользоваться этим приложением. Передавать и принимать данные программа будет посредством JavaScript.

Библиотека VK Connect

Библиотека VK Connect предоставляет доступ к широким возможностям как самой сети «ВКонтакте», так и к возможностям устройства, если мы работаем из-под мобильного приложения. Для ее подключения нужно установить пакет vkontakte/vk-connect: npm i —save-dev vkontakte/vk-connect
.

Среди многочисленных возможностей VK Connect — сканирование QR-кода, получение геопозиции, вызов карточки контактов. Также есть широкие возможности по использованию возможностей соцсети: включение-выключение уведомлений, публикация записей на стене, авторизация сообщества, подписка на сообщения. Их нужно использовать с умом: например, существует ограничение на количество уведомлений — не более одного в сутки. Есть отдельные рекомендации по уведомлениям. Полный список возможностей представлен в документации.

Чтобы наше приложение вообще начало работу, нужно сначала выполнить инициализацию:

«ВКонтакте» не гарантирует поддержку всех событий на всех устройствах (iOS, Android, Web), поэтому лучше делать проверку такой поддержки перед исполнением кода:

if (connect.supports(«VKWebAppGetUserInfo»)) … VK Connect также обеспечивает поддержку запросов к API VK, если нужно что-то большее, чем может предоставить сама библиотека VK Connect: connect.send(«VKWebAppCallAPIMethod», >);

Что необходимо знать

Отдельно хочется сказать о некоторых языках программирования и технологиях, которые вам нужно будет знать. Как делать приложения в ВК, не зная их? Это нереально. Вот этот перечень:

• Adobe Flash
• Action Script
• 3D движки
• PHP
• HTML
• JavaScript

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

Исходники приложений

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

Однако если вы желаете получить исходник какого-то определенного приложения, следуйте этой инструкции:

• Устанавливаем его себе на страницу и запускаем.
• Кликаем правой кнопкой по странице и в меню нажимаем на «Исходный код». Видим код страницы (но не самой программы).
• В поиске пишем «http://», в результатах поиска ищем ссылку, заканчивающуюся на «.zip». Копируем ее и вставляем в адресную строку, удаляем косые линии. Нажимаем на Enter. Архив скачивается.
• Сохраняем архив. Заменяем расширение на .swf. Открываем в каком-либо флеш-плеере.

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

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

И еще чуть-чуть интересного: не для бизнеса, но тоже полезно

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

Пожертвования

Конечно, это главным образом сделано для благотворительных организаций и проектов. У ВК достаточно надежная финансовая система, чтобы обеспечить безопасный сбор денег. Иногда приложениями для пожертвований пользуются некоммерческие проекты, собирающие средства на различные нужны. Это называется донатами. Например, всё тот же мой любимый «ангельский» паблик просит подписчиков по желанию донатить на кофе админам и на билеты на концерт Дженнифер Лопес. :)) Вот как это реализовано в сообществе: Приложений для сбора денег несколько, выбирайте любое, какое вам больше нравится:

Чат

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

Тесты

Вакансии

Афиша

Ну и завершаю свою мини-подборку «не совсем для бизнеса» приложением, с помощью которого вы можете анонсировать события, планирующиеся в вашей организации. Это подходит как для движа внутри компании (корпоративы, выезды, обучения и др.), так и для взаимодействия с клиентами, если ваша работа заключается как раз в организации разных крутых событий. Вот приложение: А вот пример его использования в официальном сообществе группы Би-2:

Платная разработка приложений

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

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

Концепция

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

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

Все это нюансы. А вот концепция, или если хотите, идея — вот что самое главное в разработке игры.

Вы должны сделать игровой процесс действительно интересным и увлекательным. Без этого успеха не добиться. Попробуйте представить себя на месте игрока. Вам самому было бы интересно проводить время за этой игрой?

Бесплатные программы

Программы для приложений ВКонтакте можно скачать в Интернете бесплатно. В первую очередь, конечно, потребуется скачать Adobe Flash. Это главная и основная программа, которая позволит вам начать работу над своим проектом. Данная программа для создания приложения очень удобна. Однако работать с ней новичку нелегко.

Но со временем появляются навыки и пользоваться ею становится проще. Остальные проги для приложений тоже отличаются удобством в использовании. 3D движки, например, значительно ускоряют и упрощают процесс создания приложений.

Первые шаги в сервисе разработчиков

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

Вот так выглядит главная страница.

Нас с вами интересует раздел «iFrame/Flash приложения для Вконтакте» . Переходим туда.

Знакомимся с интерфейсом, листаем страницу вниз, и идем по ссылке «Как создать приложение Вконтакте» .