Angular and NestJS: A Rapid Guide - Advanced

Set up a NestJS project by installing Nest CLI, create a project named Nest Ambassador, initialize, and run npm run start:dev to view the app in the browser at localhost:3000.

Connect to the database with docker by pulling the my school image version 5.7.22 and creating a db service, set credentials, volumes, and the 3306 port.

Install TypeORM, connect to the database, and scaffold the user entity, controller, and service to create the users table with a unique email and default ambassador.

Develop six admin authentication endpoints, including register, login, get authenticated user, log out, and endpoints to update personal information and change password.

implement and validate a user registration endpoint in nestjs, using a dto, controller, and service, and enforce required fields with class-validator and a global validation pipe.

Inject the user repository, implement a save function in the user service, validate password confirmation, hash the password with bcrypt, and save the user data (isAmbassador false).

Implement a login flow with post /admin/login, validate user by email, verify password, generate a JWT, store it in an http-only cookie, and enable credentials for cross-origin requests.

Retrieve the authenticated user by extracting the JWT cookie, verify it with the JWT service, and return the user data while excluding the password via a serializer interceptor.

Learn how to implement a logout function in Angular and NestJS, remove the JWT cookie, return success, and guard the logout endpoint with an OAuth guard to require authentication.

Update your profile information through an authenticated put request to admin/user/info, editing first name, last name, and email. Learn to change passwords with validation and hashing.

Develop admin endpoints to create, update, delete products, fetch user links by user id, retrieve orders, and manage ambassadors as a distinct user group.

Seed ambassadors with a standalone command using the faker library, then expose a get endpoint at admin/ambassadors that returns ambassadors via the user service find function, filtered by ambassador true.

Explore building product management with NestJS: create a product entity, controller, and service, implement crud endpoints (get all, get by id, create, update, delete), and seed sample data.

Create orders and order items as entities in Angular and NestJS, define a one-to-many relation, and implement fields such as ambassador data, address details, and a 90/10 revenue split.

Expose order items with orders by configuring relations, concatenate first and last names into a single name, and compute a total with reduce to show admin revenue.

Define a link entity with a code, relate it to users and products via a join table, then implement service and controller to fetch ambassador links by user id.

In a one-to-many setup, connect links to orders without a database foreign key by using a join column based on the code, enabling retrieval of orders from a link.

Implement a shared module to reuse the JWT model across admin endpoints and other controllers, enforcing authentication with guards and resolving provider conflicts.

Design ambassador authentication endpoints, mirroring the admin endpoints but with the name changed to ambassador and with some functionality changes to be observed when combining the endpoints.

Add an ambassador path to distinguish admin and ambassador endpoints, using a path-based request check to register and login two user types with separate endpoints and scopes.

explain how scopes in jwt login control access to admin and ambassador endpoints, using guards, cookies, and authorization checks to prevent unauthorized access.

Implement ambassador revenue calculation in an Angular and NestJS app by aggregating completed orders, extending user and order relations, and exposing revenue for both ambassador and admin views.

Explore ambassador endpoints by implementing two product retrieval methods: front-end filtered and API-filtered; create links, then compute revenue per link and rank ambassadors by total revenue.

Add a Redis service to the docker compose setup, expose port 6379, and configure the cache manager with a Redis store using the service host instead of localhost.

Cache ambassador products for front-end and back-end endpoints with cache decorators and a cache interceptor, using a 30-minute TTL and a cache manager for fast access.

Learn to use event emitters to invalidate caches when products are created, updated, or deleted, ensuring immediate frontend reflection by clearing cache keys via a cache manager in NestJS.

Implement a case-insensitive product search by filtering the product list using the request query, matching both the title and description to return a filtered product array.

Sort products by price in ascending or descending order by checking if the request query sought equals ascending. Use a sign from the price difference to drive the sort.

Implement product pagination by slicing the list with page and per page, defaulting to page one and nine items, and returning total and last page.

Learn how to create ambassador links in a NestJS and Angular context by posting an authenticated request that generates a unique code and associates products with a user.

Authenticate the user, fetch their ambassador links, and compute completed orders and total ambassador revenue using a reduce function.

Define and fetch ambassador rankings by revenue, join user and order data, calculate totals, map to ambassador names, and discuss sorting and performance considerations including future use of Redis.

Implement Redis sorted sets to rank ambassadors by revenue, using zadd and rev range by score to retrieve rankings in descending order via an API endpoint.

Refactor the response format to return a name as key and revenue as value, using reduce to accumulate results, handle non-numeric checks, and sort by revenue.

Create three checkout endpoints: fetch data with a code link to create an order, finish the order via the second endpoint, and update the database after Stripe confirms.

Fetch the link data by calling the check out endpoint with a code parameter via a get request, and include the user and products while removing the password.

Create an order via the checkout orders endpoint, validate the link, and build the order with user details, product IDs, quantities, and ambassador revenue (0.1 x price x quantity).

Wrap multiple queries in a transaction to ensure all order items insert only when every query succeeds; roll back on error and commit when complete.

implement stripe checkout in the backend by installing the stripe library, configuring keys, constructing line items, and creating a checkout session with success and cancel URLs.

Set up configuration with an environment file and a global config service to manage constants, including the checkout URL and Stripe key, and inject this config into the order controller.

Confirm orders with a post request, fetch the order by transaction, and mark it as completed. Emit an order completed event to notify ambassadors and admins and increment rankings.

Install angular by downloading the installer and global npm install, then create the project with routing. Open in your IDE and run on port 4200 to view the app.

Learn to build a bootstrap-based template in Angular and NestJS, converting an email layout into reusable components, creating modules and services with schematics, and streamlining by skipping tests.

Learn to structure routes in Angular with public and secure modules, generate login and register components, and render routes via a router outlet, with login required to access secure areas.

Create an Angular register page using reactive forms, with first name, last name, email, password, and password confirm, then post to the API via HTTP and redirect to login.

Build the login flow in an angular and nestjs app by creating a login form with email and password, calling the login api, and handling a jwt httpOnly cookie.

Create a service to handle authentication, registration, and login, move the EDP client into the service, and wrap authentication, registration, and getting that authenticated user.

Learn how to fetch the authenticated user in an Angular and NestJS app by calling the user endpoint with credentials, handling cookies, and displaying the user’s first and last name.

Implement logout functionality by sending a logout request with credentials, clearing cookies, and redirecting to the login page. Protect routes with a secure component and redirect unauthenticated users to login.

Learn how to use interceptors to attach credentials to every request in Angular and NestJS, by cloning requests and applying a credentials interceptor across providers.

Build and wire a profile page in an Angular and NestJS app, creating profile and users components, reactive forms for updating account info and password, and backend updates via HTTP.

Learn how to implement event emitters in a TypeScript app to share user data across components, reduce server calls, and update the UI on authentication and profile changes.

Configure routing to redirect the main page to the users list, highlight the active link, and fetch users from environment API/users to display in a table.

Install and configure angular material, select a style, and implement a mat-table with a data source and columns for name, email, and actions, applying 100% width.

Learn to implement Angular Material table pagination using mat paginator, view child, and data source configuration, initializing after view init to paginate and control items per page.

Explore building a user links page with router links, a dynamic table, and the Angular Material button, fetching links by user id and calculating revenue from orders.

Create and integrate a product component in an Angular and NestJS project, configure data sources, define the product interface, and display products with image, title, description, price, and actions.

Create and submit new products by building a product form with title, description, image, and price, posting to the product service, and navigating to the products list.

Use a shared product form to create or update products, distinguishing modes via route data on products/edit, fetch the product by idea, and redirect to the products list.

Trigger a delete request after user confirmation to remove a product. Update the data source to exclude the deleted product and reflect the change.

Build an orders feature by generating the order service and interfaces, fetch orders, and display them in an expansion panel with a table listing product title, price, quantity, and total.

Set up and configure an angular project, adjust port to 4300 to avoid admin conflict, integrate the template and bootstrap, and run the app to verify on localhost:4300.

Import and configure common files from the Angular admin project, including interfaces, public model, interceptors, services, and the environment API, to build the ambassador app login and registration flow.

Create a secure module and profile component, centralize common models in a shared model, and configure routes and outlets to ensure authenticated access to the profile.

Build and secure stats and rankings features in Angular and NestJS by creating stats and rankings components, services, and routes, fetching revenue and link data, and handling key-value formats.

Add router links for front end and back end products components and apply routerLinkActiveOptions with exact: true to ensure the active link is underlined; verify navigation updates the URL.

Fetch backend products from the endpoint that returns a data property containing the product array in an observable, render each product with its image, title, and price, showing nine items.

Trigger lazy loading by clicking the load more button to fetch additional products from the backend using a page query parameter, defaulting to page one and concatenating results.

Learn to use http params to control pagination in Angular and NestJS. Implement last page handling, conditional button display, and refresh behavior that returns to the first page.

Develops a product search by wiring a change listener to pass the query to the backend, update the route, and filter items while merging search and pagination.

Sort products by price in ascending or descending order using a change event that passes the selected value to a sort function.

Learn to implement product selection with a clickable card, border highlight, and a selected class. Use a select(id) function, a selected array, and an isSelected helper to toggle items.

Select products to reveal the generate links button and create a checkout link. Use the links service and environment api; if not logged in, show an error and block generation.

Develop the frontend products view by consuming the environment api/products endpoint with the Angular product service, subscribing to the observable to display all products and prep search and sort filters.

Learn to create and combine pipes in Angular to paginate with a budget pipe, filter by search, and sort results, ensuring correct order and pure settings.

Set up an Angular checkout project, run on port 5000, apply a bootstrap template, and tailor the form to require first name, last name, email, address, country, state, and zip.

Create a data-driven flow in Angular and NestJS by building a form with success and error components, and a link service that calls the environment API to fetch ambassador data.

Learn why angular universal is needed to render the app on the server, producing pre-rendered HTML for better search engine optimization and easier indexing by Google.

Declare user as any, fetch and display products with title, description, and price, and add a quantity input to update the total as quantities change in the UI.

Calculate a dynamic order total in Angular and NestJS by initializing a quantities array, using reduce to sum product price times quantity, and updating the total as inputs change.

Submit a reactive form by creating a form group, collecting user details and products, posting to the orders endpoint via an order service, and mapping nonzero-quantity items for checkout.

Configure stripe with a publishable key and stripe.js, then redirect to checkout using a session ID. Test orders, handle errors, and confirm order by sending source to backend order service.