山维空间

标签： Vue3 到 Nuxt3

  • 【视频教程】技术栈大升级：Vue3 到 Nuxt3（4）深入理解 SSR 和 `useAsyncData`

    【视频教程】技术栈大升级：Vue3 到 Nuxt3（4）深入理解 SSR 和 `useAsyncData`

    2023 年，我个人最大的变化，是从 Vue3 SPA 应用向 Nuxt3 SSR 应用过渡，在预期可能存在 SSR 需求的项目中，都尽量使用 SSR。包括 React 应用，也尽量使用 Next.js，而不是 React SPA。

    这个过程中，面临很多问题，很多思路需要转换，很多以前没关注的点需要关注。本系列视频试图快速教会大家这些要点，帮助大家顺利从 SPA 切换到 SSR。

    这次的视频更偏理论，重点讲解 Nuxt3 如何处理 useAsyncData，以及为了兼顾 SSR 和前端开发所做的渲染策略设计。这部分知识我其实很晚才掌握，因为文档里说的也不太详细；所以既是好消息也是坏消息。好消息是，哪怕你没有掌握，也不太耽误使用 Nuxt3 开发项目；坏消息是，保不齐就会遇到一些奇怪的问题，难以复现和排错。

    视频要点：

    1. 现代化 SSR 的优势
    2. 深入理解 useAsyncData
    3. 使用 Pinia 传递数据
    4. 理解生命周期钩子变化

    如果你对 Vue3 开发、Nuxt3 开发、SSR 感兴趣，欢迎关注我的本系列。如果你对这些话题有疑问，欢迎留言讨论。

  • 【视频教程】技术栈大升级：Vue3 到 Nuxt3（2-3）升级实战 – 基础知识，适配 SSR，页面路由

    【视频教程】技术栈大升级：Vue3 到 Nuxt3（2-3）升级实战 – 基础知识，适配 SSR，页面路由

    2023 年，我个人最大的变化，是从 Vue3 SPA 应用向 Nuxt3 SSR 应用过渡，在预期可能存在 SSR 需求的项目中，都尽量使用 SSR。包括 React 应用，也尽量使用 Next.js，而不是 React SPA。

    这个过程中，面临到很多问题，很多思路需要转换，很多以前没关注的点需要关注。本系列视频试图快速教会大家这些要点，帮助大家顺利从 SPA 切换到 SSR。

    继上次的知识科普视频之后，我们开始实战。连续三次直播都比较失败，所以更新比较慢。第二期视频包含以下升级要点：

    1. 处理项目开发脚手架
    2. 迁移静态资源
    3. 修改引用地址
    4. 利用 process.client 和 <client-only> 组件处理不能 SSR 的功能
    5. 处理 TailwindCSS
    6. 使用 useCookie 替代 localStorage

    第三期视频包含以下要点：

    1. 处理页面路由，理解页面嵌套
    2. 全局使用 css
    3. 附赠内容（拖时长）：关于读源码

    后面应该还会再录制两期，分别是：服务器 API 开发；深入理解 SSR 与 useAsyncData+Pinia。

    如果你对 Vue3 开发、Nuxt3 开发、SSR 感兴趣，欢迎关注我的本系列。如果你对这些话题有疑问，欢迎留言讨论。

  • 【视频】技术栈大升级：Vue3 到 Nuxt3（1）基础知识篇

    【视频】技术栈大升级：Vue3 到 Nuxt3（1）基础知识篇

    2023 年，我个人最大的变化，是从 Vue3 SPA 应用向 Nuxt3 SSR 应用过渡，在预期可能存在 SSR 需求的项目中，都尽量使用 SSR。包括 React 应用，也尽量使用 Next.js，而不是 React SPA。

    这个过程中，面临到很多问题，很多思路需要转换，很多以前没关注的点需要关注。本系列视频试图快速教会大家这些要点，帮助大家顺利从 SPA 切换到 SSR。

    本期视频主要介绍 SSR 所需的知识和概念，为下一阶段正式重构项目做准备。

    1. 什么是 SSR？为什么要用 SSR？
    2. SSR 的一般构成
    3. Nuxt3 的 SSR 组件
    4. Nuxt3 的渲染规则与缓存处理
    5. 如何鉴别用户身份

    视频中的课件：从 SPA 到 SSR，从 Vue3 到 Nuxt3

    有任何问题、意见、建议，欢迎留言弹幕私信与我交流。如果你觉得视频对你有所帮助，还请留下宝贵的一键三连，并完播分享，谢谢。