|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/angular-universal-course/
课程评论:没有评论
课程名称:深入探讨 Angular SSR(原名 Angular Universal) 课程概述: 如果您已经掌握了 Angular,并希望进一步深入 Angular 生态系统,学习 Angular SSR(服务器端渲染),那么这个课程正适合您!请注意,Angular SSR 原先被称为 Angular Universal,但该功能和相关包已更名为 Angular SSR。 在本课程中,我们将从基础开始学习 Angular SSR,通过将现有的 Angular 单页面应用程序(SPA)转换为支持服务器端渲染的应用程序。我们将重点关注服务器端渲染的能力,同时详细介绍构建时预渲染及其相较于服务器端渲染的优势。我们将学习如何通过精细化的应用程序外壳(Application Shell)和状态转移 API 优化应用程序的初始启动性能,使应用程序更加符合搜索引擎优化(SEO)和社交媒体要求。最后,我们还将使用 Google App Engine 部署到生产环境中,并查看最终结果。 课程内容: 我们将从学习使用 Angular SSR 在应用程序中带来的各种优势开始。之后,我们将使用 Angular CLI 创建一个 SSR 包,从而实现服务器端渲染。课程将详细介绍最新的 Angular SSR 命令行功能,包括在开发模式下运行 Angular SSR,以及预渲染静态和动态路由。 接下来,我们将深入了解 Angular SSR 在底层的工作原理,审查 Angular CLI 自动生成的 Express 引擎。这将帮助我们理解通用渲染的详细机制,并为我们提供更多的灵活性。构建完成的 Angular Express 应用程序后,我们将为其增强 SEO 和社交媒体友好性,并实施一些常见的性能优化措施,比如从零开始实现精细化的应用程序外壳,并通过状态转移 API 减少应用程序启动时的 HTTP 请求。 最后,我们将把完全优化的 Angular SSR 应用程序部署到生产环境中,使用针对 Node 的 Google App Engine。 课程收获: 通过本课程的学习,您将能够将现有的 Angular 应用程序转变为服务器端的 Angular SSR 应用程序。您将理解服务器端渲染的好处,并能够优化应用程序以适应搜索引擎和社交媒体爬虫。您还将了解如何进一步优化应用程序性能,并掌握在不同场景下(预渲染应用和运行时服务器端渲染应用)将其部署到生产环境的技巧。
This Course In a NutshellIf you already know Angular, and would now like to dive deeper into the Angular ecosystem and learn Angular SSR (Server-Side Rendering), then this is the right course for you!Notice that Angular SSR was formerly known as Angular Universal, but the package and the feature itself was eventually renamed to Angular SSR.In this course, we are going to learn Angular SSR from first principles, by taking an existing Angular single page application and converting it into an Angular Server-Side Rendered Application.We will focus not only on the server-side capabilities of server-side rendering, but we will also cover in detail build-time pre-prerendering and its advantages compared to server-side rendering.We will learn how to optimize our application for initial startup performance by using a fine-grained Application Shell and the State Transfer API, and we will make the application SEO (search engine optimization) and social-media friendly.We will then deploy it to production using Google App Engine and see the end result!Course OverviewWe will kick-start this course by going over in detail on the advantages of using Angular SSR in our application.After this, we will go ahead and take an existing Angular Application, and using the Angular CLI we will generate a SSR bundle that will allow us to render the application on the server side.We will cover in detail all the latest Angular SSR command line functionality, including running Angular SSR in development mode, pre-rendering both static and dynamic routes.After seeing the command line tools in action, we are going to understand exactly how Angular SSR works under the hood, by reviewing the auto-generated Express engine created by the Angular CLI. This will allow us to understand in detail how universal rendering works, and it will give us a lot of flexibility if needed.Once we have our Angular Express application up and running, we will then make it SEO and social-media friendly.We will then apply a couple of common performance optimizations that are commonly used in Angular Universal applications: we will implement from scratch a fine-grained Application shell, and we will also reduce the number of HTTP requests that the application does at startup time by using the State Transfer API.We will then take our fully optimized Angular SSR application and we will deploy it to productionusing Google App Engine for Node.What Will you Learn In this Course?At the end of this course, you will feel comfortable taking your existing Angular Application and turning it into a server side Angular SSR applicationYou will understand the benefits of server-side rendering, and you will be able to optimize your application for both search engines and social media crawlersYou will also know how to further optimize your application for performance, and you will know how to deploy it to production in two different scenarios: pre-rendered apps and runtime server-side rendered apps