Тёмный

Nuxt js + SSR: Подробное Руководство на 2021 

JAVA И SКРИПТЫ, ссылка на новый канал в описании
Просмотров 37 тыс.
50% 1

0:00 - О чем данное видео
1:37 - Установка Nuxt.js
6:14 - Структура проекта
11:27 - Что такое pages (роутинг)
20:30 - Зачем нужны layouts
22:47 - Директория store и работа с Vuex
25:20 - Применяем middleware
28:27 - Как создавать и подключать плагины (plugins)
31:42 - Разбираем оставшиеся директории
33:08 - SSR теория
36:35 - SSR практика
О чем данное видео:
- Что такое Nuxt.js, как он связан с Vue.js, почему его стоит использовать.
- Разберем как создать проект на Nuxt-е, подробно пройдемся по структуре проекта.
- Посмотрим как работает уже извесные нам Vuex и Vue Router в Nuxt-e
- Выясним что такое SSR (Server Side Rendering), зачем его используют и реализуем данную функциональность в нашем проекте.
#Nuxt #SSR #Vue

Опубликовано:

 

17 июл 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 72   
@aleksandrsosnin3474
@aleksandrsosnin3474 3 года назад
Технологии... Только разобрался с Vue, Vuex, Vue Router и подумал, что было бы круто автоматизировать их взаимодействие, как вот тебе Nuxt) Спасибо за крутой видос, очень доступно, по делу и главное, не затянуто!
@daniilthegunner843
@daniilthegunner843 3 года назад
О боже ,как же это вовремя! Спасибо тебе!!
@user-gv1mk3jh8b
@user-gv1mk3jh8b 3 года назад
Невероятно полезный, понятный и прятный ролик. С удовольствием его посмотрел и главное понял, куда нужно дальше двигаться и и что нужно повторить. Спасибо за информацию!
@user-np7it6yv6q
@user-np7it6yv6q 2 года назад
Отличное видео. Рассказал всё самое нужное и без лишней воды.
@jackdoe1312
@jackdoe1312 3 года назад
Как я раньше верстал без этих знаний? Респект тебе, Да Да, за такие видосы💪💣
@highway3475
@highway3475 2 года назад
Громаднейшее спасибо!! Весь Vue и Nuxt выучены благодаря тебе и документации)
@artemafonin9474
@artemafonin9474 3 года назад
Огромное спасибо за актуальный контент!
@maksym_shkaf
@maksym_shkaf 3 года назад
Nuxt js + SSR Спасибо большое. Хорошие уроки у тебя. Жаль что их так мало
@javas9164
@javas9164 3 года назад
Мой новый канал ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-mkqceyBXAdo.html Видео теперь будут тут 👆 При рендере конец видео немного обрезался. Продолжение видео по этой ссылке - ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-t2fcVTljUcw.html
@user-wh4dr9qz7x
@user-wh4dr9qz7x Год назад
Нужной информации не нашел, но все равно лайк. Многого стоят таймкоды и нормальный звук.
@ii3246
@ii3246 2 года назад
как всегда... маленький канал и хорошие видосы!))) спасибо! заходишь на миллионики и там один мусор... обидно что они в топе, а такие видосы нет.
@stanislavafanasiev5766
@stanislavafanasiev5766 2 года назад
Просто і зрозуміло! Дякую!
@ltwixy
@ltwixy 2 года назад
Ууух, топ видос🔥🤩 Спасибо тебе дружище💪
@melitopol_Russia
@melitopol_Russia 2 года назад
разобрался с nuxt?
@user-um4tq7oj1x
@user-um4tq7oj1x 2 года назад
Спасибо. Комментарий в поддержку канала.
@Sense1ko
@Sense1ko 3 года назад
Круто, продолжай)
@javas9164
@javas9164 3 года назад
Естественно )
@krup1783
@krup1783 Год назад
крутое видео. спасибо
@TheBakdag
@TheBakdag 3 года назад
День добрый, очень хороший контент представлен. Есть вопрос, вы используете хук 'created()' для инициализации 'fetch', разве не правильней было бы использовать 'async asyncData()' ?
@wbrframe
@wbrframe 3 года назад
Спасибо за материал. По некоторым вопросам стало яснее...Только печаль какая-то..почему же не полный урок загружен?
@rah_emil
@rah_emil 2 года назад
Я конечно не режиссёр, но концовка жёсткая)
@romanenkoonline
@romanenkoonline 2 года назад
Это артхаус, концептуалка.
@sergeysergeev9271
@sergeysergeev9271 2 года назад
А почему сейчас по дефолту нет папки лайоутс?
@w.n.4711
@w.n.4711 2 года назад
А как со временем зборки проекта (есть разница: с ним или без)? И еще дебагом (хот релоад рендерит изменения, но при полном обновлении страницы сервер возвращает скомпиллированую страницу ранее) По крайней мере, сборка реакт + ssr около 5 минут билд (может быть, там чет лишнее и поэтому так долго)... А за дебаг - то это вроде норма. Но может на вю по-другому все реализовано)
@donart959
@donart959 Год назад
Больше про накст ра скажешь на примере авторизации интернет магазина или соц сети?
@CAPSMOL
@CAPSMOL 3 года назад
В начале видео немного не корректно указана основная идея nuxt, чтобы все шло из коробки что используют для разработки на vue, есть vue cli, nuxt же все таки больше про ssr
@yevheniimoskalenko1624
@yevheniimoskalenko1624 3 года назад
круто, а где конец?
@comradea8119
@comradea8119 2 года назад
Рагнарек в смысле? Будет!! Все будет!! Но потом...
@bringmebacklights
@bringmebacklights 3 года назад
Расскажите про модули, очень мало информации по ним, я имею ввиду самодельный модуль, как им пользоваться в проекте не понятно
@bringmebacklights
@bringmebacklights 3 года назад
эта самая ранняя точка входа в проекте
@DreamMaster_ru
@DreamMaster_ru 11 месяцев назад
Как запустить сервер повторно? "npm run serve" не срабатывает
@user-fi9yx3hs7h
@user-fi9yx3hs7h 2 года назад
NuxtJS использует VueJS 3?
@surr3955
@surr3955 3 года назад
годный контент, молодец! А видео обрывается в конце так и задумано?
@javas9164
@javas9164 3 года назад
Спасибо ) Нет, не должно обрываться, при рендере обрезалось. Завтра прикреплю ссылку в комменты на недостающую часть, там, в принципе, 2 минуты
@nelkor3427
@nelkor3427 3 года назад
@@javas9164 видео рендерилось на стороне сервера
@user-sp4pp2qi3r
@user-sp4pp2qi3r 2 года назад
@@javas9164 Спасибо за урок, не нашел твоих соц.сетей, скинь ссылку плиз)
@TheZeyura
@TheZeyura 3 года назад
Спасибо, Друг! Накст прекрасен:) Вопрос : подскажите плиз, где и как теперь подключать Firebase ? Раньше во Vue в main.js ставились импорты базы и firebaseConfig.. А что в Nuxt ? Спасибо)
@eduardomavlyutov4710
@eduardomavlyutov4710 3 года назад
Юрий, подскажите, пожалуйста, вы нашли ответ на этот вопрос?)
@TheZeyura
@TheZeyura 3 года назад
@@eduardomavlyutov4710 да. Есть плагин для файрбейс..
@yevheniimoskalenko1624
@yevheniimoskalenko1624 3 года назад
нужно зайти в папку plagins и там подключить firebase
@lastchancehider
@lastchancehider 3 года назад
круто, спасибо. А что за os у вас?
@denkhis8263
@denkhis8263 3 года назад
linux ubuntu
@ArankFreedom
@ArankFreedom 3 года назад
а зачем геттер использовать в данном случае ? Он же ничего со стейтом не делает, лишняя писанина
@UCmdrhccjVM95UidL5idZw2Q
@UCmdrhccjVM95UidL5idZw2Q 2 года назад
Отличный курс! Лучше, чем у Владилена)
@kantemrati
@kantemrati 2 года назад
ты издеваешься что-ли? Во первых это копия его урока, во вторых урезанная
@aceracer5556
@aceracer5556 2 года назад
Было бы классно обновить информацию nuxt bridge
@dimalukashenko4865
@dimalukashenko4865 2 года назад
А где в Nuxt хранится store на стороне клиента или сервера?
@user-ot1hf9ov6s
@user-ot1hf9ov6s 2 года назад
оба варианта
@timzeynalov3537
@timzeynalov3537 3 года назад
темный экран нифига не видно
@catsapp
@catsapp 3 года назад
Блин, я потом посмотрю, сейчас пхп учу.
@bringmebacklights
@bringmebacklights 3 года назад
пхп днище полное, не тратьте время, node js топ, и по производительности очень близко к java + javascript крайне приятен
@catsapp
@catsapp 3 года назад
@@bringmebacklights Эта инфа устарела )
@KostiaBazrov
@KostiaBazrov 2 года назад
а че внезапно закончилось7
@GrantDrawChannel
@GrantDrawChannel 2 года назад
29:38 Что делать если у меня кошечка?
@yevheniimoskalenko1624
@yevheniimoskalenko1624 3 года назад
почему убрали сервер из nuxt?
@ultrakill5712
@ultrakill5712 3 года назад
Убрали потому что очень много людей выбирали что-то не то при создании проекта, обещали добавить в версии 3. Вопрос теперь в другом, как прикрутить экспресс к nuxt js проекту.
@yevheniimoskalenko1624
@yevheniimoskalenko1624 3 года назад
@@ultrakill5712 чтобы оно в месте работало, через одну команду!
@ant3413
@ant3413 3 года назад
Laravel + Nuxt.js = Плохая идея?
@melitopol_Russia
@melitopol_Russia 2 года назад
есть желающие вместе поработать над проектом на nuxt и изучить что-то новое для себя на практике?
@MeonisRP
@MeonisRP 2 года назад
Еще есть желание?)
@rti-8052
@rti-8052 2 года назад
Упомянул, что есть документация и на русском. На этом сайте 3 языка
@book-summary-ru
@book-summary-ru 2 года назад
Твоих контактов нигде не нашел, поэтому пишу сюда Уже много на русском языке существует виде курсов по базе накста Есть огромная просьба если ты владеешь более глубокими знаниями по наксту - начни ими делиться этого не хватает сделай более глубокий курс по накту, кипаливам, производительности приложений и тд
@capstanfearless
@capstanfearless 3 года назад
Зачем сделали полную копию этого видео от Владилена Минина? ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-lm9olMCRCIc.html Даже про русскую-английскую версию сайта nuxtjs сказали точно в слово. Смысл.
@javas9164
@javas9164 3 года назад
Полных копий никогда не бывает ;)
@user-bp3vk3uj8h
@user-bp3vk3uj8h 3 года назад
@@javas9164 Минин нравится, но в данном случае твой видос показался не таким затянутым. Согласен с тем что полных копий не бывает.
@bohdanbondarenko67
@bohdanbondarenko67 3 года назад
Мне это видео больше зашло, чем Владилена
@user-jh1du8cd5w
@user-jh1du8cd5w 3 года назад
Ха-ха, копипаст) Копия видео от Владилена Минина, ничего нового... Просто не понимаю, зачем это было записывать?)
@javas9164
@javas9164 3 года назад
Да, не спорю, ориентировался я на его видео )
@user-jh1du8cd5w
@user-jh1du8cd5w 3 года назад
JAVA И SКРИПТЫ сделай лучше то, чего нет, или например перевод уроков с англ языка. Например REST API авторизация и регистрация. На эту тему нет ни одного свежего и нормального видео на русском.
@nelkor3427
@nelkor3427 3 года назад
@@javas9164 нет, чел, ты лучше!
@Gennady41
@Gennady41 2 года назад
Извини, но как-же бесит "обВертка". Русский учи...
@faizulla5838
@faizulla5838 2 года назад
если удалить все анимашки, посторонние звуки(чпокания, звоночки и прочая дребедень, )а также фоновую музыку которая в обучающем ролике "ни в п-ду ни в красную армию".... и если сек 2-3 замирать после каждого объяснения показывая код чтобы можно было бы записать в извилины поглубже.... то ролик ничего. а так что шрека смотреть что это...один фиг - экшен
Далее
Vue.js: SSR с помощью Nuxt.js | Meta/conf
47:05
Nuxt 3 full course build and deploy | #Nuxtjs #vue #nuxt3
2:49:16