Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/angular-university/angular-ssr-course
Angular SSR In Depth (formerly Angular Universal) - Use Angular on the server too! Learn Angular Server-Side Rendering
https://github.com/angular-university/angular-ssr-course
angular angular-ssr angularuniversal
Last synced: 5 days ago
JSON representation
Angular SSR In Depth (formerly Angular Universal) - Use Angular on the server too! Learn Angular Server-Side Rendering
- Host: GitHub
- URL: https://github.com/angular-university/angular-ssr-course
- Owner: angular-university
- Created: 2018-02-01T13:47:48.000Z (almost 7 years ago)
- Default Branch: main
- Last Pushed: 2024-05-29T15:02:12.000Z (6 months ago)
- Last Synced: 2024-05-30T04:37:58.336Z (6 months ago)
- Topics: angular, angular-ssr, angularuniversal
- Language: TypeScript
- Homepage: https://angular-university.io/course/angular-universal-course
- Size: 2.08 MB
- Stars: 157
- Watchers: 13
- Forks: 121
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Angular Universal In Depth Course
This repository contains the code of the course [Angular SSR In Depth (formerly Angular Universal)](https://angular-university.io/course/angular-universal-course).
This course repository is updated to Angular v18.
![Angular SSR In Depth (formerly Angular Universal)](https://angular-university.s3-us-west-1.amazonaws.com/course-images/angular-universal-course.jpg)
# Installation pre-requisites
Please use Node 18 long-term support (LTS) version.
# Installing the Angular CLI
With the following command the angular-cli will be installed globally in your machine:
npm install -g @angular/cli
# How To install this repository
We can install the master branch using the following commands:
git clone https://github.com/angular-university/angular-ssr-course.git
This repository is made of several separate npm modules, that are installable separately. For example, to run the au-input module, we can do the following:
cd angular-ssr-course
npm installIts also possible to install the modules as usual using npm:
npm install
NPM 5 or above has the big advantage that if you use it you will be installing the exact same dependencies than I installed in my machine, so you wont run into issues caused by semantic versioning updates.
This should take a couple of minutes. If there are issues, please post the complete error message in the Questions section of the course.
# To run the Development UI Server
To run the frontend part of our code, we will use the Angular CLI:
npm start
The application is available at port 4200: [http://localhost:4200](http://localhost:4200)
# To run the Angular Universal Live Development Server
To run the application in development mode but still have it server side rendered:
npm run dev:ssr
The live universal application is available at port 4200: [http://localhost:4200](http://localhost:4200)
# Important
This repository has multiple branches, have a look at the beginning of each section to see the name of the branch.
At certain points along the course, you will be asked to checkout other remote branches other than master. You can view all branches that you have available remotely using the following command:
git branch -a
The remote branches have their starting in origin, such as for example 1-navigation-and-containers.
We can checkout the remote branch and start tracking it with a local branch that has the same name, by using the following command:
git checkout -b section-1 origin/1-navigation-and-containers
It's also possible to download a ZIP file for a given branch, using the branch dropdown on this page on the top left, and then selecting the Clone or Download / Download as ZIP button.
# Other Courses
# Modern Angular With SignalsIf you are looking for the [Modern Angular With Signals Course](https://angular-university.io/course/angular-signals-course), the repo with the full code can be found here:
![Modern Angular With Signals Course](https://d3vigmphadbn9b.cloudfront.net/course-images/large-images/angular-signals-course.jpg)
# NgRx (with NgRx Data) - The Complete Guide
If you are looking for the [Ngrx (with NgRx Data) - The Complete Guide](https://angular-university.io/course/ngrx-course), the repo with the full code can be found here:
![Ngrx (with NgRx Data) - The Complete Guide](https://angular-university.s3-us-west-1.amazonaws.com/course-images/ngrx-v2.png)
# Angular Core Deep Dive Course
If you are looking for the [Angular Core Deep Dive Course](https://angular-university.io/course/angular-course), the repo with the full code can be found here:
![Angular Core Deep Dive](https://s3-us-west-1.amazonaws.com/angular-university/course-images/angular-core-in-depth-small.png)
# RxJs In Practice
If you are looking for the [RxJs In Practice](https://angular-university.io/course/rxjs-course), the repo with the full code can be found here:
![RxJs In Practice Course](https://s3-us-west-1.amazonaws.com/angular-university/course-images/rxjs-in-practice-course.png)
# NestJs In Practice (with MongoDB)
If you are looking for the [NestJs In Practice Course](https://angular-university.io/course/nestjs-course), the repo with the full code can be found here:
![NestJs In Practice Course](https://angular-university.s3-us-west-1.amazonaws.com/course-images/nestjs-v2.png)
# Angular Testing Course
If you are looking for the [Angular Testing Course](https://angular-university.io/course/angular-testing-course), the repo with the full code can be found here:
![Angular Testing Course](https://s3-us-west-1.amazonaws.com/angular-university/course-images/angular-testing-small.png)
# Serverless Angular with Firebase Course
If you are looking for the [Serverless Angular with Firebase Course](https://angular-university.io/course/firebase-course), the repo with the full code can be found here:
![Serverless Angular with Firebase Course](https://s3-us-west-1.amazonaws.com/angular-university/course-images/serverless-angular-small.png)
# Angular PWA Course
If you are looking for the [Angular PWA Course](https://angular-university.io/course/angular-pwa-course), the repo with the full code can be found here:
![Angular PWA Course - Build the future of the Web Today](https://s3-us-west-1.amazonaws.com/angular-university/course-images/angular-pwa-course.png)
# Angular Security Masterclass
If you are looking for the [Angular Security Masterclass](https://angular-university.io/course/angular-security-course), the repo with the full code can be found here:
[Angular Security Masterclass](https://github.com/angular-university/angular-security-course).
![Angular Security Masterclass](https://s3-us-west-1.amazonaws.com/angular-university/course-images/security-cover-small-v2.png)
# Angular Advanced Library Laboratory Course
If you are looking for the Angular Advanced Course, the repo with the full code can be found here:
[Angular Advanced Library Laboratory Course: Build Your Own Library](https://angular-university.io/course/angular-advanced-course).
![Angular Advanced Library Laboratory Course: Build Your Own Library](https://angular-academy.s3.amazonaws.com/thumbnails/advanced_angular-small-v3.png)
## RxJs and Reactive Patterns Angular Architecture Course
If you are looking for the RxJs and Reactive Patterns Angular Architecture Course code, the repo with the full code can be found here:
[RxJs and Reactive Patterns Angular Architecture Course](https://angular-university.io/course/reactive-angular-architecture-course)
![RxJs and Reactive Patterns Angular Architecture Course](https://s3-us-west-1.amazonaws.com/angular-academy/blog/images/rxjs-reactive-patterns-small.png)
## Complete Typescript Course - Build A REST API
If you are looking for the Complete Typescript 2 Course - Build a REST API, the repo with the full code can be found here:
[https://angular-university.io/course/typescript-2-tutorial](https://github.com/angular-university/complete-typescript-course)
[Github repo for this course](https://github.com/angular-university/complete-typescript-course)
![Complete Typescript Course](https://angular-academy.s3.amazonaws.com/thumbnails/typescript-2-small.png)