Transcription
Использование ИИ-агентов для создания любого приложения, которое вы хотите, называется "vibe coding". И "vibe coding" — одна из самых захватывающих и быстро развивающихся областей в ИИ в 2026 году. И эти ИИ-модели для кодирования становятся мощнее каждый месяц. А новички начинают создавать все более сложные приложения, при этом ИИ пишет, по сути, весь код. И если вы наблюдаете за этим со стороны, может показаться, что вы отстаете. Но правда в том, что "vibe coding" гораздо легче понять, если сосредоточиться всего на несколько часов. Самое приятное то, что если у вас есть подписка на ChatGPT, теперь у вас есть доступ к лучшему инструменту для кодирования и лучшей модели для кодирования в мире для новичков — Codec и GPT 5.5. Даже если у вас нет никакого опыта в программировании, это будет самое полное видео о "vibe coding". В этом видео мы создадим три типа приложений. Мы создадим веб-приложение, мобильное приложение и настольное приложение. Все это во время изучения ключевых концепций, необходимых для высококачественного "vibe coding". Так что, если вам нравятся подробные руководства по использованию самых мощных инструментов ИИ в мире для бизнеса и создания приложений, обязательно нажмите кнопку подписки и кнопку "нравится". Не будем терять больше времени. Давайте погрузимся. Итак, вот это Codec, и именно здесь я занимаюсь всем своим "vibe coding". Теперь, чтобы скачать Codec, вам нужно будет зайти в любой браузер и ввести openai.com/codex. И когда вы это сделаете, ваша веб-страница будет выглядеть так. В этом случае вы скачаете для Mac OS. Следуйте инструкциям, чтобы установить его на свой компьютер. Как только вы запустите Codec, он будет выглядеть так. И поздравляю. Как только Codec будет установлен на вашем компьютере и запущен, у вас теперь есть возможность использовать лучший в мире инструмент для кодирования с помощью ИИ для создания таких приложений, как веб-приложения, настольные приложения, мобильные приложения. Фактически, в этом видео мы создадим веб-приложение, а затем превратим это веб-приложение в настольное приложение, а затем и в мобильное приложение. Но прежде чем мы это сделаем, я хочу немного поговорить об основах Codec и лексике, которую вам нужно понимать, чтобы заниматься "vibe coding" на Codec. Вы можете просто ввести идею своего приложения, и он создаст все ваше приложение, а затем вы сможете начать его использовать. Итак, когда вы зайдете в Codec, вы увидите боковую панель. Для простоты, когда вы создаете приложение, я думаю, вам следует создать новый проект. И вы можете сделать это, нажав "Начать с нуля" или выбрать место, где будет находиться ваше приложение на вашем компьютере. Как вы знаете, на вашем компьютере есть файлы. И вот на Mac, что я сделаю, так это просто помещу его в папку "Документы". Итак, я дважды щелкну "Документы". Затем я нажму "Новая папка" и введу "простое приложение" и нажму Enter. И теперь мы нажмем "Открыть". Теперь мы видим, что это находится в папке "Документы", и если вы просто наведете на это курсор, вы увидите users/Rileley Brown/documents/simple app — это путь к файлу, где существует ваш проект. Теперь внутри этого вы можете нажать эту кнопку прямо здесь, которая создаст новый чат внутри "простое приложение". И поэтому я могу написать что-то вроде: "Я хочу, чтобы ты создал приложение". И очень упрощенное определение приложения — это просто папка с файлами кода, которая работает как программное обеспечение. Но если мы нажмем на эти три точки и откроем папку "простое приложение", верно? Если мы откроем это в Finder, а затем дважды щелкнем по этому, мы увидим, что в этой папке вообще нет файлов. Как можно создать приложение без файлов? И вот здесь на помощь приходит GPT 5.5. Это модель ИИ, которую мы будем использовать для генерации файлов, которые станут приложением. Позвольте мне показать вам пример. Итак, я скажу: "Я хочу, чтобы ты создал приложение Microsoft Paint, простое веб-приложение, а затем запустил его локально". Итак, мы просто запустим это, и модель ИИ для кодирования, которая является GPT 5.5, теперь начнет писать все файлы кода для этого приложения. И когда она закончит, если мы проверим эту папку, которая называется "простое приложение", мы увидим некоторые файлы. Итак, я поставлю видео на паузу и подожду, пока оно закончится. Посмотрим, сколько времени это займет, и я сообщу вам. Хорошо. Итак, через 5 минут и 44 секунды он ответил и сказал: "Создал его как простое приложение React Vit Paint и запустил его локально". И затем у него есть этот маленький компонент, который говорит "Paint website". Итак, это веб-сайт, который мы создали. И что происходит, когда мы нажимаем "Открыть"? И вот оно. Посмотрите на это. Итак, здесь у нас есть это приложение для рисования, которое мы только что создали. Давайте попробуем протестировать его. Вы можете видеть, что мы можем рисовать прямо в этом маленьком приложении здесь. И давайте посмотрим, работает ли эта кисть. Мы можем, давайте посмотрим, можем ли мы сделать ее синей. Мы нажимаем здесь. И это работает. И у нас есть выбор цвета. Итак, мы можем изменить цвет на этот. И у нас есть Microsoft Paint, который мы создали одним запросом. И давайте скажем, что мы хотим внести изменения. Итак, пожалуйста, сделайте так, чтобы это выглядело как Apple вместо Microsoft в верхней и нижней панели. Пожалуйста, позвольте мне использовать отмену. Если я совершу ошибку, пожалуйста, внесите это изменение. И поэтому мы можем очень легко редактировать приложение, которое мы создали, потому что, опять же, мы просто создаем файлы. Если мы зайдем в эту папку "простое приложение" и откроем ее в Finder, и щелкнем внутри этого "простого приложения", вы увидите, что мы фактически создали файлы. И теперь агент, поскольку агент работает над обновлением приложения, он фактически будет изменять эти файлы. Если вы никогда в жизни не писали ни строчки кода, вам не нужно беспокоиться о том, что делают эти файлы, потому что ИИ настолько хорош в кодировании. Но просто знайте, что ваше приложение живет в этих файлах. И когда оно запускается, оно запускается локально на вашем компьютере, и это позволяет вам просматривать приложение. И вы можете переключать предварительный просмотр, просто нажав эту кнопку прямо здесь. Итак, это приложение, которое мы строим. И вот оно. Вы можете видеть здесь, что он внес изменение. И теперь у приложения есть верхняя и нижняя панели в стиле Apple. И локальное приложение запущено здесь. И поэтому мы можем нажать на это, чтобы открыть правую боковую панель. Мы можем видеть, как наше приложение работает. Теперь вы можете видеть, что это выглядит гораздо больше похоже на Apple здесь. И мы можем протестировать приложение. Мы можем видеть, что мы можем рисовать. Это выглядит больше похоже на Apple. И вы можете видеть отмену здесь. И он также сказал, что я могу сделать Command-Z. Это действительно работает. Хорошо. Итак, что теперь, если я захочу сохранить свою работу в облаке, чтобы я мог работать над ней с другого компьютера или отправить ссылку кому-то еще, и они могли бы работать над этим приложением. Как бы я это сделал? И ответ — GitHub. И если вы такой же, как я, и никогда не писали ни строчки кода, вы можете подумать, что GitHub очень пугает и страшен. Ну, это не так, потому что у вас есть ИИ-агенты. Он может справиться со всем. И что вы можете сделать с GitHub, так это после того, как вы создали учетную запись на GitHub, я рекомендую вам начать с создания нового репозитория. И я рекомендую сделать его приватным. Вам следует сделать его приватным, просто потому что это безопаснее. И затем вы можете назвать его как угодно. Мы можем назвать это "Paint by Riley". И поскольку я являюсь частью организации, я могу просто выбрать свою личную учетную запись здесь. И затем я могу создать репозиторий. И вы можете думать об этом как о том, что вы только что создали новую папку в Google Drive. В основном так вы можете думать об этом, потому что теперь он создал ссылку, как в Google Drive, которую вы можете скопировать. И если мы вернемся в Codec, мы можем фактически сказать: "Эй, мне нравится это приложение. Я хочу загрузить его на GitHub, чтобы сохранить свою работу. Пожалуйста, сделайте это. Я создал новый репозиторий, и вы можете думать о новом репозитории как о папке Google Drive, и вы можете вставить ее сюда. Пожалуйста, загрузите код сюда, и мы можем нажать Enter. И если вы никогда раньше не настраивали GitHub на своем компьютере, спросите Codec: "Эй, я хочу настроить GitHub", и он аутентифицирует вашу учетную запись. Он свяжет вас с GitHub, и вы войдете в систему, а затем вернетесь в Codec, и когда он закончит, он даст вам ответ, который будет выглядеть примерно так: "Загружено на GitHub". Итак, если вы посмотрите на эту ссылку прямо здесь, верно, помните, эта ссылка выглядела так. Вот как она будет выглядеть, когда файлы не загружены. Но когда мы нажмем "Обновить" сейчас, мы увидим все эти разные файлы. И обратите внимание, здесь есть файл исходного кода, есть index.html, есть package и package.json. Это файлы, которые вы видите здесь. Если мы вернемся в Codec, откроем боковую панель здесь. Нажмем на эти три точки. Открыть в Finder. Откроем это приложение. Вот оно. index.html package lock.json package.json. Вот оно. Вы видите все эти разные файлы, и это те же файлы, которые загружаются на GitHub. И это, по сути, сохраненная версия вашего приложения. Так что, если я сейчас внесу изменения в свое приложение, например: "Пожалуйста, сделайте панель рисования наверху больше, а три точки слева — больше", верно, мы можем внести очень простое изменение. И вот оно, оно стало немного больше. И поэтому то, что это сделало, это изменило эти файлы в этой папке прямо здесь. Верно. В этой папке прямо здесь, открыть в Finder в этом простом приложении. Оно изменило эти файлы где-то в этих файлах. Оно изменило строку кода в этих файлах, и это вызвало это изменение. Но GitHub еще не изменился. Верно. Если мы зайдем на GitHub, верно, где находится сохраненная версия нашего приложения, вы можете видеть, что 2 минуты назад было наше последнее изменение, и есть только один коммит. Если мы вернемся в Codec, я могу сказать: "Пожалуйста, закоммитьте изменения на GitHub". Вот что вы говорите, если вы можете представить это как "Пожалуйста, обновите наше сохраненное приложение в Google Drive". Это, по сути, эквивалент для тех из вас, кто полностью нетехнический. Вот как вы сохраняете свою работу на GitHub. Вы просто говорите: "Пожалуйста, закоммитьте изменения на GitHub", и он сделает это. Теперь, если мы вернемся на GitHub и обновим страницу, мы увидим, что у нас теперь два коммита, и он только что был обновлен. И вы можете видеть здесь: "Сделать заголовок рисования больше". Вот оно. Вы можете видеть, что мы только что внесли эти изменения, и теперь весь код актуален. Хорошо. Итак, очень быстрый обзор, прежде чем мы перейдем к созданию более сложного приложения. Но в итоге, все, что мы сделали до сих пор, это использовали Codec, который является настольным приложением, для создания приложения. В примере, который я показал вам ранее, мы решили создать веб-приложение. Это приложение, которое вы можете открыть в браузере. Как только вы развернете его в Интернете, к чему мы перейдем позже, его можно будет открыть в любом веб-браузере. Процесс его создания заключается в том, что вы заходите в Codec, вводите запрос, и это отправляет ИИ-агента, верно. Этот ИИ-агент будет запускать модель кодирования, и в данном случае это GPT 5.5. И он редактирует, создает и удаляет файлы. И эти файлы находятся в проекте на нашем компьютере. И когда мы запускаем его локально, что означает запуск на нашем компьютере, это означает, что мы можем просматривать приложение. И вы видели, что фронтенд нашего приложения — это приложение для рисования. И мы внесли несколько изменений в это приложение, потому что, опять же, это цикл, верно, после того, как вы ввели запрос, ваш агент может создавать файлы. Затем вы можете использовать приложение на своем компьютере, а затем вы можете снова ввести запрос, верно. Вы можете снова ввести запрос, и агент внесет изменения, и вы можете проходить этот цикл столько раз, сколько захотите. И затем, когда мы довели его до точки, когда мы хотели сохранить свою работу, возможно, мы хотели поделиться ею с другом, чтобы он тоже мог работать над приложением, мы использовали Google Drive для гиков, также известный как GitHub, и мы создали репозиторий, просто зайдя на GitHub. Мы создали новый репозиторий, верно, когда он на вашем компьютере, это называется директорией. Когда он на GitHub, это называется репозиторием. Я понятия не имею, почему. И мы дали ссылку на Codec, и он смог загрузить код на GitHub, чтобы сохранить наше изменение. И затем, как только мы внесли эти небольшие изменения, он обновил репозиторий, и поэтому вы видите два коммита вместо одного. Хорошо, теперь пора создать гораздо более сложное приложение. И помните, мы начинаем с веб-приложения. Моя идея для веб-приложения — это приложение, которое я называю "Общий мозг". Итак, вот идея. Я хочу создать красивое внутреннее веб-приложение, которое действует как общий второй мозг для идей видео. Приложение будет местом, где моя команда и я сможем сохранять все, что может стать будущим контентом. Будь то посты в Twitter, видео на YouTube, посты в Instagram, статьи, скриншоты, реакции, ссылки, крючки или разрозненные идеи. Все должно находиться в визуальной библиотеке, которая ощущается как мой разум. Это мой разум. Это другое приложение, но у них нет общих функций. Я хочу общие функции моего разума. Мы хотим место, где мы можем сохранять наши идеи, как центральный хаб базы данных, и мы хотим, чтобы оно выглядело очень хорошо. Это центральная идея. Каждый сохраненный элемент должен автоматически извлекать лучшие доступные метаданные. Это очень важно. Часть того, почему мне так нравится мой разум, заключается в том, что он извлекает все эти данные. Верно. Когда я сохраняю ссылку на Twitter, он показывает эту маленькую карточку. Когда я сохраняю ссылку на пост в Instagram, например, он сохраняет эту маленькую карточку. Я хочу убедиться, что мы получим тот же эффект, чтобы он был немного более визуальным. Я хочу, чтобы приложение поддерживало категории. Вы знаете, это похоже на Notion. Вы можете добавить выбор, чтобы создавать разные категории. Каждая идея также должна иметь дату съемки. Так что это просто поле даты, которое я могу вручную изменить. Приложение должно быть разработано как для людей, так и для агентов. Вот где становится интересно. Поскольку это внутренний инструмент, который мы создаем, я хочу, чтобы мой ИИ-агент или любой ИИ-агент, который я использую, мог обновлять его и читать из него. Так что, если я хочу сказать: "Эй, нам нужно 10 видео, на которые мы можем отреагировать. Пожалуйста, просмотрите базу данных". Он должен иметь возможность просмотреть базу данных и найти лучшие вещи, на которые мы можем отреагировать для видео. В этом и заключается вся суть этого приложения — предоставить нашим агентам и нам место, где мы можем сохранять различные идеи, и поэтому это здесь. Также должен быть связанный с приложением навык агента. Так что, когда пользователь входит в систему, когда пользователь входит в систему в профиле пользователя, должен быть копируемый блок навыков или инструкций, который может быть предоставлен любому агенту, такому как Codec или Cloud Code. И этот навык должен объяснять, как получить доступ ко второму мозгу и работать с ним. Он должен включать требуемый пароль или токен доступа. Таким образом, только агенты с этими учетными данными могут использовать систему. И затем мы немного поговорим о том, как это должно ощущаться. Это приложение должно ощущаться как премиальное и спокойное. Оно не должно выглядеть как обычная панель администратора. Оно должно ощущаться как частная творческая операционная система для визуальных идей или для идей видео. Визуальная, удобная для поиска и достаточно быстрая и организованная, чтобы команда могла использовать ее каждый день. И затем я дал небольшое, я всегда люблю делать, например, вкратце, это общий визуальный второй мозг. Мне нравится обобщать основную мысль, чтобы ИИ-агент знал, что для меня действительно важно. И поэтому это выглядит довольно хорошо. Что я собираюсь сделать, так это просто скопировать всю эту идею. И что я собираюсь сделать, так это открыть Codec. И помните, ранее мы создали новый проект для этого простого приложения, которое запускает Microsoft Paint. Мы хотим создать новый. И поэтому мы хотим создать новый проект. Использовать существующую папку. И одна из вещей, которую вы можете сделать, это просто нажать "Начать с нуля", и он автоматически создаст папку. И вы можете видеть здесь, он создал "Новый проект 9". И поэтому то, что я люблю делать, это сразу же переименовывать его. Итак, я просто переименую папку, переименую проект, и мы можем назвать это "Мое приложение: Общий мозг". Первое, что я сделаю, это скажу: "Вот идея моего приложения. Создайте файл Markdown под названием "Моя идея" и имейте именно это". Итак, что я хочу сделать, так это просто сохранить свою идею в этой папке. Верно. Если бы мы сделали так, открыли это в Finder, щелкнули в этом проекте, мы хотим сохранить файл Markdown здесь, к которому агент будет иметь доступ. И агент создаст его через секунду. И вот оно, оно появляется. И теперь мы можем видеть его в нашей папке. И у нас есть эта папка Markdown. Мы также можем открыть ее в Codec. И вот наша идея. И мне просто нравится иметь это открытым, чтобы агент всегда мог вернуться и взглянуть на наш план. Хорошо. Итак, прежде чем мы просто отправим этот запрос и позволим агенту попытаться построить все это, нам нужно настроить кое-что невероятно важное: аутентификацию, базу данных и хранилище. Так что, если вы помните ранее, мы создали это приложение Microsoft Paint. Помните это, где вы можете создавать маленькие рисунки, рисовать здесь. Главная проблема с этим в том, что если ваш браузер обновится, пуф, ваши данные исчезнут. И причина, по которой это происходит, и причина, по которой ваши данные исчезают, заключается в том, что они просто хранятся в вашем браузере. Это очень временно, верно, если бы вы действительно хотели создать хорошее приложение для рисования, вы бы хотели, чтобы эти данные хранились где-то. И поскольку это веб-приложение, оно не может храниться на вашем компьютере, потому что что, если вы захотите использовать его на своем телефоне? Нам нужно создать базу данных, где будут храниться все данные. И для этого мы будем использовать Firebase. Мы будем использовать Firebase для трех вещей конкретно. Чтобы пользователи могли входить в систему. Мы будем использовать его для базы данных. Итак, у нас будут эти таблицы базы данных, где все хранится. А также хранилище. Итак, мы можем добавлять активы, такие как изображения. И это небольшой пример, который я создал раньше для Twitter. Верно. Аутентификация — это просто вход или регистрация. Когда вы регистрируетесь, это позволяет вам создать пользователя и проверить этого пользователя и убедиться, что это как бы реальный человек, чтобы вы могли войти в систему. А затем этот человек будет внесен в таблицу пользователей. Затем все остальные данные, которые являются текстом или, возможно, это как имя пользователя или это может быть что-то вроде истина или ложь. Это очень, очень похоже на все, что было бы в базе данных Notion. Верно. Вы можете создавать такие вещи, как булевы значения или флажки, которые являются как да или нет. Вы также можете создавать множественный выбор. Так что это как выбор, вы знаете, у вас могут быть категории. Это те типы вещей, которые вы бы хранили в базе данных. А затем вам нужно как бы хранилище, и именно для этого мы также будем использовать Firebase. И это для хранения таких вещей, как изображения, видео или любые типы файлов. Итак, вот что мы используем в Firebase. Но прежде чем мы сможем просто запрыгнуть в Codec и сказать, чтобы он построил все это, нам на самом деле нужно создать новый проект в Firebase. Итак, мы зайдем на firebase.google.com, а затем нажмем "Начать работу в консоли", а затем нажмем "Получить" или "Создать новый проект Firebase". Затем следующие шаги, которые я собираюсь предпринять, займут от двух до пяти минут, в зависимости от того, делали ли вы это раньше. И как только мы закончим, весь остальной процесс будет выполнен в Codec. Это единственный раз, когда мы будем выходить за пределы платформы. Нам просто нужно настроить нашу аутентификацию, базу данных и хранилище. Это действительно легко, как только вы освоитесь. Мы можем назвать это "Общее приложение", "общее пространство". Я забыл, как я назвал приложение. Ничего страшного. И я отключу это. Использовать Gemini в Firebase. Отключить включение Google Analytics. Нам это пока не нужно. Хорошо, ваш проект Firebase готов. Нажмем "Продолжить". Теперь первое, что мы сделаем, это подключим Google Firebase к Codec. И поэтому нам просто нужно добавить приложение, и мы нажмем на "Веб-приложение". Это кнопка веб-приложения. И я просто назову это "Общий веб-регистрационный проект". Неважно, как вы его назовете. И это даст вам ключ Firebase. Теперь я не позволяю никому видеть эту информацию прямо здесь. Это как пароль. Это ключ, который позволяет людям получать доступ к вашей базе данных, хранилищу и аутентификации. Так что не позволяйте никому видеть это. Я скопирую это на данный момент. И что я сделаю, так это вернусь в Codec, и я просто скажу: "Это моя информация Firebase. Сохраните ее. Мы используем ее через секунду". Просто скопирую ее сюда. Ничего больше, Markdown. Так что мы можем ввести это в Codec. Итак, теперь мы просто даем ему этот контекст. Теперь есть еще несколько вещей, которые нам нужно сделать. Итак, нам нужно продолжить до консоли. Первое, что мы сделаем, это настроим базу данных. Итак, мы нажмем на Firestore. Теперь то, что мы хотим сделать, это инициализировать базу данных. Мы хотим создать ее, чтобы она существовала. И мы можем нажать "Создать базу данных". Теперь мы просто нажмем "Далее". Далее. Начать в режиме продакшена. Создать. И мы закончили. Как только вы увидите этот экран, мы закончили. Вам больше ничего не нужно делать. Затем мы перейдем к базе данных и хранилищу и спустимся к хранилищу. Этот процесс очень, очень похож. Это потребует от вас обновления. Я думаю, это как бы вы можете сделать до 10 долларов, и вы даже не потратите ни копейки, если только вы не загрузите кучу файлов. Это просто на случай, если проект станет слишком большим. Он начнет взимать с вас плату, но вы можете установить максимальную сумму, которую хотите потратить. Итак, мы обновим этот проект. Я просто выберу один из уже настроенных мной платежей. Возможно, вам придется подключить свою кредитную карту, создав платежную учетную запись. Итак, мы нажмем на этот прямо здесь. Мы установим максимальный бюджет. Мы можем сделать 20 долларов. И мы нажмем "Продолжить". Связать платежи в облаке. Итак, все связано. И мы нажмем "Готово". И мы нажмем "Продолжить". И теперь мы можем начать это в режиме продакшена. Итак, что я сделаю, так это нажму "Создать", и это создаст наш бакет хранилища. Итак, помните, мы настраиваем бакет хранилища, базу данных, а затем нам нужно настроить аутентификацию. Аутентификация — это вход в ваше приложение. И поэтому нам просто нужно настроить это. Теперь то, что нам нужно сделать, это перейти к Google. Я хочу, чтобы люди могли входить через Google. Я уверен, что когда вы заходите на веб-сайт и видите "Войти через Google", вы чувствуете облегчение, потому что войти через Google относительно легко. Вы просто нажимаете несколько кнопок по сравнению с тем, что вам приходится делать, например, электронная почта и пароль. Итак, я включу это. Когда вы выберете эту часть прямо здесь, это как бы хочет, чтобы вы выбрали адрес электронной почты поддержки. Просто выберите тот, который рекомендуется, а затем нажмите "Сохранить". И теперь мы настроили аутентификацию. Итак, первый шаг, который мы сделали, где мы скопировали этот код, этот код сообщит Codec, какой проект Firebase мы используем, а это "Общее пространство". И затем мы, по сути, включили аутентификацию, хранилище и базу данных. Таким образом, Codec теперь может взаимодействовать со всем этим проектом. И он увидит, что мы включили эти три вещи. И поэтому теперь нам просто нужно сказать Codec построить наше приложение. И если мы откроем это, мы можем видеть, что проект находится прямо здесь. И не волнуйтесь, я переверну все эти ключи, если какой-либо из них утечет. Но я просто скажу, что у вас есть все необходимое, чтобы построить это приложение полностью, используя Firebase для вашей базы данных, хранилища и аутентификации. Я хочу вход через Google. Я уже все включил. Пожалуйста, можете ли вы построить все приложение? И оно должно выглядеть хорошо. Оно должно делать все, что мы перечислили в плане. Потратьте время на размышления и создайте полное приложение, которое мы описали. Теперь я хочу посмотреть, сможет ли оно построить это приложение полностью. Это, вероятно, займет около 20-25 минут, если я должен угадать. Так что я пойду выпью стакан воды после того, как введу этот запрос, но мы посмотрим, справится ли он. Давайте посмотрим. Хорошо, посмотрите на это. Оно работало 25 минут и 51 секунду. У нас есть локальный предварительный просмотр. Что мы можем сделать, так это нажать на localhost. И вот оно. Мы видим страницу входа, и на ней есть кнопка "Продолжить с Google". И поэтому я могу нажать "Продолжить с Google". Итак, эта ошибка Firebase или всплывающее окно аутентификации, заблокированное, может быть ограничением этого встроенного браузера. Что я собираюсь сделать, так это протестировать это. Я открою это во внешнем браузере и посмотрим, хорошо, что здесь происходит? Итак, мы можем продолжить с Google, если мы войдем с помощью riley@ or kirkwardbrgmail.com, и нажмем "Продолжить". Хорошо, здесь у нас "Отсутствуют или недостаточны разрешения". Это очень интересно. Что происходит, если мы добавим Я вставлю ссылку x.com. Давайте посмотрим. О, я вставил эту ссылку x.com, и она автоматически переключилась на X. Так что, если я нажму "Сохранить элемент", о, оно загрузило данные, но не позволяет мне сохранить. Хорошо, я нажму "Отмена". Я хочу понять, почему это так. Вот действительно хороший совет: вы можете использовать "Инспектировать элемент" или "Инспектировать". Итак, если вы щелкнете правой кнопкой мыши в браузере и нажмете "Инспектировать", это откроет эту боковую панель. Что вы можете сделать, так это перейти в консоль. Мы можем просто скопировать всю эту информацию здесь. И мы вернемся в Codec. И я просто опишу все, что происходит во внешнем браузере. Я могу войти в свою учетную запись. Я попытался добавить ссылку x.com, и оно извлекло правильные метаданные, по крайней мере, для контента. Однако, когда я нажал "Сохранить", оно фактически не добавило его в базу данных. Я также видел, что у меня не было достаточных разрешений, а затем я инспектировал элемент, и получил это. Итак, я собираюсь вставить то, что было в журналах консоли. Все это просто журналы, которые объясняют, что идет не так в консоли. И часто, как здесь, говорится: "Не удалось загрузить ресурс". Сервер ответил статусом 403. Это очень полезно предоставить агенту. И поэтому мы посмотрим, что он сделает здесь. Хорошо. Через 1 минуту и 10 секунд он закончил. И здесь он работает на localhost, но также работает на этом сервере веб-приложения. Мы можем открыть это во внешнем браузере. Давайте протестируем это. Итак, мы можем добавить элемент. Давайте сделаем так, давайте вставим эту ссылку сюда. И мы можем нажать "Сохранить элемент". И бум. Вот оно. Эта карточка не выглядит потрясающе, но у нас действительно есть сохраненная карточка. И поэтому, если мы зайдем в Firebase, верно? Помните, мы добавили базу данных. Так что мы можем зайти в Firebase и перейти в консоль Firebase. И вот наш проект Firebase. Если мы зайдем в аутентификацию, мы увидим, что у нас зарегистрировано два пользователя. Оба — это я, потому что я тестировал приложение. И поэтому в аутентификации вы можете видеть всех зарегистрированных пользователей. И мы можем перейти непосредственно в базу данных. Мы можем нажать на базу данных Firestore. И здесь мы видим пользователей. Мы видим, что есть одно рабочее пространство, и это рабочее пространство имеет уникальный идентификатор, который находится здесь. И мы можем нажать на элементы. И затем мы можем нажать на этот прямо здесь. И поэтому Codec хорош для нетехнических задач. Здесь вся информация о том, что мы сохранили. Так что, если мы вернемся к нашему приложению здесь, мы можем видеть, что оно говорит: "Codec хорош для нетехнических задач". И здесь мы видим: "Codec хорош для нетехнических задач". Так что он хранится в базе данных. И Google Firebase имеет другой способ просмотра базы данных. Это не столько таблица, как, например, Superbase. Но, на мой взгляд, им гораздо проще пользоваться, и им гораздо проще редактировать, если вы хотите добавить больше полей и тому подобное в будущем. Это гораздо более динамично. Я также хотел бы протестировать YouTube. Итак, давайте добавим. Как добавить? Хорошо, добавить элемент. Давайте добавим ссылку на YouTube. Давайте добавим эту ссылку на YouTube. Посмотрим, как это сохранится. О, хорошо. Похоже, что он не имеет точного миниатюры, которая ему нужна. Так что это я хочу дать обратную связь Codec. Итак, я сделаю скриншот и вернусь в Codec и скажу: "Итак, в приложении, когда я загружаю пост X, он выглядит так. Мне не нравится синий круг, который находится в посте X, а затем видео на YouTube не загружает правильную миниатюру. Итак, я хочу, чтобы вы выяснили, как MyMind и другие подобные приложения извлекают соответствующие данные, чтобы они отображались и показывали миниатюру на YouTube. А затем в X он должен показывать первый кадр, если это видео. Если это картинка, должна отображаться картинка. И поэтому, пожалуйста, выясните, как это сделать. Это будут в основном видео на YouTube и ссылки на X здесь. Так что я хочу убедиться, что они хороши. И тогда также, они не отображаются в формате сетки Masonry. Они должны быть рядом друг с другом. Это два подряд, которые я разместил, и они как бы друг над другом. Так что, пожалуйста, выясните это. Хорошо. Итак, похоже, что он закончил. Итак, я просто скопирую эту ссылку localhost прямо здесь. И я просто открою свой браузер. И мы просто вставим это сюда. И давайте протестируем это. Итак, что я хочу сделать, так это добавить новый элемент. И мы можем добавить твит здесь. Эм, давайте добавим этот твит. Давайте посмотрим, что произойдет, если мы сохраним элемент. Вот оно. Это правильно. И если мы фактически перейдем по этой ссылке прямо здесь, мы увидим, что это этот подкаст. Итак, это эта ссылка. Так что есть эта копия прямо здесь. Затем есть видео, которое начинается с этого кадра. Это действительно круто. И у него есть этот кадр прямо здесь. Он появляется. Выглядит довольно круто. Мы можем нажать на него. И вот некоторые заметки. Хорошо. Сохраненный пост из X. Хорошо. Сохраненный пост из X. Так что я мог бы сказать: "Интересный подкаст для коммуникаций". И мне нужно сохранить, или он просто автоматически сохраняется? Хорошо, круто. Он автоматически сохраняется. Так что он сохраняется в базе данных. Что произойдет, если мы добавим видео на YouTube? Итак, я собираюсь добавить видео на YouTube сюда. Эм, это одно из моих видео. Так что давайте посмотрим, как это получится. Вот оно. И оно даже извлекло заголовок. Так что Codec полный 2026. Это действительно круто. И поэтому, могу ли я добавить их в категорию? Статус категорий. Как мне это сделать? Сохранить для будущего обзора. Добавить категорию. Хорошо, я вижу. Так что я могу поставить "длинный формат" или я могу поставить "реакция". На самом деле, давайте. Так что это не отображается здесь, но мы видим "длинный формат". Могу ли я? О, так что категория отображается здесь. Так что она отображается в базе данных. Так что, если мы добавим "реакцию" к категориям здесь, мы должны увидеть "реакцию" здесь. Так что я теперь могу фильтровать по "реакции" или "длинному формату" или "всем категориям". Очень круто. Имейте в виду, это два запроса. Я думаю, два или три запроса, мы создали это. Теперь давайте протестируем Instagram. Итак, если мы добавим новый элемент, и я возьму это видео из Instagram от Тимоти Шаламе. И если мы вставим это сюда, что произойдет, если мы нажмем "Сохранить элемент"? Вау, оно извлекает все данные. У него странный формат. Баскетбол. Это довольно круто. Хорошо. И это разные размеры, что нормально. Это часть сетки Masonry, которая похожа на мой разум. И поэтому это приложение начинает выглядеть гораздо лучше, верно, у нас может быть, мы делаем Instagram. Давайте посмотрим, что произойдет, если мы загрузим скриншот. Итак, я просто сделаю скриншот себя прямо здесь. Вот как это выглядит, если бы мы добавили элемент. Мы могли бы. Можем ли мы перетащить это? Нет, я не думаю, что мы можем это сделать. Я скопирую это изображение здесь. Я выберу файл. Давайте загрузим это. Сохраним этот элемент. Давайте посмотрим, работает ли скриншот. О, я думаю, мы могли столкнуться с ошибкой. Это хорошо. Хорошо. Хранилище не авторизовано. Итак, что нам нужно сделать, так это перейти в Codec. Отличная работа с Twitter, YouTube и Instagram. Они работают, но скриншоты не работают. Я получил эту ошибку. И я собираюсь вставить это сообщение об ошибке. И мы можем запустить его. Давайте посмотрим, в чем проблема. Хорошо. Итак, он сказал: "Исправлены и развернуты правила хранения". Итак, проблема заключалась в том, что скриншот попадал в хранилище Firebase до того, как в документе был элемент. Хорошо. Давайте перейдем и протестируем это. Итак, если мы обновим это прямо здесь, мы должны иметь возможность сделать так. Добавить элемент. Выбрать файл. Давайте загрузим то же изображение сюда. Давайте сохраним его. Хорошо. Итак, вот скриншот. Он появляется в сетке. Теперь то, что мы хотим сделать, это придумать лучший формат для заголовка, верно? Этот заголовок довольно сумасшедший. Итак, мы хотим использовать легкую модель ИИ для автоматического создания заголовков. И поэтому я просто сделаю скриншот этого. И я использую приложение под названием CleanShot X. И это приложение позволяет мне очень легко рисовать на изображении. И я нахожу это гораздо проще, особенно когда вы делаете скриншоты большого количества изображений. Теперь мы можем вернуться в Codec. Хорошо, именование этих вещей становится немного странным. Что я хочу сделать, так это добавить легкую модель ИИ, используя API OpenAI, которая очень быстро анализирует любой тип данных, а затем придумывает лучший заголовок для него. Если в описании или на скриншоте есть чистый заголовок, например, он должен по умолчанию использовать самый консервативный, простой, буквальный заголовок для него, и он должен быть коротким и менее шести слов. Да, он должен передавать вещи кратко, и мы будем использовать для этого легкую модель ИИ. Хорошо, так что я хочу быстро объяснить кое-что. Итак, мы хотим использовать ИИ в нашем приложении. И это означает, что мы хотим использовать технологию ChatGPT для анализа всех элементов, которые вставляются в наше приложение. И поэтому ChatGPT очень быстро использует ИИ для анализа и создания хорошего заголовка. И поэтому, чтобы добавить технологию ChatGPT в наше приложение, нам нужен API. И поэтому мы будем использовать API ChatGPT. И что это сделает, так это то, что этот API позволит нам вставить технологию ChatGPT в наше приложение, очень похоже на такой инструмент, как Perplexity, который использует API всех других компаний и помещает их в свое приложение. И именно поэтому вы слышите термин "обертка ChatGPT". Дело в том, что для использования API, на самом деле, это стоит денег, верно, каждый раз, когда кто-то использует ваше приложение и создает заголовок, это стоит денег, и это, вероятно, будет меньше цента каждый раз, когда кто-то добавляет что-то. Вероятно, гораздо меньше цента, потому что это очень небольшое количество слов или токенов, но тем не менее вам понадобится ключ. Итак, чтобы использовать API ChatGPT, вам нужен ключ. То же самое, если бы вы использовали API Anthropic, верно, если бы вы использовали Enthropic, если бы вы использовали Nano Banana от Google, вам понадобился бы API-ключ. Чтобы использовать API ChatGPT, вы можете просто найти "OpenAI Platform". И вы можете нажать на это прямо здесь. И затем вы войдете в систему. И как только вы войдете, вы нажмете на "API-ключи". И затем то, что вы сделаете, это создадите новый секретный ключ. И вы придумаете имя. И я введу свое имя. Мы можем назвать это "Общий мозг", что является названием нашего приложения. Я поставлю видео на паузу прямо сейчас, потому что я не хочу, чтобы этот ключ был показан. Хорошо, я скопировал ключ в буфер обмена и вернусь в Codec, и в Codec я скажу: "Вот мой API-ключ". Хорошо, я вставил свой ключ ниже, и теперь я нажму Enter, и поэтому теперь мой запрос выполняется. Мой API-ключ включен. Я добавлю, является ли он, он должен анализировать скриншоты. Хорошо, так что это сделано. Итак, он использовал 4.1 нано, что является очень быстрой моделью, что на самом деле то, что нам нужно. Итак, если мы вернемся к нашему приложению здесь, мы можем фактически обновить его. Итак, давайте обновим. И что мы можем сделать, так это сделать x.com. Давайте сделаем это, это я. Мы нажмем "Сохранить". И он просто сохраняет "Пост из X". О, Codec для нетехнических задач. Он переименовал его. Хорошо, так что это довольно хорошо. Он переименовал его "Codec для нетехнических задач". И он использовал ИИ для генерации этого. Давайте попробуем еще раз. Давайте сделаем видео на YouTube. Давайте сделаем это видео, и мы сохраним этот элемент. "Конкуренция для проигравших" от Питера Тиля. "Конкуренция для проигравших". Хорошо, так что ИИ теперь переименовывает его в зависимости от того, что это. По какой-то причине видео на YouTube показывают эту странную вещь здесь. Итак, если мы вернемся в Codec и вставим этот скриншот, пожалуйста, сделайте видео на YouTube, как будто у них есть этот странный наложенный слой. Сделайте его как красную кнопку воспроизведения вместо этого и сделайте его лучше. И пока это загружается, я просто сделаю скриншот этого. Я хочу реорганизовать эту часть прямо здесь. Итак, я просто сделаю скриншот. И теперь я вырежу это. И я просто хочу привлечь внимание агента к этой части прямо здесь. И мы вернемся в Codec. И я скажу: "Я сейчас дважды нажму для whisper flow. flow. И кстати, я использую whisper flow, чтобы говорить в Codec. Так что я дважды нажму". Хорошо. Что я хочу сделать, так это изменить его так, чтобы там, где показывается ваш второй мозг, где я ввожу в строку поиска, я хочу, чтобы все фильтры были выпадающими. Так что они должны быть справа от строки поиска. И поэтому я хочу, чтобы был выпадающий список категорий. И поэтому я хочу, чтобы он был по умолчанию "все категории". И затем я хочу, чтобы был выпадающий список платформ, где я могу выбрать платформу. И по умолчанию это все платформы. И поэтому таким образом у нас есть разные фильтры. И тогда, поскольку это внутренний инструмент, я хочу, чтобы все пользователи также отображались. Так что я хочу иметь возможность фильтровать по пользователю. И это означает, что сейчас я вошел как кто-то, и я хочу иметь возможность по умолчанию это мои посты, верно, он не должен показывать посты других пользователей, потому что он автоматически фильтруется, но я хочу иметь возможность видеть все посты. И это, возможно, вам придется изменить разрешения, потому что помните, это внутренний инструмент. Я хочу иметь возможность видеть всех остальных. Если я выберу "все пользователи" или выберу других пользователей, и это будет внутренний инструмент. Так что, если кто-то другой войдет из моей команды, я должен увидеть его имя как вариант, но по умолчанию я должен видеть только свое. Итак, будет пользователь, будет платформа, и будут категории. Затем мы нажмем "Остановить запись". Мне нравится просто записывать свой голос. Посмотрите прямо на приложение. Говорите, говорите. Как только я закончу, я вернусь в Codec. И теперь мы можем запустить этот запрос также. Пока это работает, мы можем проверить предыдущий, который мы сделали. Посмотрите, вот оно. Наши видео на YouTube исправлены. Так что мы можем фильтровать по YouTube. И вы можете видеть, что теперь у нас есть красный плюс. Я думаю, это начинает выглядеть довольно хорошо. Кроме того, я хочу, чтобы вы использовали другой шрифт. И тогда я хочу, чтобы вы сделали фон более серым и сделали его как очень легкий градиент от серого до немного более темного серого, чтобы придать ему немного больше энергии. И каким-то образом сделайте карточки немного лучше. Может быть, добавьте легкую рамку вокруг них. Не переусердствуйте. Это приложение начинает выглядеть немного блеклым для меня. Я хочу, чтобы оно просто немного оживило края. И поскольку они совершенно не связаны, я просто позволю этому закончиться. И как только это закончится, он введет его в запрос. И это называется постановка в очередь. Так что по умолчанию он ставит в очередь. Так что ваш запрос просто будет здесь ждать, пока агент не закончит, а затем он будет введен. Или вы можете управлять им, нажав "Управлять". Или вы можете нажать Command Enter. Он введет ваш запрос в это. Хорошо. Итак, я думаю, это было около шести или семи запросов. Мы создали это приложение прямо здесь. Оно очень похоже на мой разум, и мы можем очень легко загружать ссылки. ИИ анализирует их, дает им названия. Он извлекает графику, чтобы сделать его таким графическим интерфейсом. Так что я могу очень легко увидеть, о чем пост. Так что это действительно круто. Я могу фильтровать по постам. Итак, что я собираюсь сделать здесь, я на самом деле хочу проверить многопользовательскую природу этого. Итак, если я сейчас выйду из системы и нажму "Продолжить с Google", и мы войдем под другой моей учетной записью, я могу переключиться на другую учетную запись, Riley 1, а затем я могу переключиться обратно на свои посты. Давайте добавим новый элемент. Я собираюсь добавить ссылку x.com. Мы выберем случайную. Эта выглядит хорошо. Теперь, что я собираюсь сделать, так это нажать "Сохранить элемент". "Разработчик агентов OpenAI на Dev Day". Это именно то, что это. Это действительно круто. Так что он использует ИИ для его именования. И теперь я могу нажать "Все пользователи". Итак, теперь он показывает мои и всю мою команду. Так что у нас есть второй мозг, который является многопользовательским по своей природе. И я думаю, это выглядит чертовски хорошо. Хорошо. Теперь пора взять наше приложение, которое сейчас работает на localhost:5175. Это означает, что оно работает локально на нашей машине. Если бы вы отправили кому-то эту ссылку прямо здесь, localhost:5175, и они ввели бы ее в свой браузер, они бы ничего не получили. И то, что мы хотим сделать, это поместить его в настоящий Интернет. И способ сделать это — развернуть его. И лично я буду использовать Versell. И вы можете очень легко настроить Versell, зайдя в плагины, и мы будем искать Versell. И вы скачаете этот плагин. И затем посмотрите, как это легко. Развернуть в Versell. Затем дайте
мой публичный линк. Еще одна вещь, которую вам нужно будет сделать, мне нужно добавить в Firebase одобренные ссылки для аутентификации. Я объясню это через секунду. Итак, теперь это развернуто в интернете. И поэтому все, что мне нужно сделать, это нажать на эту ссылку, и она приведет меня на настоящий веб-сайт. Так что это настоящий развернутый веб-сайт в интернете. Но посмотрите на это. Когда я нажимаю "Продолжить с Google", я получаю ошибку. Это недопустимый домен. Поэтому то, что нам нужно сделать, это причина, по которой я попросил дать нам домен для ввода в авторизованный домен в Firebase, заключается в том, что нам фактически нужно дать этому новому домену разрешение на использование аутентификации. И поэтому мы просто скопируем эту ссылку прямо здесь. Теперь мы перейдем к тому же проекту Firebase, который мы создали ранее. И теперь мы собираемся перейти к аутентификации, и мы собираемся перейти к настройкам. Мы собираемся перейти к авторизованным доменам. И обратите внимание, здесь есть localhost. И поэтому именно поэтому localhost работает по умолчанию. Это автоматически авторизованный домен. И именно поэтому всякий раз, когда вы используете localhost, это просто работает. Вы можете использовать аутентификацию. Но нам фактически нужно добавить домен для приложения Verscell. И если бы мы добавили пользовательский домен, нам пришлось бы добавить и его. Так что нам нужно нажать "Добавить". Теперь посмотрите на это. Если мы вернемся к "Shared Brain", давайте обновим его. Продолжить с Google. И теперь это работает. И поэтому теперь я могу войти с той же учетной записью, с которой я вошел раньше. И я должен увидеть все свои данные. Действительно вижу. Мы можем увеличить масштаб здесь. Вот все мои данные. Это на sharedbrainer.riley.cell.app. И это все. У нас есть веб-приложение, которое было развернуто на Verscell. Оно находится в интернете. Это настоящий веб-сайт в интернете, и все, что мы сделали, чтобы добраться туда, это мы дали подсказки CodeX. Агент, который является GPT 5.5, создал некоторые файлы. Мы итерировали, и агент вносил изменения в эти файлы. Мы посмотрели. Мы добавили базу данных аутентификации, чтобы наши данные хранились. Мы добавили хранилище, чтобы мы могли добавлять эти скриншоты и даже видео. И мы развернули его на Verscell. Мы использовали GitHub, чтобы сохранить нашу работу. Теперь это в интернете. Теперь я хочу поговорить о том, как перейти от веб-приложения к настольному приложению и мобильному приложению. И вместо того, чтобы я отвечал на этот вопрос, давайте просто перейдем к CodeX. Итак, на CodeX я собираюсь использовать эту подсказку прямо здесь. Хорошо. Я хочу превратить это приложение в настольное приложение и приложение для iOS. Мы будем использовать Electron и Swift. Electron — это просто стек. Это вроде как обертка веб-приложения, но превращенная в настольное приложение. И я нашел его самым простым в использовании. И мы будем использовать Swift. И это для мобильных устройств. И я хочу получить план. Я хочу план, чтобы сделать это. И он будет взаимодействовать с тем же бэкэндом. И вся база данных, хранилище и аутентификация останутся, скажем так, подключенными. И я хочу, чтобы все эти приложения работали вместе. Так что моя команда может использовать любую версию. И тогда мы говорим: создайте план в файле markdown. Так что у нас будет CodeX, который придумает план по преобразованию этого приложения в настольное приложение и приложение Swift. Хорошо. Он создал весь этот план. И вместо того, чтобы создавать новый проект и создавать совершенно новый контекст для нового агента для реализации этого плана, я на самом деле даже не знаю ответа на этот вопрос. Я спросил, должны ли мы делать это в этом проекте здесь, по этому пути к файлу, или нам следует создавать новые проекты для каждого из них? И он сказал: сделайте это в этом проекте. И поэтому то, как агент планирует это сделать, это то, что он фактически создаст папку "apps", а затем там будет веб-приложение, там будет настольное приложение и приложение iOS — все в одном проекте, который является этим проектом "my apps shared brain". Итак, что мы собираемся сделать здесь, так это то, что поскольку он уже знает всю информацию о нашем веб-приложении и он уже много думал о плане, я собираюсь позволить ему приготовить. Хорошо, я думаю, что он готов. Так что я просто скажу: хорошо, пожалуйста, внимательно посмотрите на план, который вы создали. Вот план. К тому времени, когда вы закончите, я хочу иметь возможность использовать все три этих приложения вместе. Сделайте их идеальными и готовыми к использованию для моей команды на любой из этих трех платформ. Не останавливайтесь, пока не закончите. Давайте приступим. Мы увидим, сможет ли AI-агент, это, вероятно, займет 40 минут. Я пойду обедать, пока это работает. Мы посмотрим, как далеко он продвинется, и посмотрим, сможет ли он взять наше веб-приложение и превратить его в настольное приложение, которое мы можем скачать, и приложение для iOS, которое мы можем отправить в App Store. Хорошо, посмотрите на это. Он работал 29 минут и 52 секунды. И поэтому то, что мы только что попросили его сделать, мы попросили его создать настольное приложение и приложение для iOS. И поэтому теперь мы собираемся попросить его сделать следующее: мы собираемся сказать: можете ли вы, пожалуйста, запустить настольное приложение. Это должно быть в состоянии сделать все, что вам нужно для запуска приложения. Так что оно должно быть в состоянии запустить его, и мы должны открыть его как настольное приложение. Ого. Вот оно. Это только что открылось на моем компьютере. Я вижу настольное приложение. Оно не на том экране здесь. Может быть, я могу переместить его сюда. Я не знаю, видите ли вы это. Я на самом деле не могу его переместить. Давайте посмотрим, могу ли я развернуть его на весь экран. Итак, я действительно могу развернуть его на весь экран, но я на самом деле не могу перемещать его. Я собираюсь убедиться, что мы сообщим об этом CodeX. Правильно. Кстати, я не могу перемещать окно. Пожалуйста, позвольте мне, например, взять верхнюю часть окна и перемещать ее. Но давайте посмотрим, сможем ли мы войти. Итак, мы можем развернуть его на весь экран. Продолжить с Google. Хорошо, давайте войдем с Riley@notanumber. Хорошо, ошибка блокировки всплывающих окон. Кроме того, я получил эту ошибку. Он позволил мне войти, но когда я, он перевел меня на веб-сайт, чтобы войти, а затем обратно в приложение, и я все еще вижу это. Так что мы просто вставляем эту ошибку сюда. Хорошо, оно только что перезагрузилось. И позвольте мне очень быстро разобрать это приложение. Итак, это приложение Electron. Оно работает на нашем компьютере, и оно даже создало этот маленький значок для него и назвало его "Shared Brain". Да, у него нет закругленных краев, как у других значков, просто такой квадрат, но у него есть значок на нашем компьютере. Итак, если мы просто нажмем "Продолжить с Google". Хорошо, оно открыло это. И теперь мы можем нажать "Открыть Shared Brain". Давайте посмотрим, войдем ли мы. Да, посмотрите на это. За несколько подсказок мы вошли в настольное приложение, которое выглядит точно так же, как наше веб-приложение. И поэтому мы можем просто, если мы сделаем так, мы должны быть в системе. Хорошо. Итак, здесь у нас идентичное приложение, и, возможно, здесь будут какие-то незначительные различия. У нас есть настольное приложение здесь, слева, и наше веб-приложение здесь, справа. Мы создали настольную версию. Это работает на Electron. И давайте посмотрим, что произойдет, если мы добавим что-нибудь на рабочий стол. Итак, если мы добавим что-нибудь на рабочий стол, мы можем перейти на x.com. Давайте добавим этот пост сюда. Мы можем нажать на это. Хорошо, это было добавлено. Итак, это твит генератора SVG. Мы можем нажать на создание этого значка приложения с помощью рабочего процесса AI. Это точно. И это синхронизируется с нашим настольным приложением, которое мы можем просмотреть вот так. Вау, это почти идентично. Это очень круто. Итак, у нас есть это настольное приложение. Давайте сделаем, давайте добавим еще одно. Так что нам следует провести некоторое тестирование. Добавьте это. Это компания, ссылка на твит, который я сохранил о новой компании, выпускающей продукт под названием HQ. Если мы нажмем "Сохранить", он должен использовать AI для генерации всего. И теперь мы можем ввести его. Вау, это выглядит хорошо. Это выглядит лучше. Да, я думаю, это выглядит лучше, чем это. Но вот оно, у нас есть это приложение для заметок. Очень похоже на мой разум. Это настольное приложение. Это веб-приложение. Теперь это подводит меня к приложению для iOS, которое, помните, оно уже построило. Мы просто еще не запустили приложение. Итак, что мы хотим сделать, это вернуться к CodeX. И поэтому я хочу сказать: помните, раньше мы создали мобильное приложение. Я хочу запустить это. Пожалуйста, запустите проект Xcode. Я объясню это через секунду. Итак, пока это настраивается, чтобы вы могли запускать приложения для iOS на своем компьютере, вам нужно приложение под названием Xcode. Итак, Apple создала Xcode, которая является их собственной платформой для разработчиков, которая позволяет вам запускать приложения для iOS на вашем компьютере, используя что-то под названием симулятор. Так что вам понадобится Xcode и симулятор. И по ссылке в описании ниже я размещу полное руководство по началу работы с Xcode и симулятором. И его относительно легко настроить. Вам нужен Mac для этого. Он будет запускать его в симуляторе iPhone прямо на моем компьютере. И посмотрите на это. Он говорит, что сборка симулятора идет. Пакеты Firebase и Google Signin разрешены. Xcode компилирует нативное приложение. Теперь приложение для iOS успешно собрано для симулятора. Я загружаю симулятор iPhone. Теперь посмотрите, вот он. Вот симулятор. Он должен открыть приложение. Дайте ему секунду. Вот оно. Посмотрите на это. Shared Brain. Это приложение, которое находится на нашем компьютере. Давайте войдем через Google. Посмотрим, сработает ли это. Продолжить. Хорошо. Я введу свою информацию. Хорошо. Теперь мы нажмем "Продолжить". Ошибка Keychain. Интересно. Так что я собираюсь сделать, это я просто сделаю скриншот этого, правильно? И мы просто забросим это в него. И я скажу, что получил эту ошибку при входе. Хорошо. Итак, это сделано. Давайте откроем это снова. Если мы перейдем в симулятор, войдем через Google. Продолжить. Хорошо. Давайте посмотрим, что произойдет, если мы нажмем "Продолжить" на этот раз. Бум. на CodeX. Мы создали, посмотрите на это. Это на самом деле безумие. Боже мой. Мы создали веб-приложение с бэкэндом, базой данных и хранилищем. А затем менее чем за семь подсказок мы преобразовали это веб-приложение в приложение Electron, которое работает идеально. Это настольное приложение. Загружено на мой компьютер. Вот оно в Shared Brain. А затем мы создали версию этого приложения для iOS. Я, я, это просто, это буквально, это сносит крышу. Я иногда просто не могу даже постичь, что вы можете сделать это сейчас. И мы фактически выполнили 98% работы за одну подсказку. Это довольно потрясающе для меня. В любом случае, вернемся к видео. И поэтому теперь, если мы хотим итерировать на этом приложении для iOS, мы можем очень легко это сделать. Мы можем просто начать запрашивать некоторые изменения в строке поиска. Пожалуйста, измените текст-заполнитель, чтобы он просто гласил "поиск" вместо "поиск вашего второго, что угодно", потому что он обрезается. О. О, хорошо. Итак, в деталях для каждого из них, например, если я нажму на элемент в списке, отображается заголовок, заметки, статус, план, дата фильма, добавить дату фильма, очистить дату фильма. Все здесь немного слишком громоздко и не очень хорошо. Слишком много компонентов. Я хочу, чтобы все было упрощено. Так что подумайте глубоко и просто исправьте форматирование, как для всей информации о каждом из них. Здесь есть много упрощений, которые вы можете сделать. А затем знак плюс для добавления нового. Я хочу, чтобы это было похоже на кнопку в правом нижнем углу телефона, которая накладывается на все, на что я могу нажать. Это должна быть большая кнопка плюс. Так что переместите ее в правый нижний угол телефона. Это распространенный дизайн, который я видел. Хорошо. Итак, мы вносим около шести различных изменений. И это действительно так просто. И мы можем запустить это. И поэтому теперь это просто изменит приложение для iOS. И мы можем фактически указать, что изменения только в приложении для iOS. И похоже, что это сделано. Мы можем подойти сюда и посмотреть, как это выглядит. Оно гораздо более упрощено. Так что, если вы посмотрите на это, это действительно выглядит намного лучше. Давайте посмотрим, является ли текст-заполнитель просто "поиск". Да. Теперь здесь есть кнопка наложения, которая является плюсом, которая позволяет нам добавить элемент, что, я думаю, лучше. И это приложение выглядит довольно хорошо. И я на самом деле только что вспомнил функцию, которую мы просили добавить ранее, а именно: я хотел, чтобы агенты могли добавлять вещи в мой второй мозг. Так что, если мы скопируем эти инструкции прямо здесь, и если мы на самом деле, давайте просто перейдем к новому чату и скажем: используйте этот навык, добавьте эти твиты в мой "Shared Brain". Хорошо, давайте посмотрим, сработает ли это. Хорошо, это сделано. Он сказал: добавлено все три твита в "Shared Brain" с использованием аутентифицированной сессии Firebase Google. Функция, которую я хотел, я хотел позволить агентам добавлять вещи в мой второй мозг от моего имени. Давайте посмотрим. Подождите. О, это просто мой пост. Давайте посмотрим всех пользователей. О, это сделано. Так что вот оно, оно добавило этот CodeX для повседневной работы, обзор Claude и Claude Opus 4.7. Так что агенты смогли добавить его. Однако я не уверен, с какой учетной записи это, но это действительно круто. Функция агента работает. Агент может добавлять вещи в базу данных, как мы изначально спроектировали. Итак, в итоге, в этом видео мы создали три приложения с помощью CodeX. Мы создали это полное веб-приложение, и за несколько подсказок мы преобразовали его в настольное приложение и приложение для iOS, которое использует тот же бэкэнд, хранилище и все остальное. И теперь это доступно всем в моей команде по этому точному домену. Они могут войти, они могут добавлять в "второй мозг", и они могут видеть все наши посты. И поэтому этого более чем достаточно, чтобы вы могли начать и начать экспериментировать с созданием веб-приложения, настольного приложения или приложения для iOS. Я мог бы довести это до конца и разместить это приложение в TestFlight, а затем в App Store, и даже поставить на него платную стену и начать зарабатывать деньги. Я также мог бы разместить ссылку для скачивания настольного приложения в интернете, но это не входит в рамки этого видео. Я сделаю отдельные видео о том, как создать настольное приложение и как создать приложение для iOS. Это очень глубокие видео, которые это видео длилось бы 6 часов, если бы я вдался во все детали приложений для iOS и настольных приложений. Так что я думаю, что это хорошая точка остановки, чтобы вы могли начать. Если у вас есть подписка на ChatGPT, вы можете буквально использовать CodeX. Попробуйте создать приложение. Вы можете использовать Firebase. Если вы не хотите использовать Firebase, вы можете использовать Superbase или Neon для бэкэнд базы данных и хранилища. Я очень хочу знать, что вы, ребята, строите, так что дайте мне знать в комментариях. Но это действительно веселое видео. Мы фактически будем использовать это внутри компании, и я очень рад видеть, что вы построите. В любом случае, дайте мне знать, что вы, ребята, строите в комментариях. Увидимся в следующем.