Vue 3, NuxtJS and Golang: A Rapid Guide - Advanced

Set up a go project by installing ghiorso, selecting the right version, and using fibre framework; initialize a go module, create an ambassador project, and fetch packages with go get.

Configure a go backend with docker by creating a dockerfile and docker-compose.yml, map port 3000 to 8000, and enable live code syncing with volumes.

Connect to a database using Gorm in a dockerized MySQL setup, configuring credentials, data volumes, and port mappings, and ensure service order for seamless application startup.

Connect to the database and define a user model, then use gorm auto migrate to create a users table with id, first name, last name, email, password, and ambassador fields.

Learn how to implement live reloading for Go in a Dockerized environment using the air package, automatically rebuilding containers and reloading changes in real time.

Add admin authentication endpoints, including register, login, get authenticated user, logout, and update own information.

Register a user by setting up routes and a register controller, using a fiber context and API prefixes to handle admin and ambassador roles, then test the endpoint with Postman.

Extract data from the request, validate password and password confirm, hash the password, and create a new user with first name, last name, and email in the database.

Implement a login function that posts email and password, retrieves the user, compares the password to the hash, and returns invalid credentials; a JWT token is issued later.

Learn to generate and use JWTs with standard claims, a subject, and expiry, and return the token as an httpOnly cookie while enabling cors with credentials.

Register and log in, then optimize by implementing user-specific password handling with methods on the user model, including set password and compare password, using hashed passwords for secure login.

Extract the authenticated user from the login cookie by parsing the JWT token, validating its claims, and returning the user corresponding to the token subject.

Omit the password, format the output with lowercase first and last names, and use configurable fields in the user struct to tailor the response, including unique email constraints.

Implement a logout function that sends a post request and removes the JWT cookie by overwriting it with an expired value, yielding unauthenticated responses.

Implement and apply middleware to validate user authentication, using cookies and tokens, returning unauthorized when needed, and wiring a shared isAuthenticated function across routes to obtain the user id.

Learn how to update your own profile information via put requests, including first name, last name, email, and password with validation, using the authenticated user flow.

Develop admin endpoints by adding models and endpoints for product credits, user-ID based links, an orders endpoint, and a query to fetch all ambassadors.

Define a get endpoint to fetch ambassadors from the user model, populate 30 ambassador records using faker, and run the command inside the docker container to connect to the database.

Create a product model with id, title, description, image, and price, then implement full CRUD endpoints (get all, get one, create, update, delete) backed by a database using fiber.

Explore embedding a common model in Go, apply it to user and product models, inherit the idea field via embedded structs, and populate products with example data.

Define a link model with a user foreign key and a many-to-many relation to products via a join table, and implement a controller to fetch a user's links.

Create and manage orders and order items in a go-based API using gorm and fiber, with ambassador revenue splits, completion flags, and seeded test data.

Preload order items so each order returns its items as an array. Combine first and last name into a single name field and compute total on the frontend.

Create ambassador authentication endpoints by applying similar functions with slight changes, demonstrating how endpoint logic adapts when the ambassador name switches.

Learn to implement ambassador authentication and route-based access with middleware, wire up register, login, and user update flows, and distinguish ambassador versus admin requests by endpoint path.

Enable scopes in login by attaching a user id with a scope (admin or ambassador), generate a jwt with scope, and enforce route access via middleware to prevent cross-scope access.

Explore defining user type aliases for admin and ambassador in Go, attach a revenue calculation method per type, and control output by omitting empty values.

Explore five ambassador endpoints to retrieve products in two ways: front-end filtering and back-end filtering, then create links and provide rankings for the users.

Redis acts as an in-memory data structure for caching data and as a message broker in a Go app, using Docker Compose and a Redis client on port 6379.

Configure Redis caching for product data by retrieving from the cache or database, then store results with a product frontend key for 30 minutes, using JSON marshal and unmarshal.

Build a backend search that filters products by title or description using a case-insensitive contains check, returning matching products or all products when the search is empty.

Sorts products by price in ascending or descending order, converts sort value to lower case, and applies a function that accepts two indexes and returns a boolean to product slice.

Implement product pagination by calculating page indices, defaulting to page one, and slicing nine items per page. Return data, total, and last page using ceiling logic and handle empty results.

Learn how to manage front-end product updates and cache invalidation with background Go routines, clearing and rebuilding cached data for both front-end and backend while handling context and anonymous functions.

Create an authenticated post to ambassadors links by defining a create link request with product ids, obtaining the user id from middleware, and returning the new link.

Create a secure endpoint to fetch an authenticated ambassador's links, preload orders, and compute total revenue per link, returning a structured stats response with code and order totals.

Sort ambassadors by revenue in descending order by retrieving all users, converting to ambassadors, and building a name-to-revenue map, with authentication required and Redis-based sorting planned for the next tutorial.

Use Redis sorted sets to rank ambassadors by revenue, adding each ambassador with their revenue as the score and retrieving reverse-sorted rankings.

Navigate checkout endpoints in this advanced course, including retrieving the link with the ambassador and products to gather all necessary information. Create the order with all data and confirm it.

Create a public get link endpoint with a get link function, fetch the link by a unique code, preload the user and products, and return a json link.

Create an order by posting to the create order endpoint, validate the link, assemble order and items with customer data, calculate total revenue splits to ambassador and admin, then checkout.

Explore how transactions ensure that creating orders and their items either completes together or rolls back on error or panic, keeping the database consistent.

Use Stripe checkout to process orders by configuring publishable and secret keys, building line items, creating a checkout session, and handling success and cancel URLs to finalize the transaction.

Complete order flow validates a posted order to /order/confirm, loads items, saves the order, and returns success, while Redis-backed background tasks update ambassador revenue, admin revenue, and rankings.

Learn to send emails in a Go application using MailHog for local testing, configure binding addresses, and map localhost between Docker and host to deliver ambassador and admin emails.

Install vue and create a new vue admin project, enable TypeScript, skip lint and formatter, install dependencies, and run the dev server on port 880.

Develop and refine a Vue 3 and NuxtJS template by integrating bootstrap, restructuring assets and views, and creating nav and menu components for a dashboard.

Add login and register routes in a Vue 3 NuxtJS app, using a shared layout and router-view to render the login and register pages.

Implement the register form, map inputs for first name, last name, email, password, and confirm password, and post to /admin/register via axios, then redirect to login on success.

Enter the email and password on the login page, submit to the login endpoint with credentials, and receive a backend cookie to authenticate and navigate to the main page.

Fetch the authenticated user in the layout mounted hook from the endpoint with await, redirect to login on failure, and pass the user to the navigation via props.

Implement a logout flow by calling a logout method, awaiting post-logout actions, and redirecting to the login page when not authenticated; the profile route link will be created later.

Display ambassadors in a dynamic users table by fetching from the ambassadors endpoint, while routing with router-link and composing full names from first and last names.

Learn to build a Vuetify table using UI components, customize buttons with the primary color, and configure links to user details by passing the user id.

Create a links component to display each user's links with code, count, and revenue by fetching data from the backend and summing order totals with reduce.

Create a products view and component, wire it to the router, implement a paginated list showing image, title, description, and price with a delete action and confirmation via axios.

Create a product by building a product form with title, description, image, and price fields, submit to the backend, and navigate back to the products list.

Use a shared product form to edit or create products, prefill data on edit, and submit with put or post requests based on the presence of a product id.

Create and integrate an orders component in a Vue 3, NuxtJS app, fetching orders and displaying headers with totals and items in an expansion panel.

Create a profile page with account information forms for first name, last name, email, password, and confirm password, prefill data from the backend, and submit updates via axios.

Learn how to configure a Vuex store to manage a user: define state, mutations, and actions, and use dispatch and computed properties to sync user data across layout and profile.

Set up a Vue 3 app using the composition API, disable lint, adjust the port from 880 to 4000, and simplify the project by removing assets, components, and views.

Create a reusable album template in a Vue 3 and NuxtJS app, implement a single-column layout with navigation and header, and configure Axios defaults and ambassador login/registration routes.

Explore building a dynamic navigation header in Vue 3 using NuxtJS patterns, Vuex state management, and the composition API to display the authenticated user and toggle login options.

Explore how Vue 3 refs bind and update the header's title and description from store data, delivering personalized messages and login or register links based on user status.

Watch user changes with Vue 3 to update header state and navigation on login and logout, including handling undefined initial user and not authenticated redirects.

Build and route a profile and product view in a Vue 3 NuxtJS app, wiring components to the router and using a computed show header flag to toggle the header.

Create reactive input data for two forms—first name, last name, email, password, and password confirm—prefill from the user via store and computed, and submit via axios post to update info.

Design the rankings view in Vue 3 with NuxtJS, using a TypeScript ranking model (string key, revenue value) to display each ambassador's name, revenue, and a rank in a table.

Show how to build a shared products component in Vue 3 and NuxtJS with a Golang backend, fetch products from an API, and render them with front-end and back-end integration.

Implement product search by building reactive filters, emitting set filters on input, and loading backend data via axios with dynamic query strings from multiple filters.

Filter products on the front end using search value to filter by title and description, without backend requests, by maintaining all products and filtered products and updating on filter changes.

Sort products by price in ascending or descending order using a dropdown, connect search and filters via reactive props, and emit updated values to drive backend sorting.

Learn how to implement front end product sorting by price in Vue 3 and NuxtJS, using ascending and descending logic, a difference-based comparator, and sign handling.

Enable backend lazy loading with a load more button that increments the page, merges new data with existing products via spread operator, and resets to page one during a search.

Implement frontend lazy loading by slicing the filtered products to nine per page and loading more with a button, while supporting search, filter, and last-page handling from the backend.

In this lecture, you implement a front-end pattern to select and unselect products by clicking, highlighting selected items with a border via selected array, a select function, and scoped styles.

Select products and generate a checkout link by posting to the backend, then display the link with the email input, handle login errors, and reset messages after five seconds.

Create and configure a Next.js TypeScript checkout project, enable automatic routing and server-side rendering, set up ports, and integrate bootstrap and axios.

Copy the template from the glass container into the index view, then tailor the checkout form by removing unused fields and updating bootstrap links for the correct version.

Explore routing by rendering named success and error pages, navigate to /success or /error, and extract a checkout code from the url to drive the form.

Master server side rendering by fetching data with axios, configuring a base URL, and using think data with context to pre-render the user for better Google indexing.

Display products by looping the products array with a template to render each product’s title, description, and price. Bind per-product quantity inputs and compute a total as quantities change.

Submit the form by binding first name, last name, email, country, city, zip, and code with v-model, then post a products payload with id and quantity to the back end.

Learn how to integrate Stripe payments by installing the Stripe module, retrieving the publishable key, creating a checkout session, and confirming orders after payment.