SSR 实战:官网开发指南- 掘金小册课程推荐/优惠

SSR 实战:官网开发指南--掘金小册课程推荐/优惠

原理+实战+优化+部署,全链路还原官网实际开发场景
祯民
20讲 | 2052人已学习
优惠价¥29.9
官网购买

版权声明

本站非掘金小册官网,与官方无任何关系。我们不提供课程下载或详细内容,仅作为课程分享和推荐平台。我们鼓励大家支持正版,尊重创作者的劳动成果,这样不仅能帮助创作者持续产出优质内容,也能让自己获得更好的学习体验。请通过官方渠道购买和学习课程,感谢您的理解与支持。

课程详情

课程介绍

作者介绍

祯民,字节跳动前端开发工程师,公众号「祯民讲前端」作者。曾负责 抖音前端技术团队官网字节官网中文版 的开发,现维护抖音直播内容安全相关的业务及 抖音直播宣传中心 的日常运营,对 SSR 开发模式有深入研究和丰富的业务实践经验。

小册介绍

我们知道,C 端网站的数据相对更为敏感、用户容忍度低、部署手续流程更多,考虑不周全往往又会造成不可逆的品牌形象损失,所以开发者在开发过程中会承受很大的心理负担和压力。

大家是不是也有过这样的顾虑和困惑:

  • 怎么对 C 端网站进行技术选型?开发过程和普通的 B 端平台有什么区别?
  • 怎么提高C 端网站用户的体验,且尽可能多地适配多种设备?
  • 服务器集群选多少合适?
  • C 端网站的排名太靠后怎么办?
  • ……

C 端网站类型多样,不论是从项目架构还是商业用途上来分类,都有多种不同的开发方式,上面的问题并没有一套全部适用的解决方案。如果要面面俱到地去学习,将是一个长期沉淀的过程,大家可以从一种项目入手,举一反三。那么哪类项目更合适呢?

我最推荐官网开发

首先,同样作为 C 端网站,官网拥有与其他 C 端网站相同的技术架构选型,都是通过服务器端渲染(简称:SSR,后文均用 SSR 表示)来进行项目的开发和 SEO 优化,并且压测、备案、部署这些流程和大部分 C 端网站都是类似的。

其次,官网往往作为一个公司或团队的门面和品牌形象,有着更严苛的数据敏感、性能及网站排名的要求,最能作为案例来说明上面这些痛点问题。

如果面对官网应用,你能够得心应手地处理数据流转、把控站点性能以及进行 SEO 等优化,那么对于其余 C 端网站应用也不会再一筹莫展。

我希望能把自己在开发中经常遇到的问题和解决方案分享给大家,尽可能地帮助大家建立规范的开发习惯,从而开发高性能、有良好体验、搜索排名高的 C 端网站。

本着深入浅出的原则,小册分为 架构选型、基础开发、常见需求进阶、性能优化、上线部署 5 个模块,共 20 节,每节课都含有详细的 demo 代码示例及操作流程,最后全部会上传 Github 仓库。

  • 架构选型篇,对官网项目进行架构选型,通过对比来学习官网项目的渲染方式。并且将手写一个架构 demo,让大家对框架知其然且知其所以然,为后续的实际开发打下扎实基础。
  • 基础开发篇,从环境配置,到基础页面、路由、接口层。全链路讲解一个简单的服务器端页面是如何去开发的,并介绍怎么解决官网可灵活配置的问题,最终让你能独立从零开发一个 SSR Web 应用。
  • 常见需求进阶篇,从一些常见但是相对复杂的官网需求例子开始,学习它们是怎么实现的,实现的过程可能会出现哪些问题,怎么达到最佳的实现效果,学到这里,相信你已经可以足够应付官网的大部分复杂场景。
  • 性能优化篇,学习如何对官网的体验进行优化,根据实际场景,给出不同的优化方案和对比,详细说明其中的原理,以及针对不同业务场景下的取舍,帮助你提高官网的性能评分和用户体验。
  • 上线部署篇,会从压测、埋点、SEO 和域名备案四个角度,详细学习官网部署时需要注意的事项,通过这个模块,你对整个部署链路的了解都会有较大的提升,最终让你可以在外网部署一个稳定可靠的官网项目。

虽然官网不能覆盖 C 端网站的全部场景,但对于提高代码规范、性能优化、架构设计的功底也会有所帮助。如果你并不想要开发官网,也完全可以做到真正地从零开发一个高性能、稳定、交互流畅、有影响力的对外 Web 应用!

名人推荐

适宜人群

  • 没接触过官网开发,不支持从何下手的同学;
  • 写过官网但是性能不好想要优化的同学;
  • 对 SSR 的实现原理和底层源码感兴趣的同学;
  • 想学习使用 Nextjs 开发 C 端应用的同学;
  • 想了解 C 端应用完整部署上线流程的同学;
  • 针对主题化、多语言等 C 端需求没有思路的同学;
  • 想学习最新的 headless-CMS 框架 Strapi 替代项目 RPC 层,对项目进行数据管理的同学;
  • 希望入门 C 端开发,了解从“开发-优化-配置”的整条链路的同学。

因为篇幅的限制,任何小册都没办法介绍一个开发过程需要的所有技术栈,所以在学习本小册之前,希望同学们可以提前去了解下面的基础技术栈知识:

  • React & hook;
  • Typescript;
  • Nodejs & Express。

课程目录

  • 开篇:为什么学习官网开发?
  • 架构选型:SSR 为什么广泛应用于 C端网站?
  • 架构实现(一):代码 lint & 项目构建
  • 架构实现(二):如何实现 SSR 的静态页面渲染?
  • 架构实现(三):如何支持 SSR 对数据的请求?
  • 快速上手:在 Nextjs 项目中实现完整页面链路
  • 实战入门:如何搭建一个 Nextjs 服务器端渲染项目?
  • BFF数据流转:Nextjs 中的页面数据流转开发实战
  • 数据可视化:基于 Strapi 实现后台数据的灵活配置
  • Animation: 复杂帧动画的逐帧调试 & 实现
  • 样式注入:如何实现一个主题化功能?
  • Strapi 进阶:文章页分页 & 国际化多语言功能的实现
  • 多媒体适配: 官网的设备样式兼容方案
  • 首屏优化: 针对大图低网速加载场景的首屏优化方案
  • 自定义组件: 如何实现一个动画弹窗组件?
  • 设备兼容:IOS 300ms delay & 橡皮筋问题解决方案
  • 性能保障:如何对官网应用进行上线前压力测试?
  • 应用上线: 从官网服务域名的申请备案到服务部署
  • 数据埋点:用户数据的上报统计分析
  • SEO: 如何提高应用的搜索引擎排名?

作者介绍

前端开发工程师
一个啥都想试试的普通前端,掘金小册《SSR实战:官网开发指南》、《前端自动化测试精讲》作者

作者其他课程

前端自动化测试精讲 - 掘金小册课程推荐/分享/优惠/折扣
前端自动化测试精讲
单元测试 + 端对端测试 + 持续集成方案,在项目中落地前端自动化测试
祯民
1348人已学习
优惠价¥29.9
官网购买

推荐

零基础通关 Go 语言 - 掘金小册课程推荐/分享/优惠/折扣
零基础通关 Go 语言
2大部分,10大技能,全解Go语言语法
萧文翰
1151人已学习
优惠价¥49.9
官网购买
前端性能优化原理与实践 - 掘金小册课程推荐/分享/优惠/折扣
前端性能优化原理与实践
毫秒必争!深入理解前端性能原理,将晦涩的知识转化为可爱的生产力,建立你自己的优化技能索引目录
修言
13620人已学习
优惠价¥29.9
官网购买
前端可视化入门与实战 - 掘金小册课程推荐/分享/优惠/折扣
前端可视化入门与实战
从基础到高阶,全面掌握二维和三维的前端可视化开发
谦宇
1191人已学习
优惠价¥59.9
官网购买
Node + React 实战:从 0 到 1 实现记账本  - 掘金小册课程推荐/分享/优惠/折扣
Node + React 实战:从 0 到 1 实现记账本
Egg + React 全栈开发掘掘记账本,助力前端进击全栈。
尼克陈
2310人已学习
优惠价¥29.9
官网购买
WebGL 入门与实践 - 掘金小册课程推荐/分享/优惠/折扣
WebGL 入门与实践
介绍 WebGL 与 CSS 3D 开发的点点滴滴,详细阐述 3D 数学库的实现原理与使用,演示 3D 数学库对于 WebGL 开发和普通网页开发的重要作用,助力每个前端开发者轻松掌握 3D 开发的关键技术。
lucefer
3839人已学习
优惠价¥39.9
官网购买
Flutter 动画探索 - 流光幻影 - 掘金小册课程推荐/分享/优惠/折扣
Flutter 动画探索 - 流光幻影
Flutter 动画探索,一起去见证 Flutter 动画的风采 ~
张风捷特烈
2284人已学习
优惠价¥3.5
官网购买