Комментарии 26
Статья мне зашла, спасибо. (я не программист если что). У меня при использовании Cursor фронт идет всегда тяжелее чем бэкенд. Попробую теперь Verсel для своих поделок. Не первый раз встречаю что промпты народ передает на английском, я лично с Claude Sonnet общаюсь на русском, и проблем вроде не было. Есть какая то необходимость именно в английском? Преимущества какие то? Поделитесь опытом у кого как происходит. У меня сложилось впечатление что языковой модели по фигу на каком языке к ней обращаться.
Спасибо за обратную связь)
Ну, я, честно говоря на русском не пробовал промпты там пилить. Сразу начал с англ так как у меня англ рабочий язык и я на нем в целом пишу все, что связано с работой.
Но например глубокие исследования в GPT у меня лучше отрабатывают на английском. Ответы получаются глубже и детальнее.. возможно потому что источники тогда ищет англоязычные по большей части, а если на русском, то русскоязычные, которых меньше.
В случае с Vercel надо тестить, но когда есть GPT под рукой, то в целом становиться не важно на каком писать промпты, он же перевести может спокойно)
Если кто-то сравнивал Ру/Eng промпты в Vercel, поделитесь опытом, тоже интересно есть ли разница)
Первая ошибка найдена за 5 секунд (!). При переходе по навигации и нажатии на "назад" в навигации отображается две активных кнопки. И это при том, что это роутером + компонентой ссылки должно делаться по дефолту и автоматически, т.е. внутри реализация не типовая, а наверченная болванчиком.
Вторая найдена еще секунд за 10: Выпадающим меню в навигации невозможно пользоваться, оно пропадает при уходе мыши с кнопки-активатора.
Наверняка это не единственные ошибки и их там миллион и маленькая тележка и на тестирование подобных реально даже не джуновских а стажерских косяков (которые они сами должны находить и исправлять) нужно потратить не один день.
Светлая тема выглядит... оригинально. Кнопка connect wallet (которая, наверное, должна вызывать метамаск или что-то подобное) - мертвая. И я не уверен, что болванчик осилит её подключить. Хотя на сайте примерно 80% кнопок мертвых...
Думаю, что чуть более сложные вещи чем визитка с двумя формами сразу же начнут все ломать лавинообразно, а на починку будет уходить все больше и больше сил (и токенов с их оплатой).
Вы тестировал тестовый лендос?) Который я сделал по ходу написания статьи и только те секции, которые в статье же и описал ? И вообще не прорабатывал ни одну из страниц, ни темы, вообще ничего))
https://v0-crypto-staking-spa.vercel.app
Это странно..зачем вы тестируете на ошибки то, что было сделано просто для скриншотов показать флоу работы… за пару промптов буквально.
Протестируйте, пожалуйста, сайт не тестовый, сделанный за 2 минуты ради пары скринов, а реальный, который висит на моем домене https://orbion.so
Там я действительно прорабатывал страницы и логику, и если там есть баги и ошибки то буду рад обратить на них внимание и исправить :)
Но ведь то, что "не тестовое" меньше, чем то, что тестовое. Те элементы, которые вызывали ошибки - вырезаны (и про которые я писал выше). Кроме кнопки back и отображения текущего раздела, которые работают, да (с нюансом, про который ниже). Но сайт вообще никакой. Основная экономия на времени взаимодействия заказчик-исполнитель. Хотя если взять готовый шаблон, вставить свои (пусть и сгенеренные нейросетью) тексты и картинки - будет все равно быстрее, чем 8 часов + 30 баксов, реально. Хоть в дримвевере, хоть в тильде.
Из косяков (некритичных) на "проде" заметил, что все (или почти все) "ссылки" это кнопки, и не имеют отображения адреса перехода.
Но особо не тестил, ибо нечего (а раздел документация, я так понимаю, какой-то стандартный и нейросеткой не трогался или почти не трогался).
Так и что это за сайт? Функционала никакого не нашёл. Что там тестировать? Хотите какого-то мнения или оценки, так покажите исходники, кому не лень поковыряются да скажут будет ли такой проект жить в будущем.
Как то не очень понял причем тут SPA. SPA подразумевает под собой клиентскую логику, интенсивную динамику (ну например - чат). А у вас обычный лендос, который проще было на пхп накидать.
SPA это сингл Пейдж аппликейшн без сервер сайд рендеринга, при чем тут пхп который сервер сайд и который не имеет отношения к SPA
SPA это сингл Пейдж аппликейшн
В этом и суть. Аппликейшин, то есть приложение с какой-то логикой, высокой степенью интерактивности, обработкой данных на клиенте, длительными сеансами взаимодействия. А у вас сайт из нескольких страниц, на которых обычный текст, изображения, ссылки, иконки, несколько аккордеонов, формы и бургер-меню.
Первый рендеринг главной страницы из пяти секций на десктопе, в Chrome, на проводном соединении произошёл на отметке 2.9с и потребовал 19 запросов JS общим объёмом около 1.1мб. По мне так это неоправданно много. Всё из-за того, что так работает выбранный вами инструментарий и его не рационально использовать для такой задачи.
Я посмотрел страницы сайта и не увидел там чего-то, для чего вообще нужен JS. То есть сайт с точно таким же внешним видом, адаптивностью и функциями можно сделать без клиентского JS, роутеров, контекстов, вебпаков и прочего. Разве что десяток-другой строк JS для обработки форм и бургер-меню.
В моём понимании это должен быть обычный статический сайт, а в качестве инструмента для разработки, если хочется фреймворк, я бы предложил Astro, Eleventy, Hugo и другие SSG с упором на zero JS by default. ИИ бы также помог сгенерировать сайт на этих технологиях. Или, если нужно было быстро и без написания кода, то какие-нибудь готовые шаблоны.
Отсюда и вопрос от izibrizi2 и меня насчёт целесообразности, как вы писали, "сделать полноценный SPA-сайт" и выбора технологического стека для разработки контентного сайта.
Так вы и сделали на нексте сервер свайд рендер, в запросы сетевые загляните. Мало того, рект копоненты несказанно дольше рендерятся чем обычные текстовые шаблоны
Вы видимо не туда смотрите, либо не мой сайт. У меня там XHR реквесты (асинхронные), которые просто тянут данные. А страницы уже рендерятся на фронте. Серверсайд рендеринг это когда при переходе по страницам постоянно перегрузка страницы происходит (потому что рендерится все на сервере, и возвращается целиком на фронт готовая страница).
Ну так посмотрите какие данные в этих запросах идут. То что вам по аяксу прилетают отрендеренные данные особой погоды не делает
SPA (Single Page Application) - это одностраничное веб-приложение, в котором весь сайт работает как одна HTML-страница, а переходы между “страницами” реализуются на фронте с помощью JavaScript без полной перезагрузки страницы. Основная логика отрисовки UI лежит на клиенте.
Если при переходе между страницами в твоём приложении вся страница не перезагружается, а вместо этого происходит запрос к серверу (XHR, Fetch) за нужными данными, и затем эти данные отрисовываются прямо в браузере с помощью JavaScript - это называется клиент-сайд рендеринг (Client-Side Rendering, CSR).
А сервер-сайд рендеринг (Server-Side Rendering, SSR) - это когда при каждом запросе на новую страницу сервер сам собирает полноценный HTML, уже содержащий все нужные данные, и отправляет его браузеру. В этом случае браузеру не нужно ждать загрузки JavaScript, чтобы увидеть контент - он сразу отображается.
Не понимаю, о чем мы спорим…
Ровно эту-же информацию можно найти просто на любом сайте / форму / определении. Это база.
Это база.
жаль, что это не так
А вот такая технология, это SSR или SPA (CSR)?
https://remix.run/
Я думаю, (если вопрос ко мне), лучше спросить @Fragster или кого-то из ребят, которые оставляли комментарии выше.
Они знают лучше техническую сторону. И Судя по тому, что я вижу, будут рады обсудить именно техническую часть.
Мой интерес в другом) так что не смогу помочь
Мы спорим о том, что ради простого перехода между страницами, где просто отображается контент и есть пара форм (то что вам нейронка сделала), нет смысла поднимать nextjs, так как простой пхп скрипт будет делать это проще и быстрее (проще, потому что нет необходимости в сложной среде типа nextjs, а быстрее, потому что текстовые шаблоны гораздо легче рендерить чем запуск реакт компонентов, вычисления состояния и вирткального dom). А если бы вы реализовывали более менее сложную логику, то вскоре бы обнаружили: 1. Нейронка выдает не совсем то, что вы хотите. 2. Вы не прнимаете что вам написала нейронка. 3. При просьбе нейронки исправить баг или добавить фичу, она бы начала руинить существующий код. Про архитектуру я вообще молчу
Тут нет предмета для спора как по мне.
Я сделал за вечер то, что на PHP пришлось бы делать сильно дольше из-за вёрстки и адаптивности под все лейауты.
А так-же предварительный дизайн всего сайта.
Я пропустил шаги дизайна, пропустил шаги адаптивности и вёрстки, пропустил шаги хостинга и аренды сервака. Я все пропустил мимо и просто текстом сделал готовый сайтец - в этом суть.
Я вас не пытаюсь обратить в новую веру. То что я налила в статье - для меня сильно проще и лучше по качеству чем то, что предлагаете вы. Я - не Вы. Вам проще делать дизайн потом верстать потом на сервере рендерит - мне проще потратить вечер и сделать все промптами "не отходя от кассы". В этом и разница и мне кажется не о чем спорить вообще)
Мне лень верстать, перепроверять лейауты, заморачиваться со стилями, даже если это tailwind и потом ещё на пхп рендерит и гостить где-то вручную - я все эти этапы прошёл давно и сейчас сильно больше ценю время и силы. Поэтому ищу самые простые пути решения задачи, так как цель у меня не сделать топовые сайт, а в конечном итоге продать продукт и для этого мне не надо рокет Сайнс с технологиями, отличать SSR или SPA , думать о том, что такое SPA, считать миллисекунды загрузки, и прочее.
У меня другая цель и я отталкиваюсь именно от цели.
И оценку инструменту и результату я даю исходя из своей цели и зоны интересов.
Учитывая что мне все равно на скорость загрузки и на бизнес это не будет влиять, мне все равно на отличие технологий потому что продавать я буду не технологию сайта а продукт - бота бинарный файл по сути. Мне все равно на отличие SPA от чего бы там ни было потому что это ровным счетом не дает мне ничего в плане продукта и бизнеса.
То есть я просто не думаю ни про что, что не является частью продукта и не будет его бустить или на него влиять.
Исходя из этой пресупозиции я и выбрал этот инструмент . Вот и всё.
и разумеется программисты будут оценивать это продукт совсем под другим углом , нежели я . И это нормально потому что они оценивают его как конкурента и говорят о плюсах и минусах с точки зрения технологии, а я с точки зрения бизнеса ))
Так и да, вайб-кодинг создает эффектные решения за 5 минут, но, как было сказано выше, проблема начинается в доработке того, что накидал LLM.
Без понимания архитектуры приложения, подсаживаться на Курсор опасно: LLM лопатят код немерянными портянками.
Сначала смотришь на сгенеренный код, все вроде грамотно.
И накрывает эйфория - сейчас забабахаю шедевр за 5 минут.
Проблемы начинаются, когда количество кода растет и LLM, контролируемый тем же Курсором, не переиспользует имеющийся код, а лихо генерит повторяющийся бесконечными портянками. Смело затирает рабочий функционал.
Это мой опыт.
Если что, годовая подписка на Cursor и Anthropic, месячные подписки на OpenAI, Google, AI, Studio, Groq. Использую интенсивно, налабался обходить LLM ловушки.
Вы мечете бисер перед свиньями) для тех, кто отчаянно верит в идею "я теперь всё могу делать сам, без программистов!" ваши слова гарантировано выглядят как попытка вывернуть ситуацию таким образом, что программисты всё-таки будут нужны - их опыт, экспертиза. а эти ребятки хотят без опыта) и уже сейчас слепо копируют всё, что им выдаст нейронка, на уровне лэндинга, а потом гордо бегут рассказывать об этом на хабре.
им не пришло в голову раньше, что проект-то обычно на простом лэндинге не заканчивается - не придёт и сейчас, после вашего разумного комментария. эти слова сказаны написаны уже тысячу раз - им плевать. там, за горизонтом, маячит прекрасное будущее, в которое так хочется верить. а вы(и я, и все те, кто пытается выдернуть мыслительный процесс подобных мечтателей из облаков) только мешаете :)
Судя по минусам, вы задеваете за живое вайб кодеров. Хотя может выражение про свиней и резковатое. В комментариях автору уже рассказали, что его поделка далека даже от джуновской реализации, 1.1мб яваскриптов тут не нужны и абсолютно нерабочее все оправдывается, что оно для демо не делалось. Лично меня такие статьи наоборот радуют, я понимаю, что у профессии веб-разработчика останусь еще долго, а такие вайб кодеры еще и повод поднимать уровень з.п. выше т.к уже не раз были ситуации, когда бизнес наелся «современых решений» и теперь хочет уже рабочее поддерживаемое решение способное конкурировать и быть в ТОП поисковиков
Народ, все комментарии выше по поводу скорости загрузки, качества кода, невозможности масштабировать, необходимости переписывать если допиливать что-то поверх, и прочее..
Я ведь согласен с каждым этим заявлением. Я сам писал на Laravel, Vue, Angular, TS, JS и делал разные решения.
Поэтому вот реально каждый такой коммент выше - я согласен.
Просто чтоб понимали правильно мой посыл - я не заявляю что Vercel заменил всех фронтов и делает работу лучше низ - вообще нет,, он её делает хуже примерно во всем.
Но есть определённые задачи, которые можно сделать за вечер с помощью Vercel и избавить себя от
Проектирования дизайна
Разработки адаптивного фронта
Кодина ручного
Хостинга через ssh
и прочее
Мне не нужен был ТОП сайт по перформансу для SEO оптимизации, не надо было пихать туда логику приложения, не надо было вообще ничего кроме по сути многостраничнорго лендоса, который будет красивым, аккуратным, адаптивным. И для этой цели я заюзал инструмент, который полностью закрыл все потребности на данный момент.
Когда я буду делать авторизацию, базу данных крутить и прочее - я буду писать скорее всего с нуля, либо попробуж переиспользовать компоненты фронта, если получится. Но пока я этого не делаю - мне нужно было быстрое решение вопроса с "визитной карточкой", и чтоб домен потихоньку начал индексироваться - вот эти цели я закрыл с Vercel
Конечно если мы говорим про что-то большее - то Vercel не подойдёт и тут уже каждый комментарий выше будет в тему и я с ним соглашусь)
Просто не вижу смысла стрелять по комарам из ракетницы. Но все дальнейшие мои планы на Vercel не могут быть сделаны априори на данный момент.
Надо просто точно понимать какие инструменты для каких целей подходят, а какие не подходят и использовать их соответственно - в этом был месседж
Сайт с роутингом за вечер без единой строки кода на Next.js с помощью Vercel AI