Эволюция в дизайне, фреймворке и архитектуре

Быть в обучающем аду отстой! Это может быть разочаровывающим опытом для любого разработчика. Несмотря на прохождение курсов и создание впечатляющих проектов, часто остается чувство неполного понимания материала. Однако недавно я вырвался из этого круга, начав создавать собственные проекты. Моим первым проектом в этом году был Инструмент генерации холодных писем на базе ChatGPT3. Я нахожу волнение от создания программного обеспечения с возможностями генеративного ИИ, когда я не могу предсказать результат для заданного ввода, волнующим. После завершения базовой версии я решил доработать инструмент до полезного продукта. В этой статье я расскажу о своем пути превращения моего простого доказательства концепции в продукт, которым я мог бы поделиться с друзьями.

Дизайн

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

Фреймворк и стиль

Чтобы улучшить приложение, я решил обновить внешний интерфейс с ванильного javascript до React. Я ожидал, что приложение будет иметь сложную логику пользовательского интерфейса, которой будет трудно управлять без фреймворка. Чтобы еще больше упростить процесс, я также решил использовать styled-components для стилизации, так как я уже знаком с использованием стека React и styled-components в работе. Этот проект послужит для меня возможностью получить дополнительный практический опыт работы с обеими технологиями.

Архитектура

Я решил сохранить существующую архитектуру приложения. Он по-прежнему размещался на Netlify CDN и использовал бессерверную функцию для вызова API ChatGPT3. Однако я осознал, что в будущем мне может понадобиться больше контроля над серверной частью, что сложно с бессерверными функциями, поэтому я планирую рассмотреть возможность изменения архитектуры в будущем.

Вы можете ознакомиться с текущей версией приложения на новом сайте.

Основные выводы

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

Планы на будущее

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