З яким фреймворком можна найшвидше побудувати фронтенд для вебсервісу?
Питання до гуру фронтенда.
Який сучасний фреймворк чи бібліотека підходить для найшвидшої побудови фронтенду?
Є новий хобі-проєкт. Бекенд PHP. Є REST API.
Мій досвід у фронтенді це bootstrap3 + jquery. Але це вже трохи застаріло. І виходить якось занадто багато коду для банальних операцій.
Що з сучасного більше підійде для швидкого створення гарного фронтенду для прототипу вебзастосунку?
40 коментарів
Додати коментар Підписатись на коментаріВідписатись від коментарівКожен порадить свій фреймфорк) я б порадив Vue. Але ж це треба доку читати і розуміти як реактивність працює, інакше тільки більше проблем...
Тому я б залишив bootstrap, викинув jQuery та додав би HTMX. З PHP стакається дуже добре
Next.js з server actions, Drizzle-kit — ORM, Turso — БД, стилі на Tailwind, готові компоненти з shadcn-ui
Почитайте уважно, що людина питає, тоді роздавайте свої «корисні» поради.
Спочатку треба зрозуміти для чого у вас REST API? Хто окрім веб-морди буде використовувати цей API? Якщо більш ніхто, то не треба городити складнощі на порожньому місці і просто напишіть фронтенд так як зручно вам на PHP. Якщо у вас Laravel то там купа всього з коробки.
І не женіться за «сучасним», це може зіграти злий жарт.
Бустрап и воркери
Retool
якщо потрібно прям REST API, то все правильно написали нижче
але я би радив htmx
Дуже ситуативно.
Специфіка проєкту можу буде супер різною від звичайного лендингу до web3 платформ.
Для різних задач — різні рішення.
Класика — Vue (Composition API), React (Context) і звісно TS
Для різного роду SEO — next.js
Для супер здоровенних систем — angular
Наваять на колінці побирому — Solid, Qwik.
PHP + JQuery + BootstrapCSS це, здається, все ще 75% всього інтернету
а
найкраще підійде ChatGPT :)
vue3 з Composition API та TypeScript за основу + UI фреймворк (Vuetify або Quasar) для готових компонентів + Pinia, якщо потрібен менеджмент стану. Це сучасно, швидко і є гарна документація.
це цікаво. а з чого починати? є таторіал саме по такому набору?
Я би почав по гайду з документації vuejs.org/guide/introduction.html Якогось конкретного туторіалу нажаль порадити не можу. В якості прикладу організації архітектури проекту по DDD можете подивитись мій репо (він ще не закінчений але загальні принципи присутні) — github.com/...IvanNever/vue-boilerplate
поставив зірочку
Я ще би порекомендував UI бібліотеку primevue. Багато компонентів і гарна документація.
Повністю згоден, але підкажіть, будь ласка, чи принципово використовувати саме Composition API? Так вийшло, що я собі весь час нормально працював на Options API і не мав проблем, а потім неочікувано для себе побачив незрозумілий хай навколо композиційного підходу)) Це хіба не справа смаку? Дякую заздалегідь)
Vue core team розглядає composition API підхід як основний в перспективі розвитку фреймворку. Pinia відповідно також. Тому окрім особистих вподобань не вважаю доречним пливти проти основного тренду. Про себе особисто також починав з vue2 і відповідно Option API, але с часом перейшов Composition і прям дуже зайшло)
Подскажи вот стоит ли заходить в полноценный фронтенд фреймворк на полшишечки, то есть через vue? Может лучше потратить на пару недель больше и зайти через next.js?
В нього не треба заходити — їм треба користуватись. Можна vue, можна next — різні інструменти під різні задачі
это то же самое что сказать, что Laravel и ASP.NET Core MVC/WebAPI под разные задачи.
Оно то можно, но оно такое ... мертвенькое. Никуда ваш вью не поплывет без поддержки корпорации.
Згоден,
і я хоч і не гурру фронтенда але щодо Vue + typescript треба бути обережним бо оскільки тс не підтримується з коробки то бажаної швидкості розробки можна неотримати
Vue3 написаний на TS і йде з ним з коробки. Не вводьте в оману)
Зайшов написати про vue)
А що vuex більше не використовують?
а якусь generic-адмінку на зенді / laminas / mezzio хтось десь бачив?
Найшвидше, це знайти якесь готове CMS, типу Wordpress або Jumla познаходити готове в інтернеті і налаштувати це для себе, тобто обійтись чистою девопсією і нічого не розробляти взагалі. Розробка це дорого і довго.
А так наприклад Angular/Vue/React-Redux або просто JQuery та CSS фреймверк наприклад Bootstrap або Zurb Foundation. Так само повний інтернет вже готових бібліотек компонентів — бери та компонуй як треба, якщо є вміння персона метод, скетчі, дизайн і т.д. Професійні же фронтендщіки полюбляють велосипедити мало не усе підряд, крім може React-а з Angular-ом. В мене є таке розуміння, що воно там там не їхати, там застафити по більше народу.
Для чого писати про речі, якими ви не користуєтесь, не розумієте, для чого вони і навіть не знаєте, як вони називаються?
Для чого?
Я з голови до ніг бекендер, але коли треба щось зробити фронтове (для власних потреб, або якщо замовнику потрібен невеличкий дашборд) то vue2 + bootstrap-vue як набір компонентів для мене саме то
Швидко засвоїв, легко пишеться і реально економить час порівняно з тим як я б використовував просто js +html для подібних задач
Ще для теймплейтів використовую pug замість html. Фронтендери його матюкають, але у моїх задачах реально час економить.
Pug недарма матюкають. Як мінімум потрібно на смітник викидати всі свої HTML-сніпети.
Ну у мене такого нема. Компоненти виходять досить лаконічні і виглядає красивіше ніж купа HTML тегів.
В складних UI так не буде працювати. Завжди є рецепти і заготовки. Інколи беруться сніпети з документації UI фреймворка (чи StackOverflow :) ).
UI-щики все життя учаться працювати з HTML, їм збивати руку не сильно хочеться.
Если коротко, то не ведись.
Якщо це має бути щось типу адмінки-дашборди, то рекомендую придивитись до filamentphp — filamentphp.com
Зараз юзаємо його для одного невеличкого проєкту то дуже задоволені швидкістю розробки, простотою та гнучкістю системи.
Я теж
Я теж
Але, мені здається вхід не такий вже прям простий.
Я зараз просто мікро проект роблю з ним вже тиждень і мабуть ще дня 3(три) буде треба.
Хоча — коли бек готовий (моделі та таблиці) він — Філамент — дійсно пришвидшує прям помітно
Після jquery найлегше буде перейти на vue.js.
Він не сильно завантажений складними концептами. Можна в декілька рядків знаючи тільки JS накидати якоїсь динаміки на сторінку. Разом з тим це повноцінний мейнстрімний фреймворк. Там все є і для більш складніших рішень.
Для прототипу вистачає TypeScript-а, без каркасів
???
Для звичайного прототипу достатньо JavaScript-а без каркасів, бо github.com/camsong/You-Dont-Need-jQuery
А TypeScript має кращі підказки тому, якщо є досвід з jQuery то можна одразу починати робити застосунок, а потім вже при потребі вибрати каркас React, Vue або Svelte
— у кого є архітектурний план простого дачного будинку?
— та можеш просто цеглу використовувати і все
Це сам автор топіка написав.
Уявіть, на скільки більше коду буде, коли він перейде на ванільний TypeScript.
Ржу когда кидают эту бессмысленную ссылку) Неужели кому то нужен жеквери чтобы прям кроссбраузерно манипулировать дом?) Конечно же нет. Жеквери нужон чтобы заводить великое множество жеквери плагинов.
я думав що JQuery потрібен щоб писати `on` а не `addEventListener` )