Освой 95% Antigravity за 30 минут - Обгони ВСЕХ transcript

Google буквально месяц назад выпустил один из самых передовых инструментов в целом на рынке AI на сегодняшний день. Этот инструмент прямо сейчас переворачивает полностью всю игру по AIгентам и вайп-кодингу. И уже буквально через 30 минут ты создашь своё собственное веб-приложение с помощью AI, которым мы сейчас будем пользоваться с тобой вместе, и загрузим его в интернет, чтобы ты мог сам этим же приложением пользоваться и закрывать определённые задачи. Смотри, сейчас произойдут три вещи. Первое, ты освоишь самый мощный инструмент на текущий момент вообще в принципе в AI - это Google антигравити. Я покажу тебе все основные скрытые функции, которые на данный момент здесь есть, чтобы ты умел ими пользоваться. Даже те, о которых мало кто знает и вообще практически никто не говорит. Второе, у тебя появится работающее веб-приложение уже буквально через полчаса, которое ты сможешь запустить, соответственно, самостоятельно и, возможно, в том числе, показать его клиенту. Третье, у тебя будет папка с файлами, со всеми шаблонами, которые я буду здесь сегодня использовать. У тебя будет возможность их скачать абсолютно бесплатно. Я покажу в конце видео, как это сделать. И что самое интересное, тебе не нужно уметь программировать вообще. Я сам ни строчки кода не написал.

AI всё делает за меня. Мы сегодня с тобой будем просто диктовать голосом то, что нам необходимо будет сделать. Найдём примеры дизайнов, которые мы хотим здесь видеть. Загрузим всё это сюда. И посмотрим, собственно, каким образом он это нам всё сделает буквально за это время. Итак, для начала я покажу, каким образом можно пользоваться сейчас антигравити в России. И у многих из вас, соответственно, можно будет пользоваться даже без VPN. Значит, смотрите. Для начала первое, что нам нужно сделать, нам нужно зайти на сайт antigravity.google, да, скачать, соответственно, там для Mac либо для Windows, соответственно, этот антигравити. Он устанавливается у вас на компьютер. И после этого одно из самых важных моментов будет у вас, соответственно, работа с аккаунтами, да, потому что у многих, когда вы запустите свой Google аккаунт туда, то возникнет такая ситуация, что российские Google аккаунты, которые были зарегистрированы именно в РФ, они, к сожалению, под антигравити не подходят. То есть у вас не будет возможности пользоваться, в принципе, антигравити с российскими Google аккаунтами. Поэтому, а, есть несколько вариантов решения этого вопроса. Первый вариант решение вопроса. Вы, соответственно, используете VPN, американский VPN, но сразу предупрежу, что не все американские VP работают с антигравити. Тоже нужно понимать. Поэтому здесь, конечно, будет определённый процент получения аккаунтов, да. И второй вариант, который я вам рекомендую, я вам дам ссылочку на магазин, где можно купить аккаунты Guminii на год за буквально там 1.000 руб. Поэтому вы, в принципе, сможете за 1.000 руб., грубо говоря, приобрести себе возможность пользоваться всеми Google сервисами в течение года и более того, использовать антигравити с огромными лимитами, в том числе с моделями Cloud, Gina и так далее и тому подобное. Поэтому ссылочка у вас тоже будет. Я в конце расскажу, каким образом можно будет купить эти аккаунты. Итак, первое. Мы скачали с вами антигравити. У вас открывается вот такой интерфейс. Давайте я сразу расскажу преимущество, потому что есть антигравити, есть код, есть, например, курсор, то есть это плюс-минус похожие программы и так далее и тому подобное. Значит, что это такое и для чего он нужен. Значит, смотрите. Основное преимущество антигравити перед всеми сервисами, которые в целом у нас есть, которые позволяют писать код, оно заключается в том, что, во-первых, здесь сильно больше лимиты по тому же самому ClУСУ, например, который мы можем использовать и по Gemini 3 Pro на подписке, соответственно, чем, например, в том же самом клод-коде либо в курсоре. Это первый момент. Второй момент, здесь всё нативно интегрировано внутри, да? То есть, соответственно, у нас есть очень оптимизированная связка между агентом и непосредственно вот файловым менеджером, который здесь есть. Одна из самых ключевых фишек в антигравити - это агентный менеджер, который я вам покажу чуть позже, когда мы можем, соответственно, создавать агентов внутри антигравити и потом общаться с ними, как в обычном диалоговом окне. И третья основная фишка, это заключается в том, что мы можем создавать глобальные правила и глобальные workflow, которые мы можем использовать в любом диалоге. То есть, например, у нас есть, допустим, там разные агенты. Я сейчас чуть позже покажу, как это делать. Допустим, один агент для занесения информации в Google таблице, второй агент для, например, Ноушена, третий агент там для парсинга каких-то данных, четвёртый агент для телеграмбота и так далее и тому подобное, да, и мы можем, соответственно, создавать этих агентов внутри глобального интерфейса вот этого антигравити для того, чтобы потом иметь возможность из любого диалогового окна получать доступ именно вот к этим агентам и, соответственно, их вызывать простой обычной командой. Я чуть попозже покажу, как это делать. Итак, значит, первое, когда мы заходим вот сюда, у многих из вас, соответственно, антигравити может работать без виpна. Но для этого, конечно, нужен правильный аккаунт, да. То есть аккаунт нужно один раз зарегистрировать с помощью ВPN. После этого вы, соответственно, заходите сюда. Если у вас без VPN работает, значит, всё замечательно. Проверить можно написать любое любое сообщение вот здесь в чат, да, если ответ пришёл без випина, значит всё замечательно. Вы можете работать без виpна. Если, соответственно, у вас не сработает, тогда, в принципе, можете использовать любой другой VPN и так далее и тому подобное. Но самое ключевое, почему у многих людей не работает антигравити именно в России - это наличие правильного аккаунта, да, потому что российские аккаунты Google, они не работают, к сожалению, с антигравити. Поэтому самым лучшим вариантом - это будет, в общем-то, приобрести просто аккаунт jмина год, и тогда всё у вас будет замечательно. Итак, что мы здесь видим? Мы видим, по сути с вами, здесь три основных окошка, да? То есть первое слева - это наш файловый менеджер, да? То есть здесь будут все наши файлы, все наши инструкции, все наши чек-листы, все наши файлы с кодом и так далее и тому подобное. Значит, посередине окошка это, по сути, окно, где мы будем открывать эти файлы, которые у нас здесь есть слева, да, например, ну и справа - это, в общем-то, наш чат, да, то есть чат с нашим агентом. Задавать ему определённые вопросы, писать определённые инструкции, выбирать модельки и так далее и тому подобное, да? То есть, в принципе, всё очень просто. Здесь, конечно, есть другие функции, но о них я буду разговаривать чуть попозже. Покажу большое количество разных скрытых функций, о которых мало кто знает, и покажу, как их настраивать, для чего они нужны. Итак, а для начала, когда вы только открываете антигравити, вам необходимо создать папку на вашем компьютере для того, куда мы будем, соответственно, наши файлы собирать. У вас, в общем, будет вот такое окошко, да, мы нажимаем Open Folder и выбираем, в общем, любую папку на вашем компьютере, на рабочем столе, неважно где, в программах, абсолютно это неважно, а в которой будут содержаться все файлы нашего текущего проекта. Это пустая папка, там ничего не должно быть, но, в принципе, она должна у вас быть. Поэтому давайте я сейчас её открою, создам папку и откроем её быстренько. Вот. Всё, мы открыли папку. У нас она называется Project, да? То есть вот моя папка здесь. Вот. В принципе, все файлы, которые мы в эту папку будем закидывать, они будут находиться вот именно здесь, да. Поэтому, а, мы с ним как раз и будем работать. Итак, теперь следующим шагом у нас будет задача эти файлы здесь, в общем-то, создать. Да, но их не обязательно создавать вручную, потому что наш агент, с которым мы вот здесь вот общаемся в нашем диалоговом окне, он по умолчанию имеет доступ к созданию и редактированию всех файлов, которые находятся именно в этой папке. Поэтому мы можем банально вот сюда написать, соответственно, то, что нам необходимо, да, какие файлы ему нужно создать. И он, в общем-то, по очереди создаст эти файлы, которые нам нужны, да. Вот, собственно, что мы сейчас с вами и сделаем, да. Но перед тем, как мы начнём, я хочу ещё пару моментов сказать для вас, на которые нужно обратить внимание, да. Первое - это режимы работы, да? Здесь есть два режима работы, это fast и planing, да? То есть fast - это когда нам нужно выполнить задачу какую-то очень быстро.

Planning mode - это когда он, в общем-то, нам вначале создаёт специальный план, план действий, да? То есть, что конкретно он будет делать, да? То есть мы этот план согласовываем, и дальше мы ему можем написать, что да, план согласованный, можно, в принципе, начинать действовать. Либо же у нас могут быть какие-то корректировки, которые мы сюда, в общем-то, вносим. И, соответственно, он эти корректировки сюда внесёт, и дальше уже по скорректированному плану он будет, в общем-то, действовать. И ещё один очень важный момент - это выбор модели. Да. Вот чем мне нравится антигравити - это тем, что здесь есть как раз-таки вот моя любимая моделька Clus 45, которая нативно интегрирована, соответственно, в антигравити. Потому что если бы здесь не было бы вот этих вот моделек CLД, да, то, в принципе, весь смысл ээ антигравити, да, он, скорее всего, был бы уже не такой интересный, да, потому что GMI 3 Pro, конечно, тоже мощная моделька, но всё-таки CLД Opus, он превосходит вообще, мне кажется, все модели, которые сейчас есть на рынке. Поэтому я чаще всего пользуюсь именно Clotд OPСом 4,5 и вам тоже рекомендую. Для каких-то простых задач мы можем использовать Gemini 3 Pro, либо Gemini 3 Flash.

Flash, кстати, тоже достаточно неплохая моделька, поэтому, в принципе, можем использовать и её и работать с ней. Вот. Но по умолчанию почти всё время у меня включён опус. Единственное, когда использую, наверное, Geminii, а там флеш, если мне нужно сделать какую-то очень простую задачу и я не хочу тратить свои токены, например, на Clт-опусе, потому что они всё-таки тоже могут даже на платной подписке улетать в лимиты, если вы делаете какие-то достаточно сложные задачи. Поэтому по умолчанию я сейчас оставлю плодопус. И дальше теперь нам необходимо с вами придумать архитектуру проекта. Что конкретно мы будем с вами делать? создать ему эту инструкцию, описать ему этот проект, что необходимо нам сделать, дальше дать ему задачу в начале составить этот план реализации проекта и непосредственно создать эти файлы первичные, которые нам необходимы для того, чтобы этот проект реализовывать. Вначале мы ему напишем инструкцию от себя, скажем так, в таком человеческом виде. Потом он эту инструкцию переведёт в более понятный вид для лэмки, то есть для нашей нейросети. Дальше он создаст архитектуру проекта вот здесь создаст план и уже по этой архитектуре проекта мы сюда загрузим уже визуальные элементы, которые нам необходимы. И после этого, соответственно, мы запустим реализацию этого проекта, и он, в общем-то, его реализует. И дальше, когда мы его реализуем, наша задача дальше будет исправить все ошибки, все баги, которые могут здесь возникать, протестировать этот проект. И после этого можно его, в принципе, размещать где-нибудь на облачном каком-нибудь сервере, да, например, для того, чтобы мы могли получать доступ к нашему веб-приложению из фактически там любой точки и из любого устройства. Поэтому для того, чтобы нам не писать всё руками, я буду использовать специальную программу под названием Macvis Whisper. Да, если что, ссылочка будет у вас в описании. Вы сможете её скачать тоже. А буквально по нажатию одной кнопки я надиктую то, что я хочу видеть здесь, в принципе, в качестве проекта, да, и в общем-то это всё превратится в текст, и мы можем уже с этим работать. Поэтому я сейчас хочу сделать дашборд продуктивности, в который будет включаться огромное количество разных функций. То есть и трекер привычек, и задачник, и основные метрики, которые у нас будут, они тоже там будут включены, чтобы я мог видеть, соответственно, трекинг своих действий, да, и так далее и тому подобное. Вот у меня уже есть небольшой список, а, функций, который я бы хотел здесь видеть, да, соответственно, это виджет текущего времени мотивационной цитаты, трекером привычек, списка задач и рекомендации по продуктивности, визуализации, прогресса, да? И теперь наша задача надиктовать буквально голосом в произвольном формате, что конкретно мы хотим видеть в данном случае, как хотим мы, собственно, чтобы это было реализовано. Здесь очень важный момент, очень важный нюанс. Перед тем, как вы будете это делать. Важно это делать максимально подробно, насколько это возможно, да, насколько вы сами вообще можете подробно здесь надиктовать. И в конце будет очень интересный лайфхак. То есть, если вы не знаете, что конкретно вам нужно учесть и каким образом конкретно должно это всё выглядеть, в конце вы можете сказать, что задай мне список вопросов перед тем, как начать выполнение этой задачи, для того чтобы понять более детально, соответственно, что конкретно здесь можно реализовывать и какие вещи он может сам предложить нам для реализации этого проекта. Поэтому давайте начнём. А я надиктую ему эту задачу. Я хочу создать веб-приложение трекера привычек и дашборда продуктивности, который будет в дальнейшем размещаться на хостинге, чтобы я имел возможность доступа к этому дашборду с разных устройств, с компьютера и с телефона. В этом дашборде продуктивности должны быть следующие функции. Так, мы здесь ставим двоеточи, да, перечисляем вот эти функции здесь, которые я говорил, и дальше мы ему пишем вот следующую фразу, что перед тем, как создавать план и выполнять эту задачу, задай мне необходимый список вопросов для максимальной точности и результата. Всё. В целом, на самом деле, это всё. Да. Единственный момент, что я здесь использую дополнительные настройки в антигравити, которые я в конце вам дам, чтобы у вас тоже была возможность их их скачать дополнительно поставить сюда, чтобы у вас, соответственно, эти задачи выполнялись гораздо лучше и, соответственно, чтобы вам не пришлось там телегу текста расписывать и ждать от него там какого-то идеального результата. Поэтому здесь, конечно, есть определённые настройки, которые, соответственно, я в конце вам дам, расскажу, как их получить. Поэтому давайте запускаем, посмотрим, что он нам скажет, какие вопросы он нам задаст. Сейчас ответим на эти вопросы и дальше после этого можно будет запускать этот проект уже в реализацию. Кстати говоря, я тоже вам ещё рекомендую, чтобы вы попробовали использовать этот инструмент с разными моделями, да, то есть не обязательно Clot OPUS, вы можете использовать GNI в том числе, а потому что он тоже иногда выдаёт неплохие результаты. Конечно, в кодинге CLД opus он не имеет вообще равных на данный момент, но тем не менее GI он тоже иногда бывает достаточно неплох, когда особенно когда задачи не такие большие. Итак, смотрите, значит, что он нам говорит. Он говорит, что прежде чем приступить к планированию разработки, мне нужно уточнить несколько важных моментов. Хорошо, хостинг. Есть предпочтение по хостингу, синхронизация данных, авторизация источник, тип, рекомендации, привычки, задачи, визуализации прогресса и так далее. Я сейчас быстро отвечу на все эти вопросы, вот, и мы запустим, чтобы не тратить сейчас время. О'кей. Так, я ответил быстро на вопросы. Сильно глубоко я здесь не отвечал, то есть буквально на сложно этого, в принципе, достаточно. То, что ему необходимо, он придумает уже самостоятельно. Дополнительно, что я хочу здесь добавить - это то, что перед тем, как выполнять проект, создай полную архитектуру проекта в нашем репозитории. Все необходимые папки, файлы и инструкции для агентов. Всё. В целом мы можем запускать. Далее он нам должен создать план в реализации, который мы потом с вами посмотрим. Мы прочитаем его, подкорректируем, если нужно. Если не нужно, не будем корректировать, и приступим непосредственно к выполнению проекта. Итак, смотрите, мы получили наш план, мы получили список наших задач, которые, в принципе, он будет делать. Он уже тут многие задачи, в принципе, сделал. И мы получили Redmiфаile, да, который мы, соответственно, с вами сейчас прочитаем. Мы прочитаем план. Мы прочитаем Redmi файл и дальше посмотрим, всё ли нас здесь устраивает или же нам нужно что-то в этом плане поменять. Давайте сейчас его почитаем. Обратите внимание, важный момент. По умолчанию наши все текстовые документы, они создаются в файле Mark, то есть то MD, да? Почему именно Markdown? Почему необычно текст или Word и так далее? Потому что Markдаун файлы - это, по сути, такой стандарт файлов, которые позволяют, соответственно, учитывать заголовки или всякие выделения или там жирные шрифты и так далее и тому подобное. Поэтому в целом вот Markdown файлы - это стандарт для вот этой истории для AI, в том числе. Кстати, Notion тоже работает на Markдаун файлах, да. И ещё мы можем с вами обратить внимание, что он нам сделал здесь структуру проекта. Это пустые файлы. Здесь почти ничего нет, кроме комментариев, да, поэтому, в принципе, их читать сейчас нет смысла. Вот. Но тем не менее структуру он создал. И дальше после того, когда мы, соответственно, вот этот вот план подтвердим, после этого он будет вот эти файлы все по этой структуре заполнять, да. Поэтому давайте начнём с плана. Значит, смотрите, habitracker, да, план реализации. Что мы здесь получим? А, значит, мы видим то, что здесь Open AI ключ будет виден в коде браузера. И, соответственно, мы будем использовать дополнительные функции, чтобы это исправить. Я чуть попозже об этом вам расскажу. А далее, что у нас здесь есть?

Core HTML структура, да? То есть, соответственно, у нас есть HTML. Вот он индекс html. Он пустой пока, но он будет его наполнять в дальнейшем, да. А здесь указаны все стайлинги, то есть цвета и так далее. То есть он указал именно структуру, как она выглядит, эта структура, да? Соответственно, мы это всё а видим, что конкретно здесь есть, что конкретно, какое наполнение тут будет и так далее и тому подобное. А, но нас интересует в первую очередь это две вещи. Первое - это визуальная часть. Вот она у нас здесь есть, да, и, соответственно, техническая часть, да, то есть что конкретно, какие функции здесь будут присутствовать, да, чтобы мы их посмотрели. Давайте начнём с визуальной, посмотрим, что тут есть. Соответственно, хидер, виджет времени, цитата: "Сайт, бар, навигация по модулям, бла-бла-бла". О'кей, хорошо. Так, цвета, понятно. Так, хорошо. А здесь вот он указал, что это будет карточки с гласморфизмом. То есть это как раз тот самый стиль, который часто используется, в том числе и в айфонах, в Apple и так далее и тому подобное. Кнопки сверо анимациями. Хорошо. Дополнительно, если вы что-то не понимаете, то есть, во-первых, вы можете написать здесь в чатике, чтобы спросить, что это такое, что это значит. Либо же мы можем, соответственно, запустить всю эту историю. Если вам, допустим, здесь куча непонятных слов, например, мы можем запустить этот план на реализацию и дальше посмотреть, как в итоге у нас будет здесь, в принципе, всё это выглядеть. И после того, как он нам всё это сделает, мы можем уже дальше корректировать всё, что здесь внутри находится. А теперь техническая часть. Значит, смотрите, у нас первое - это тайм виджет, то есть виджет времени, да, то есть отображение, дата, день недели, там и так понятно. Далее у нас, соответственно, цитаты, да, то есть цитаты, привычки, да, например, крут операция для привычек, категория здоровья, работа, учёба, личная, типа ежедневная, еженедельная, отслеживаниние, выполнения по датам, допустим, а задачи, потом AI рекомендации, потом чарты. То есть чарты - это, соответственно, метрики наши, да, то есть вот, а, здесь написано утилиты, куда это всё будет сохраняться и так далее. А для большинства из вас, конечно, это будет, ну, просто набор слов, да, непонятных. Поэтому давайте доверимся тому, что он здесь нам написал. Прочитаем ещё Redmi файл дополнительно.

Redmi File - это более человеческое, скажем так, ТЗ, да, конкретно, что здесь будет сделано. То есть вот, например, если бы мы с вами были разработчиками, да, то, соответственно, мы бы, скорее всего, вот составляли бы примерно такое же техническое ТЗ, да, то есть вот, соответственно, где написано функции, да, то есть виджет времени, мотивационные цитаты, трекер привычек, список задач и рекомендации, визуализации, структура проекта здесь описана быстрый старт, то есть что конкретно нужно сделать и так далее. Добавьте а ключ в точку V. Я, кстати говоря, сейчас это сделаю с вами, да, технологии, адаптивность, то есть десop, ноутбук, планшет, мобильный дизайн, а деплой, то есть куда, соответственно, мы будем это всё деплоить, да? То есть приложение готово к размещениюell, Netlifi, GitHub, любой статический хостинг и так далее. Мы, кстати говоря, а в конце разместим это приложение на одном из вот этих вот а хостингов, да. Перед тем, как мы запустим этот план в реализацию, нам очень важно сделать две вещи. Первое - это добавить апи ключ от нашего Open AI. Но вы это, в принципе, можете не делать. Я сейчас это сделаю, потому что я хочу, в принципе, чтобы здесь работал модуль AI рекомендации. Поэтому я сейчас добавлю сюда апи ключ от моего Open AI аккаунта. Да, это первое. И второе это нам нужно выбрать с вами дизайн. И мы прямо можем скриншотами добавить вот сюда в чат те дизайнпроекты, которые нам нужны для того, чтобы, соответственно, наш проект выглядел ровно точно так же, как мы вот хотим, да. Для этого что нам необходимо сделать? Есть специальный сайт под названием drible.com, да? Ссылочка у вас тоже будет на него в описании. И здесь мы можем в поиске, да, то есть указывать любые ключевые слова, которые нам нужны, искать тот проект, который визуально нам понравится, скачать просто скриншот банально просто обычной картинкой, вставить его в антигравити и дальше ему сказать, чтобы он сделал дизайн ровно точно такой же, как вот на этом скриншоте. Он его, соответственно, разобьёт на модуле, он его проанализирует стиль, да, и, соответственно, сделает нам наше приложение в похожем стиле, как вот это приложение и выглядит, да. Поэтому что я делаю? Я вот здесь сверху вписываю, например, productдуtivity либо dasшборд. Ну давайте впишем дэшборд. Нажму поиск. Сейчас он нам найдёт все основные дашборды, которыя у нас здесь есть. Мы с вами выберем подходящий дизайн, который нам нужен. И после этого, соответственно, приступим к реализации. Поэтому я здесь пишу dasшборд. Давайте нажмём на поиск. Посмотрим, что у нас тут есть. Выберем тот дизайн, который нам нравится больше всего. Вот, например, смотрите, мне нравятся вот эти оранжевые вставочки. Давайте, может быть, попробуем его взять за основу. Отлично, супер крутой дизайн. Значит, что я сейчас делаю? Я просто беру, копирую это изображение, перехожу в антигравити и прямо в диалоговое окно вот сюда вставляю эту картинку. Да. Сейчас наша задача, я также сейчас вставлю свой Open AI апи ключ в файл W. То есть, если мы вот сюда перейдём, по сути, файл W, да, то это наш файл, куда мы вставляем все наши какие-то ключи доступа, например, да, там логины и пароли и так далее. То есть это специальный файл среды, который защищён от внешнего доступа, да, куда мы можем, соответственно, вставлять какие-то конфиденциальные данные. В данном случае это Open ключ, да? Поэтому тоже для безопасности ни в коем случае не вставляйте свои ключи или логины, пароли вот здесь вот в этом окошке, да? То есть используйте их вот через вот такие вот файлы, как, например, здесь. Поэтому я сейчас вместо вот этого вот текста вставлю сюда свой Open AI ключ, да, и мы можем продолжить, да? Дальше я напишу, соответственно, что план меня устраивает. Вот я тебе сейчас загрузил этот скриншот, и, соответственно, мы можем приступить к реализации. Итак, отлично. Теперь, а, я начинаю диктовать, что я тебе загрузил скриншот того сервиса дизайн которого я бы хотел повторить. А, поэтому проанализируй дизайн этого скриншота и сделай такой же дизайн в нашем проекте. Также я загрузил апи ключ в fil. И давай начнём реализацию этого проекта. Всё хорошо. Можем теперь запускать. И давайте подождём, пока он непосредственно всё это нам сделает, составит нам а этот проект. А, и глянем на результат. Кстати говоря, пока он нам создаёт этот проект, я ещё хочу обратить внимание, что здесь вот в Task MD, то есть это первая наша вкладочка, здесь написан весь план реализации, что конкретно он будет делать в данном случае, да, поэтому мы можем здесь отслеживать прогресс. То есть мы видим то, что в планировании он всё сделал, да, мы план одобрили, дальше у нас идёт реализация, то есть базовая HTML-структура, CSS, виджеты, там, трекер привычек и так далее. То есть он всё это сделает. И последнее - это будет верификация, то есть тестирование всех функций. И вот, кстати, один из основных моментов антигравити, да, является то, что здесь он может сам открывать браузер, сам по нему работать, сам по нему кликать, сам открывать ссылки, там вот проект в том числе наш, и сам проверять те функции, которые мы сюда запустили для того, чтобы все эти функции работали так, как надо. Поэтому мы сейчас вот как раз это с вами увидим. И точно так же мы можем видеть вот здесь вот с вами логи взаимодействия. То есть мы здесь видим всё, что происходит внутри, а под капотом, да, то, что он проанализировал там картинку, он проанализировал вот этот файл. Сейчас мы будем видеть, как он будет генерировать, соответственно, файл. Это займёт там какое-то время. То есть это, как правило, там может быть несколько минут. Иногда выже бывает там по 15, по 20 минут, он думает и так далее. Но в конце мы увидим всю хронологию, цепочку событий. Вот прямо сейчас мы видим, что он вот создаёт новые файлы, да? Вот main CSS он стили создал. У нас он изменил, соответственно, индекс HTML, то есть здесь уже появился какой-то код определённый, вот он так примерно выглядит и так далее. И, соответственно, дальше мы сможем посмотреть, что мы в итоге получим. Отлично. Ну вот он нам сам открыл, в общем-то, этот браузер. Мы уже видим то, что здесь у нас уже есть тот самый интерфейс, и он сейчас сам будет по нему кликать, проверять все наши задачи, которые здесь есть. А и мы будем смотреть, насколько это всё работает. О'кей. Итак, мы видим то, что текущее время действительно правильно он определил. Всё здесь хорошо, всё замечательно, задачи есть, есть прогресс. Ну и можем видеть в логах, как, в принципе, он как раз-таки вот работает сейчас с этим браузером, проверяет все задачки. Кликает вот на кнопки, которые тут есть. И сейчас мы увидим, в общем-то, тестирование прямо приложения от самого AI в реальном времени. Вот он сам нажал добавить задачу. Сейчас, возможно, он что-то сюда напишет. Мы видим то, что здесь вот он сейчас пишет название, описание, приоритет, дедлайн. Вот как раз проверим сейчас функционал, насколько он будет работать. Так, он нас сейчас просит, соответственно, совершить действия. Нам нужно вот здесь нажать confirm. То есть мы подтверждаем. Вы подтвердили. Отлично. Ждём дальше. Ничего не делаю. Он сам. Всё, пожалуйста. То есть сам агент, в общем, выполняет все задачи, которые нам надо. Соответственно, вот мы видим то, что есть у нас прогресс, как бы вроде как всё работает. Отлично. Он полностью сделал реализацию. То есть мы видим то, что закрыты все задачи в данный момент времени. Он проверил полностью все функции, которые тут есть, и нам предоставил ссылку на локалсте, то есть в браузере. Соответственно, то есть local host - это значит, что это приложение в данный момент времени находится у нас на компьютере, и мы, соответственно, можем открывать его с компьютера, да? То есть мы не можем пока что там зайти в него с телефона или ещё откуда-то. Для этого нам нужно разместить это приложение на хостинге. Это мы будем делать уже следующим этапом. Поэтому давайте сейчас посмотрим, что он нам сделал. То есть главная страница, основные стили. Значит, о'кей, как потестировать? откройте в браузере, добавьте привычку, нажмите обновить и так далее. Всё. Ну и у нас осталась последняя часть - это верификация и непосредственный деплой. То есть деплой - это значит размещение нашего приложения на сервере и его непосредственный запуск. Поэтому давайте сами сейчас откроем на local host. Вот у нас открылся наш трекер привычек. Кстати говоря, дизайн на самом деле очень похож на то, что мы здесь видим. Он не один в один, конечно, чуть-чуть отличается, но в целом в целом достаточно неплохо. Вот мы в теории можем попробовать то же самое сделать ещё, но не на опусе, а, например, на том же самом Gemini 3 Pro. Вот посмотреть, насколько он нам сделает хорошо. Но в целом передача цветов, передача вот самой стилистики, она достаточно неплохая. Вот мы можем сюда дополнительно загрузить наши шрифты или какие-то цвета или ещё что-то, которые нам нужны, например, и так далее. Давайте сейчас попробуем что-нибудь сделать. А так, во-первых, у нас есть вот наши привычки. Я нажимаю сюда, допустим, там утренняя зарядка. Ну вот он нам прямо сам подсказывает. Ну утренняя зарядка. О'кей. Категория. Ну, здоровье, понятно. Тип ежедневное. Нажимаем сохранить. Вот у нас она есть, да? Супер, появилась. Значит, а, нажимаем вот сюда. О, у нас прогресс появился. Отлично. То же самое с задачами. Например, завтра позвонить Олегу, например, да, подробности, приоритет можно выставлять высокий, низкий дедлайн. А, соответственно, завтрашний день давайте поставим двадцать четвёртый календарь. Отлично здесь открывается. Всё, у нас есть, соответственно, задача. Кстати говоря, смотрите, какая анимация. То есть появляется, да, чуть-чуть, конечно, вот здесь вы вылазит за экран, но это всё, я думаю, что поправляемо в целом. Очень прикольно. Так, если задачи мы здесь ставим, то они закрываются. А у нас есть наша цитатка, да, которую мы, кстати говоря, получаем из я так понимаю, Open AI. Также у нас есть AI рекомендации. Мы можем нажать обновить. Сейчас он посмотрит наши данные и покажет нам действительно, работает ли интеграция с Да, смотрите, интеграция с Open AI работает. Единственное, что, конечно, здесь нету выделений, то есть он по по умолчанию показывает вот эти звёздочки. Это звёздочки для выделений, да? То есть это, чтобы жирный шрифт был, но в целом он подключён действительно к Open AI. Он сделал запрос в Open AI и, соответственно, вот он показал нам AI рекомендации, что конкретно рекомендует AI нам в данном случае сделать сейчас. Также у нас есть возможность меню, но мы его не добавляли, поэтому его нету. Соответственно, личный кабинет у нас тоже не работает, потому что мы его не добавляли, но это те функции, которые мы можем добавлять уже дополнительно уже следующей итерации, да, то есть вот базово, если нас устраивает то, что мы здесь сейчас имеем, то дальше мы можем, соответственно, общаться в этом же диалоге с этим агентом, да, чтобы он добавлял новые фишки, которые нам нужны. Теперь, допустим, я хочу, чтобы у нас задачник был чуть более информативный. То есть здесь в данный момент времени, я так понимаю, что тут нету пока что разделения на конкретные даты, поэтому я бы хотел сюда вставить, чтобы у нас была задача разделена по датам, например, да? То есть вот, допустим, у нас есть двадцать четвёртая, двадцать пятая, я добавляю какие-то задачи, они сейчас в куче находятся. Но мне важно, чтобы эти задачи были разделены по датам. Во-первых, а нам нужно исправить вот эту историю, чтобы при наведении он не улетал за экран, и, во-вторых, чтобы задачник был более, скажем так, функциональным и был разделён по датам. Поэтому давайте переходим вот сюда в интегравити. И я сейчас надиктую ему эту историю. Смотри, во-первых, нам нужно адаптировать блок задач, чтобы там было разделение по датам. Блок задач должен быть больше, он должен занимать большую часть экрана. А далее добавь ещё дополнительный функционал в задачник для того, чтобы им было удобнее пользоваться. Также при наведении на блоке задач срабатывает анимация, которая дальше уходит за экран. Тоже исправь это эту проблему. Всё, я ему написал. Давайте запустим и посмотрим, что он нам выдаст. Итак, вот мы видим, что он у нас, в общем, исправил все эти моменты. Давайте откроем сейчас local host. А, да, вот мы видим сейчас, что у нас эти задачи разделились на завтра, предстоящие, выполнены, всё хорошо, замечательно, соответственно, блок задач у нас тоже появился чуть побольше. И сейчас мы можем в целом это приложение уже деплоить на наш, собственно, сервер, да, то есть, например, это бесплатно, да? То есть сейчас я расскажу, как это делать нам вместе с вами. Но перед тем, как мы это начнём делать, я хочу рассказать пару основных моментов, которые вам нужно знать перед тем, как мы будем это делать, да? Какие есть в Антигравити скрытые функции, да, о которых нужно знать вам перед началом работы в Антигравити? Ну, во-первых, это установка, в принципе, самого цветовой схемы. Делается это здесь через настройки. То есть у нас есть настройки, в принципе, нашего эдитора, да, то есть нашего окна, и есть настройки аккаунта, да, то есть нам нужно нажать вот здесь настройки аккаунта, и мы выбираем темы, да, у нас, соответственно, есть а вариант колор темы, да, соответственно, мы можем покликать, посмотреть, как будут выглядеть вот кому-то нравятся тёмные темы, кому-то нравятся светлые, допустим, да, мне больше всего нравится Solarized Light, то есть он такой как бы нейтральные такие тона, то есть очень приятные для глаза. Вот это первое, да. Второе, чтобы у нас вот весь этот проект делался на очень высоком и профессиональном уровне и мы минимизировали количество ошибок, нам очень важно подключить дополнительные настройки, да? А значит, в антигравити есть специальная функция, которая нам позволяет подключать сюда внешние сервисы, разные абсолютно внешние сервисы под названием MCP, да, то есть это MCP протокол. Про него мы, я думаю, что отдельно я сделаю видео, но тем не менее сейчас быстренько про него пробежимся. Итак, что нам нужно, да? То есть мы заходим в additional options и нажимаем MCP серверы, да? Здесь у нас появляется список из некоторого количества MCP серверов. То есть это внешние сервисы, да, которые там есть в интернете, которые мы можем сюда подключить. А для чего нам это нужно? Например, если мы хотим сюда подключить Notion, то есть нам нужно, допустим, какие-то файлы, к примеру, вот этот Redmi файл мы хотим, в общем, загрузить в Noteion, например, или, допустим, агент, которого мы запускаем, он, а, у него может быть какая-то инструкция, которая, например, к этому ноушену или к этому сервису сюда, соответственно, обращается и, в общем-то, выполняет какие-то действия. например, те же самые Google таблицы, например, на же самый GitHub, например, на котором мы сегодня будем с вами разворачивать вот этот вот весь проект, соответственно, мы будем его разворачивать на Гитхабе и, соответственно, тоже здесь подключается всё это через MCP-сервера. Но здесь момент заключается в том, что вот этих сервисов, которые мы можем здесь подключить, который список здесь написан, да, это достаточно очень маленькиймаленький список, которых даже близко недостаточно для работы, соответственно, с антигравити, да, поэтому у нас есть, соответственно, возможность добавлять сюда кастомные MCP сервера. Как это делается? Мы нажимаем на кнопку Manage MCP server. И здесь мы видим то, что у меня здесь в данном случае установлен MCP сервер под названием Contex 7. Я всем рекомендую для начала его установить. Сейчас объясню, как это делать. Вот что такое Contex 7. Коeex 7 - это, по сути, MCP- сервер. Это внешний сервис, к которому подключается наш агент для того, чтобы скачивать самую актуальную документацию по кодингу, да? То есть, соответственно, он вначале подключается к этому MCP-серверу, получает самую актуальную документацию в тех направлениях, которые ему нужны, и, соответственно, уже пишет наш код, то есть наш проект уже с учётом всей этой самой актуальной документации, потому что обновление по коду выходят очень часто, код обновляется тоже очень часто, выходят новые фреймворки и так далее и тому подобное. Поэтому, соответственно, нам нужно иметь самую актуальную документацию. Мы можем его добавлять как вручную через RC config. То есть мы нажимаем вот сюда вот на кнопку, и мы, соответственно, добавляем вот сюда вот этот MCP сервер. Либо же, либо же мы можем это сделать всё то же самое через чат. То есть мы можем, например, начать новый диалог и прямо вот здесь написать: "Добавь добавь мне такой-то такой-то MCP-сервер внутри, соответственно, нашей антигравити". Да. Каким образом а его добавлять и как их их и вообще искать, да? Самое простое - это зарегистрироваться вначале на Котек 7, да, получить вот этот апи ключ от КоEx 7, который мы сюда будем вставлять. И дальше мы переходим на GitHub. То есть, соответственно, у нас есть GitHub, мы заходим на него и в поиске мы просто вводим, соответственно, context 7, да, или тот наш интересующий MCP-сервер, который нам нужен, да. Вот, например, у нас есть Contex 7. Вот мы заходим вот сюда, и наша задача просто скопировать ссылку на этот Контек 7 и вставить вот в диалоговое окно вот сюда и ему сказать: "Добавь мне MCP-сервер вот по этой ссылке из Гитхаба". Всё, этого будет достаточно. И единственное, что вам нужно здесь ещё вставить апи ключ. Таким образом, примерно устанавливается любой MCP- сервер, который вам нужен. Или, например, у нас есть там Notion MCP. К примеру, если нам нужен Notion MCP, мы можем тоже его, а, добавить. В общем-то, мы просто вводим в поиске на GitHubбе Notion MCP. Вот он прямо здесь есть. Мы просто сюда заходим, копируем то, что нам надо, и, соответственно, вставляем туда. Если нам нужно Google таблицы, то же самое. Мы можем, соответственно, найти Google Sheets MCP. Набираем здесь, пишем здесь. И вот мы видим, то есть огромное количество разных Google таблиц MCP, то есть просто выбираем, ну, можно сказать любой, можно по отзыву смотреть и так далее. Просто берём ссылочку. То есть, соответственно, антигравити он самостоятельно зайдёт на этот сайт, он самостоятельно прочитает документацию, самостоятельно возьмёт эту ссылку и вставит, соответственно, туда и добавит там этот MCP-сервер, который нам нужен. Единственное, что нам нужно будет, это апи ключи. То есть апи ключи - это, по сути, тот самый набор символов, да, по которому мы подключаем какой-то определённый сервис. И практически любые сервисы, которые мы используем где-то в облаке, они имеют свой аключ, да? То есть, соответственно, мы можем подключить этот Дапи ключ, если нам нужно, допустим, делать там парсинг каких-то там рилсов или, например, там какого-то контента, там, может быть, видео в Ютубе или там Telegram канала и так далее, для этого мы можем, допустим, использовать MCP, да, к примеру, вот то же самое здесь есть он MCP, да, то есть заходим вот сюда на GitHub, вот у нас есть MCP сервер. То есть берём, просто копируем опять-таки ссылку, вставляем вот сюда, говорим то, что добавь нам, пожалуйста, вот этот вот MCP сервер вот сюда. И, соответственно, с помощью этих MCP- сеерверов мы можем очень сильно расширить функционал нашего антигравити для того, чтобы он имел доступ и вызывал определённые приложения либо сервисы, которые мы имеем где-то в облаке. То есть, например, самостоятельно создавал таблички через Google Sheets, MCP, например, самостоятельно добавлял какие-то новые задачи, например, да, если вы используете какой-нибудь задачник, например, это пусть будет там, не знаю, toдуисты или там Bitриx или ещё что-то, да, то вы, соответственно, можете добавить сюда API ключ или MCP сервер, вот, допустим, определённого сервиса. То есть он будет иметь возможность к нему обращаться и непосредственно а-э выполнять определённые действия с этим сервисом, да. Дополнительная инструкция по установке всех необходимых MCP-серверов, которые нам необходимы будут, допустим, Коex 7 и так далее и тому подобное. Плюс документация вот по поводу создания вот этих вот проектов для того, чтобы создавать эти проекты, чтобы у нас были дополнительные настройки в антигравити, которые эти проекты позволяют создавать. Всё это будет у меня в Telegram-канале, поэтому, пожалуйста, заходите, ссылка будет в описании. Вот заходите, и там в закреплённом сообщении, в общем-то, всё это будет. Поэтому жду вас там. И ещё несколько основных моментов, которые я вам хотел показать - это непосредственно инструкции, то есть кастомизации наших, в общем-то, агентов, да. То есть находятся они вот здесь точно так же. Мы нажимаем вот здесь три точки. У нас есть здесь MCP- серверы, у нас есть кастомизация, да, то есть customizations. Тут, соответственно, две вкладки, для чего они нужны. Я, на самом деле, очень часто пользуюсь именно Global Workflows, да? Для чего они нужны? Потому что, когда вы создаёте определённый проект, например, внутри антигравити, вы можете создать глобальный workflow, который вы можете вызывать из любого диалога, который вам нужен. То есть, например, вот у меня сейчас создан здесь тестовый workflow, например, да, мы можем, соответственно, здесь открыть наш чат, да, и я могу этот workflow в итоге вызывать. То есть, например, вот у меня он тест, я могу здесь написать тест, и он в этом сообщении, когда мы его отправим, он вызовет этот workflow, он вызовет эту инструкцию, которая там написана, и выполнит те действия, которые там написаны. То есть, например, допустим, если мы вот создали вот этот проект, да, мы можем создать workflow для того, чтобы он нам автоматически деплоил вот этот вот весь проект на GitHub, да, то есть мы можем добавить, например, Workflow под названием GitHub, написать там инструкции либо же, соответственно, написать в Гравити, то есть через диалоговое окно для того, чтобы нам нужно создать глобальное правило или глобальный workflow, который, соответственно, будет вот делать вот эти вот эти вот эти инструкции, и он нам сделает. Для того, чтобы понять, как, соответственно, делать и создавать агентное workflow непосредственно в антигравити, у меня есть отдельное видео на канале, поэтому, пожалуйста, переходите, смотрите. Вот там я это про про это более подробно говорю. Но а мы там создаём конкретный workflow внутри одного проекта. А здесь я сейчас говорю о том, что вот через вот эти кастомизации мы можем создавать workflow, которые мы можем запускать из любых проектов, которые у нас есть. К примеру, у нас может быть workflow для переноса информации в Ntion, к примеру, да? То есть мы создали файл Redmi, мы хотим этот, соответственно, файл Redmi закинуть в Ntion. мы запускаем workflow, который у нас здесь заранее создан. И этот файл Redmi по одному короткому запросу через буквально 1ну минуту у нас появляется в ноушене, да? То есть мы можем таким образом с ним работать. Либо же, например, мы можем создать Google таблицу и переместить какую-то информацию в Google таблицу и так далее. Поэтому глобальный workflow, я думаю, что я сделаю отдельное видео на эту тему. Это очень-очень крутая штука. Далее, далее. Вот самое, наверное, на мой взгляд, главное преимущество антигравити, потому что это всё-таки агентная система - это агентный менеджер, да. Значит, чтобы его запустить, у нас есть кнопка под названием вот здесь сверху агентный менеджер, да? То есть мы можем на неё нажать, открыть агентный менеджер и так далее. Такой функции нету практически ни у одного ID и сервиса.

ID - это, соответственно, вот этот интерфейс программы, где мы можем писать код. То есть это, например, курсор или vsкоode. Там такого нету, да? То есть а здесь мы можем, соответственно, вот этот проект открыть через агентный менеджер. У нас агентный менеджер. Выглядит он вот так. И здесь у нас есть все наши проекты, которые в данный момент времени открыты. То есть у нас вот вот есть один проект, который только что мы с вами делали, да? Есть другие проекты, которые мы можем делать. И тут мы можем общаться с агентами внутри разных проектов параллельно друг с другом. То есть, например, мы запустили агента, который нам добавляет, например, задачник в наш проект. Мы можем точно так же параллельно в этом же проекте запустить ещё одного агента, который, например, нам будет добавлять другую какую-то функцию, потом ещё одного, потом ещё одного и так далее. И у нас будет огромное количество параллельно работающих проектов, которые потом дальше у нас есть, соответственно, inbox, то есть это входящие наши сообщения. И когда наш агент, он выполнит какую-то определённую задачу, которая у нас есть, соответственно, мы получим уведомление о том, что эта задача выполнена, и в рамках одного и того же проекта мы можем её проверить. Это очень удобно, когда мы под капотом настраиваем всю проектную документацию вот здесь внутри нашего эдитора, то есть нашего редактора. То есть в редакторе мы настраиваем все файлы, создаём всё там Redmi и так далее и тому подобное. Настраиваем все файлы, то есть создаём все файлы, общаемся с ним, настраиваем все моменты и так далее и тому подобное. Дальше мы, соответственно, заходим в агентный менеджер, и мы можем создавать несколько разных агентов внутри этого агентного менеджера, который будут работать параллельно, при этом не открывая вот этот капот. То есть здесь более приятный интерфейс. Мы можем, кстати говоря, из разной модельки здесь тоже использовать. Например, допустим, какую-то функцию мы можем реализовать через Cloud Opus, какую-то функцию мы можем реализовать через Google Jeme. Сейчас а наша задача, чтобы нам разместить вот весь этот проект в нашем конкретно хостинге, на нашем сервере, наша задача для начала нам зарегистрироваться на Гитхабе. То есть вот это GitHub, где, соответственно, мы ищем с вами MCP сервера. Точно также вы, соответственно, здесь же на Гитхабе, размещаете свои проекты для того, чтобы дальше деплоить, например, на том же Неetтлифае и так далее, да? А, поэтому первое, что вам нужно сделать - это зарегистрироваться на гитхабе. Вы здесь регистрируетесь, и после этого у антигравити есть нативная интеграция с гитхабом. А как нам дальше разместить этот проект и для чего это нужно? Размещать проект на Гитхабе нужно для нескольких причин. То есть там огромное количество разных задач можно делать с помощью Гитхаба. Вот, то есть, грубо говоря, GitHub - это облачное хранилище, вот как Google Drive, например, или ЯндексДиск и так далее, только для разработчиков, да? То есть мы можем, соответственно, всю нашу вот эту вот кодовую базу, весь наш репозиторий загрузить на GitHub и дальше дать возможность подключаться к этому GitHub другим приложениям, в том числе нашему серверу, на котором будет размещаться, в общем-то, это приложение. Поэтому, чтобы нам разместить на нашем сервере это приложение, нам вначале его нужно закинуть на GitHub, и только после этого, соответственно, мы можем, соответственно, размещать это всё на нашем сервере. Сделать это всё очень просто. Для того, чтобы закинуть это на GitHub, мы заходим во вкладочку Source Control. Вот здесь слева сверху. И у нас здесь, по сути, есть две кнопки. Нас интересует кнопка Publish to GitHub. Мы заходим вот сюда, да, соответственно, мы должны авторизоваться в первую очередь. Нажимаем copy continue to GitHub. Нас перекидывает на GitHub. Я выбираю аккаунт, нажимаю Continue. Вписываю вот этот код, который мы только что получили. Нажимаю автоorйз, то есть авторизоваться. Ввожу мой пароль, который он у меня есть. Нажимаю confirm. Всё, по сути, мы эту страничку можем закрывать. Теперь антигравити подключён к GitHubбу. И здесь, когда вы публикуете на GitHub, у нас здесь есть две опции. Видите, у нас появилось такое окошко. У нас здесь есть две опции. То есть первое - это GitHub Private repositorй. Второе - это GitHub Public Repпозиitory. Вот здесь будьте аккуратны, пожалуйста, публикуйте только на private репозитории. Почему? Потому что, если вы нажмёте public репозиitory, то, соответственно, ваш репозиторий, который здесь будет, вся эта папка, она будет публично доступна практически всем людям, которые сидят на гитхабе. И если у вас здесь есть какие-то апи, ключи или ещё что-то, да, то есть какая-то конфиденциальная информация, она сразу попадёт в интернет и все, соответственно, могут им пользоваться. Поэтому будьте аккуратны, будьте внимательны. Поэтому нажимайте private репозиitory. Мы нажимаем вот сюда. Теперь нам нужно подождать, пока, соответственно, всё это опубликуется на GitHub. Вот мы видим то, что у нас проект наш опубликовался, да? Мы видим то, что у нас здесь появился, соответственно, вот First Commit. То есть first commit - это значит первая версия, в общем, нашего приложения. Она опубликована на Гитхабе, да. Теперь, если мы перейдём на наш GitHub и зайдём во вкладку Repositories, вот здесь, то мы увидим наш repository Project, который мы только что создали. И вот, собственно, он у нас здесь весь есть, да, у нас Redmi файл, то есть который мы видели вот в самом начале, да, соответственно, он появился у нас на гитхабе. Всё отлично, замечательно, всё мы здесь получили. И теперь следующий процесс. Нам нужно, в общем-то, опубликовать вот то, что мы сейчас видим здесь на Гитхабе, в наш сервер. Мы будем использовать сервер под названием Netliify. Да, ссылочка на него будет в описании, поэтому переходите, пожалуйста, регистрируйтесь. Когда вы зарегистрируетесь, у вас появится вот такая страница. То есть для того, чтобы попасть на эту страницу, вам нужно зарегистрироваться и заполнить, соответственно, анкету. И а здесь у нас нам предлагает несколько вариантов, откуда мы можем, в общем-то, взять этот проект. И нас, конечно же, интересует GitHub. Поэтому мы нажимаем на кнопку GitHub. нас сейчас перекидывает на GitHub. Соответственно, мы подключаем наш GitHub сюда к Netlifi. Теперь наша задача выбрать тот репозиторий, который мы хотим опубликовать. Поэтому мы выбираем only Select Repositories и вот здесь выбираем тот репозиторий, который нам нужен. Вот я выбрал здесь, соответственно, Project. Нажимаем Install. Устанавливается. Теперь мы выбираем тот самый Project, то есть проект, который мы только что на GitHub закинули. Нажимаем вот сюда и нажимаем просто на кнопку Deploy Project to Onetlify. Сейчас нам нужно подождать пару минут. может быть, даже секунд, пока он это всё сделает. Обычно всё это делается достаточно быстро. Всё, соответственно, мы видим то, что у нас везде появились галочки complete. И после того, когда мы задеплоили, здесь ещё есть один важный момент, да, когда мы непосредственно публикуем всю эту историю на Netlify, каждый сервер, который мы используем, да, он использует свою собственную структуру. И в Netlifi эта структура своя, да, в данном случае у нас индекс HTML, он находится в папке не главной, а в дополнительной папке. Поэтому есть два варианта. Либо мы индекс HTML переносим в корень вот этого вот нашего репозитория, либо мы добавляем для fil.Tal через непосредственно антигравити. Я это уже сделал. Вот здесь, да, где написана инструкция для нетлифая по конфигурации вот этого проекта. Поэтому я это сделал. А сейчас мы видим то, что после того, когда мы на GitHub загрузили этот проект, у нас появляются любые изменения, они показываются вот таким зелёным цветом, да. Это значит, что мы изменили какой-то файл, и если мы любой файл изменим, вот здесь, он также подсветится зелёным цветом, либо либо цветом М. когда, например, изменяется файл на Гитхабе, например, да, и нам нужно снова запушить вот этот файл, чтобы он снова загрузился на GitHub. Что нам нужно для этого сделать? Мы переходим обратно в Source Control, пишем вот здесь, а любое сообщение, что было конкретно изменено. Например, а, добавлен файл. Это вы для себя пишете, это просто обычные комментарии. Добавлен файл Netlify, да? А я нажимаю commit, нажимаю syn, нажимаю окей. И что самое интересное, так как у нас Netlify, он подвязан к нашему GitHubбу, да, то нам, в принципе, делать больше ничего не нужно. То есть как только мы нажали вот здесь Commit и Syn, то есть мы синхронизировали нашу файловую систему, которая находится вот здесь вот в проекте с Гитхабом, он автоматически применился на Netlifi. И поэтому, если мы вот сюда зайдём, мы нажимаем вот здесь вот на эту кнопку Open Production Deploy. И мы получаем наше приложение, которое открылось по ссылке, которая уже доступна всем, да, вот в данном случае эта ссылка вот такая. Соответственно, если вы хотите это приложение использовать на телефоне или на каком-то другом устройстве или просто использовать там в другом каком-то месте, да, не имея на этом компьютере это приложение, то вы можете вот сюда заходить уже по по этой ссылке и пользоваться этим приложением уже самостоятельно, как вам нужно и комфортно. И таким образом вы, соответственно, можете создавать свои приложения, которые вы дальше будете деплоить, например, на том же самом Netlifаy. Это бесплатный, в общем-то говоря, хостинг, да, который мы можем использовать. Ну, понятно, с лимитами, но тем не менее их более чем достаточно для наших с вами задач. И, соответственно, мы коммитим всё это на GitHub, загружаем на GitHub, оно автоматически применяется, и уже автоматически наше приложение, в общем-то, выглядит вот таким вот образом. Мы можем им прямо сейчас пользоваться, да? То есть видим, что все функции, которые мы изначально там а брали, они все работают. То есть мы можем создавать задачи, выполнять эти задачи, создавать привычки любые, например, да, в разных там категориях, например, да, и так далее. То есть вот еженедельные, например, можем выбрать, добавить сюда. То есть мы видим, что у нас категории меняются и прочее. Видим текущее время, вот, и так далее и тому подобное. Следующими итерациями мы можем добавлять уже пользователей, то есть личный кабинет, мы можем добавлять меню какое-то, мы можем добавлять уже дополнительные какие-то фишки, которые нам нужны, вот можем графики более подробные делать и так далее. То есть в целом вот через такие простые действия мы можем создавать свои собственные приложения внутри антигравити, деплоить их в онлайн на свой собственный сервер и иметь доступ вот по этой ссылке, ну не по этой конкретно, да, а по вашей ссылке, которая у вас будет. Вот. и таким образом, в принципе, работать с этими приложениями. Поэтому этот проект, который мы сейчас только что с вами делали, и все файлы, в том числе инструкции для того, чтобы вы могли сделать такой же проект, как и здесь, оно всё будет в Telegram-канале. Ещё раз повторюсь, что ссылка будет у нас в описании к этому ролику на Telegram-канал, поэтому переходите, там всё бесплатно, мы всё выложим. Вот этот проект и плюс дополнительные инструкции, файлы, инструкции, да, для того, чтобы вы могли их закинуть сюда в антигравити и их использовать в вашем проекте, создавать такие же проекты очень легко. Также там же будет инструкция по настройке MCP серверов. И вот этот Contex 7 MTP, который вам необходим будет для того, чтобы создавать похожие файлы. И точно также мы туда приложим ещё текстовую инструкцию, примерно то, что я сейчас делал по деплою на GitHub и по деплою на Netliify для того, чтобы вы могли свои приложения, соответственно, деплоить на этих серверах. Поэтому надеюсь, вам было полезно. Жду вас в Telegram-канале. Обязательно переходите, подписывайтесь. Подписывайтесь на YouTube канал обязательно. Вот. И мы с вами увидимся в следующих видео. Пока.

Yeah.