Deno For Web Developers

Install deno on your machine using the OS-specific command, verify the version, and learn to upgrade or install a specific version such as 1.75.

Master the Deno command line interface to fetch, run, and cache code from the internet, inspect downloaded locations, use help and info options, and execute a simple project offline.

Discover built-in web browser APIs in Deno for web development, including fetch from a mock API, blob objects for binary data, and form data for sending key-value payloads.

Read text files in deno using runtime APIs such as text file and text line. Explore asynchronous vs synchronous reading and decode data with a text decoder.

Learn three Deno file writing APIs—write text file, write file, and a lower-level write approach—covering path, data, optional options, and how permissions govern read and write.

Export and import modules in deno using named exports, import from local and remote modules, and access standard library functions like generating a uid.

Learn to centralize Deno dependencies by creating a dedicated dependency module that imports a remote library, re-exports its functions, and lets you update versions in one place.

Use import maps to manage dependencies in deno by mapping left-hand side names to right-hand side module urls, configure the import map design, and import modules with explicit versions.

Start a http server in deno using the standard library and an import map on port 5000. Read a file and respond with a string, then test with curl.

Launch a deno web server by importing standard library modules, set up a listener, and route requests to endpoints while parsing method, path, query, and body; test with Postman.

Explore extracting the path name and HTTP method from a request in Deno, handling endings and query strings, and preparing requests for further processing.

Explore how to build and test API requests with query strings in Deno for web developers, including using Postman to send first and second query strings.

Learn to retrieve the request body, format it as json for the api, decode the array into readable json, and resend the request with the correctly structured body.

Design a dynamic routing handler in Deno by mapping paths to handlers, using dynamic keys for path and data, and returning application/json responses with status 200 or not found.

Learn how to replace basic api module code with a real Deno web api using third-party libraries and frameworks in the Deno ecosystem.

Explore Oak, a Deno middleware framework, and learn how a request from web, mobile, or microservices flows through a call context and middleware to produce a response.

Create a server by importing the application class, instantiating it, defining a middleware to handle context and set the response, and listening on port 5000.

Initialize the application class and register middleware with use. Start the server with listen and pass the context to each middleware, including request and response.

Explore how Deno web developers handle request and response with middleware, using next() to control flow and set the final response across a stack of middlewares.

Design and implement basic routing in a Deno web server by defining get and post handlers, wiring middleware, and using next to pass control, with authorization checks for admin routes.

Learn to build dynamic routes that use a path parameter to fetch a specific product from the database, using router context, and test the endpoint with Postman.

Explore router prefixes in deno for web developers, using a fixed property to simplify the last path prefixes for products and users, and verify with Postman.

Explore not found handling in Deno web development by adding a not found middleware that returns a customized response body and status, then test with Postman.

Learn how to extract and validate a request body in deno web development with arato middleware, including checking body presence and testing with postman using json data.

Learn to handle file uploads with form data using the farm data format in deno, including parsing request bodies, saving files to disk, and managing in-memory limits for multi-file uploads.

Learn to extract query strings in Deno with a helper function, import the utility, and use a limit parameter in requests to fetch products from the database.

Implement error handling in a Deno web app using top-level middleware, validate requests, and return appropriate HTTP status codes such as 400, 401, 403, 404, and 500.

Build on the previous lecture by starting a new e-commerce project, using the code finished in the last lecture as a starting point, and prepare for the next section.

Refactor the code by creating a routes folder, moving products and author into modules, exporting and renaming constants, and updating imports to create a cleaner, admin-friendly structure.

Learn to manage dependencies in Deno by organizing imports and exports across internal modules, external libraries, and standard libraries for scalable server development.

Model a PostgreSQL database design for a web app, detailing one-to-many and many-to-many relationships among users, hot items, products, addresses, orders, and order items.

Log in as a super user, create an e-commerce database, enable the required extension, define seven tables with foreign keys, and implement update-timestamp triggers for automatic timestamps.

Learn to connect to a database in Deno using a third-party library, use client or pool patterns, and run queries via query object or query function, with testing via Postman.

Explore two files on query statements and types in Deno for web developers, using template strings to prevent injection and mapping TypeScript types to PostgreSQL columns across joined tables.

Learn to manage secrets and config with environment variables, reading them from a file via a library, and replace hard-coded values with a configurable port and credentials.

Install the deno library and set up a startup script to run the deno web server, then verify the response object and content type.

After sign-in, issue an access token with seven days expiry and a five-minute refresh token in cookies. Renew via the refresh token to maintain access and invalidate old sessions.

Set up the sign up route with router and middleware, validate the json body for username, email, and password, then hash the password before storing.

Hash the password and verify the email exists in the database by querying for a lowercase formatted email, then insert the user with a hashed password using a third-party library.

Implement the first half of the authentication process by clearing the sessions table, issuing a seven-day refresh token in cookies, and returning an access token in the response body.

learn how to implement sign in by adapting sign up logic, validating email and password, hashing passwords, handling invalid credentials, issuing refresh and access tokens, and managing cookies with middleware.

Build a server middleware to verify refresh tokens with a jwt library, read the token from cookies, attach the session id to the request, and protect routes.

Implement authentication middleware to protect routes by validating refresh tokens, checking sessions, and attaching the user to the request for authorized access.

Add authorization to the existing authentication by reading and verifying the access token from the authorization header, then ensure the user id matches before proceeding.

Learn how to implement sign out by verifying authentication and authorization. Delete the session from the database and clear the refresh token from cookies using a middleware flow.

Implement a reset password flow by creating routes for requesting and confirming resets, generating a reset token with expiration time, updating user in the database, and sending a confirmation email.

Learn to send emails with the SendGrid API in a Deno web app by configuring API keys, posting with authorization and content type, and building a reusable send email function.

Test the reset password flow by sending a reset request to a real email inbox. Retrieve the email, click the token link, and note the 30-minute expiry window.

Validate the reset request, ensure the new password is at least six characters and different from the old one, hash the new password, verify token expiry, and update the user.

Learn to confirm reset password flows by using Postman, create a new user with a real email, manage reset tokens and expiry, and sign in to validate the process.

Improve sign in by validating reset password tokens before authentication. Return a 400 with 'please reset your password' and guide users to confirm their new password.

Learn how to renew access with a new exit token, invalidate old tokens, set cookies, and orchestrate sign-out and sign-in flows to access protected resources.

Add a product in Deno by implementing authentication and authorization, managing permissions, and uploading product data and images to a database via form data in an admin area.

Validate add product data by checking image presence and exactly five key-value pairs with valid keys and nonempty values, then upload the image to cloud storage and insert the product.

Learn to upload images to a cloud service by configuring api key, timestamp, and signature, then prepare and send a form-data request with the image and transformation settings.

Insert a new product into the products table by building an object with title, description, category, inventory, and image, then test the API with a request in Postman.

Update a product in a Deno web app by validating input, checking existing records, comparing data by property for changes, including optional image updates, and updating the database.

Delete an image from Cloudinary and update the corresponding item in the database, including replacing the image and testing the request.

Implement a delete product workflow in a Deno web app, including admin authorization, existence check, database removal, and cloud image deletion on Cloud Inari, with testing via Postman.

Build a list products endpoint in a Deno web app by separating middleware, exporting the products controller, and importing the products query; test the public route with Postman.

Implement pagination for product queries by calculating limit and skip, determining total queries, and exposing has more with query parameters, using a get products function.

Implement a get product by id endpoint in a Deno web app using middleware and try-catch error handling, returning product data in the response body. Test with Postman.

Develop a private fetch cart endpoint in Deno using get, enforce authentication and authorization, join addresses and items data, and return a structured response.

Implement an add-to-cart middleware that validates the request body as json, checks inventory, loads the product by id, updates or creates the user's cart, and returns the new cart item.

Implement add to cart with inventory checks, update or create hot item entries across joined tables, and manage item quantities and not enough inventory scenarios.

Update cart items by validating the request body, adjusting the hot item quantity, deleting items when the final quantity reaches zero, and returning the updated hot item details.

delete the hot item from the cart by identifying its id, validating its presence, and removing it with a dedicated function to update the cart.

Fix fetch cart issue by ensuring the shipping address updates to now and the cart items array is empty when no items exist, using PostgreSQL logic.

Learn to build a deno web endpoint that lists a user's shipping addresses by validating the user, authorizing access, querying the database, and returning the address list.

Add shipping address by implementing an address handler that validates the request body, calls a shipping address query with user and address fields, and returns the created address.

Create a get address endpoint to fetch a specific shipping address by id from a user's addresses stored in the database, and test it with postman.

Update a shipping address by validating input, verifying address ownership, and updating the database with the new address data through a Deno-based shipping address query.

Delete a shipping address by validating ownership, deleting the address from the database, and returning a confirmation response in a deno-based web API.

Develop a Deno checkout flow by routing the select shipping address step, authenticating and authorizing users, validating json request bodies, and persisting the address to the cart.

Test selecting a shipping address by ID, sending a request to set the address in the card, and verify the card reflects the shipping address details and cost.

Outline the end-to-end checkout flow, from front-end shipping address selection to back-end checkout creation, Stripe payment intent with client secret, and front-end payment confirmation.

Implement the Deno checkout flow, parse and validate json request bodies, compute the total from cart items, ensure shipping address, and create or fetch a Stripe customer.

Validate the request against the stored stripe customer id, then clear the stripe customer using the secret key and API, and update the user record with the result.

Learn to create a Stripe payment intent, build the request body with amount and currency, confirm the payment via the Stripe SDK, and handle results for checkout.

Update the payment intent by setting the amount, updating it during checkout, and verifying changes via postman and the stripe dashboard.

Build a stripe-based confirm payment flow in Deno, validating card details, clearing and confirming a payment method, and finalizing a payment with a payment intent.

Clear a new order after checkout by authenticating and authorizing the user, then update inventory, convert cart items to order items, insert the order and items, and clear the cart.

Test creating and clearing an order by duplicating the confirm payment, retrieving payment intent and status, updating inventory, and sending the finalized order via Postman.

Learn to list a user's orders and retrieve a specific order by id in Deno for web developers, using get orders and get order to return order details.

Learn to list a customer's payment methods from Stripe, fetch the Stripe customer, and expose the default card in the checkout flow using the Stripe API.

Implement a default card feature by creating a set default card rule, validating request bodies, updating the Stripe customer with the provided payment method id, and testing via Postman.

Learn how to implement a remove card feature in a Deno web app by wiring a route to remove a payment method via Stripe, including request handling and testing.

Develop and expose admin endpoints to list all orders and fetch a single order by id, joining orders with details via the order detail type and validating admin access.

Learn to implement an admin update order endpoint in Deno, validate the request body, ensure shipment status validity, update the order in the database, and test with Postman.

Explore implementing user pagination in deno for web developers by exporting a get users function, applying limit and skip, counting total users, and integrating with the admin flow.

Implement a get user function in the admin router to fetch a user by ID, handle request and params, and test the endpoint with Postman.

Learn to securely update a user's role in a Deno web app by validating admin permissions, guarding against self-update, parsing request bodies, and updating the database.

Delete user functionality validates the user by id, deletes the user from the database, and returns a confirmation with the username, tested with a super admin token in Postman.

Polish the api by moving the error handling middleware to a separate file and wiring it into the middle tier, returning a user object with a message and access token.

Explore frontend architecture of a three-app setup (public, client, admin) controlled by authentication and role-based rendering. See how shared assets and page-specific components coordinate with APIs to power the app.

solve a cors issue in deno for web developers by adding a third-party library on the backend to enable cross-origin requests for product and admin data.

Implement authentication in a Deno web app by wiring the authenticate middleware to attach the user object to requests, manage refresh tokens from cookies, and handle unauthenticated responses.

Trace the sign in flow in Deno for web developers, including sign up, reset password, post requests, and managing access tokens and expiration in the store.

Automatically renew tokens by validating exit tokens and checking remaining time against a 30-second threshold. Issue new access and refresh tokens to maintain seamless access to private routes.

Navigate the checkout process by selecting or adding a shipping address from the addresses list or address form, then complete payment with Stripe and clear the order after success.

Explore the admin area to manage Menez products with the product form and custom hooks. Submit form data with authorization, and add, update, or delete items in the admin interface.

Navigate the admin area to view and open orders, edit order details, and update shipment status with the update order mutation.

Build a full stack web app with Deno, GraphQL, Next.js, and PostgreSQL. Implement a JWT authentication system with sign up, sign in, password reset, and token renewal.

Learn to build a web server using Deno and Oak, enable automatic restarts with Denon, and manage environment values with dotenv in a TypeScript project.

Set up a graphql server for deno web development using oak_graphql, define user types, queries and signup mutations, and expose a /graphql route with a runnable playground.

Set up PostgreSQL with pgAdmin, create a new user and a simple_shop database, then define a users table with a uuid id, auth fields, and roles using the uuid-ossp extension.

Connect your Deno web app to a postgres database by importing the postgres client from deno.land/x, creating a db client, and querying the users table from server.ts.

Read environment-specific settings from a .env file using dotenv to configure db name, user, password, host, and port in deno apps.

Refactor the codebase by moving typeDefs to schema/typedefs.ts and resolvers to schema/resolvers/index.ts, then split queries and mutations into separate files and import them into server.ts.

Create the signup mutation using TypeScript types, GraphQL type definitions, and resolvers, validating username, email, and password while mapping PostgreSQL user fields and role enums.

Connect to the database, check if email exists with queryByEmailString, hash the password with bcrypt, insert the new user via insertUserString, and prepare the returned user for GraphQL.

Test the signup mutation using GraphQL playground and pgAdmin, validate username, email, and password, create users with hashed passwords, default token_version and roles, and enforce unique emails.

Create a JWT token during signup with the djwt v0.9.0 library, building a token with user ID and token version payload, 15-day expiration, and returning it to the frontend.

Learn to send a JWT token to the frontend by setting a HTTP only cookie with Oak cookies in a Deno web app, wiring the token through GraphQL context.

Implement a signin mutation mirroring signup: adjust typeDefs and signin args, omit username, lowercase email, validate password with bcrypt, return user and JWT token via cookies, tested in GraphQL Playground.

Read jwt token from cookies with oak middleware to authenticate GraphQL requests, then add a user query and decode the token to obtain user id and token version.

Decode and verify JWTs in a Deno web app by implementing verifyToken with validateJwt, handling the token secret, and passing decoded payload info through middleware to GraphQL resolvers for authentication.

Demonstrate passing payload info and expiration times to the next middleware by extending the Oak request with userId, tokenVersion, and exp for authentication in the resolver.

create an isAuthenticated function in authUtils.ts to verify request.userId, fetch the user by id from the database, validate tokenVersion, and return a UserResponse payload for GraphQL queries.

Refactor the token-checking middleware into its own file, implement a checkToken middleware that reads cookies, verifies the token, and attaches payload info to the request for GraphQL authentication.

implement a signout mutation in a GraphQL API using deno, updating the token_version, deleting the jwt cookie, and returning a responsemessage to signal logout.

Test the signout mutation in GraphQL Playground; signout deletes the JWT token and updates token_version from 0 to 1. Reusing the old token fails without authentication.

Deno for web developers implements two mutations: requestToResetPassword and resetPassword, emailing a reset link with a 30-minute time-limited token and updating the user with token and expiry.

describe sending a password reset email in Deno using Sendgrid by posting to the API endpoint with an API key, composing an html message with a reset token.

Test the request to reset password mutation by creating a user, generating and saving reset token and expiry, sending a real email, and validating token presence and non-existent email handling.

Fix bugs by normalizing email input with trim and lower case, ensure database connections are closed with client.end across reset password, signout, and auth utilities, and prepare reset password mutation.

Implement a reset password mutation that validates token and password, hashes the new password, updates the user, clears the token and expiry, and returns a success message.

Validate the two-step reset password flow by sending a reset request and then performing the token-based password update, using GraphQL Playground and email verification.

Implement a protected update roles mutation for super admins, with id and roles parameters, using TypeScript types, auth checks, and database updates returning a limited user object.

Test update roles mutation in Graphql playground, verify authorization requires super admin, update user roles via pgAdmin, demonstrate switching users between client, admin, and super admin.

Improve the update roles mutation by adding a guard that prevents a super admin from updating their own role, throwing an error to avoid authorization issues.

Implement deleteUser mutation and resolver (deleteUserById), enforce authentication and super admin authorization, and test via GraphQL Playground.

Add authentication and authorization checks to the users query using isAuthenticated and role checks for admin and super admin, then filter and return a five-property user list.

Implement automatic jwt token extension in middleware for a deno graphql app, invalidating old tokens, issuing new ones, and refreshing cookies when token age exceeds six hours.

Test the automatic extension of token expiration via the check token middleware, observe token versions advancing and new tokens generated and stored in cookies after login.

Centralize library imports in a single deps.ts within a deps folder to simplify version updates for oak, oak_graphql, bcrypt, djwt, dotenv, and uuid across index.ts, mutations.ts, and queries.ts.

Review the starter application, install dependencies with npm install, run npm run dev, and focus on adding sign up, sign in, forgot password, and permission management (edit roles, delete users).

Review starter files for a Next js React app using Graphql with Apollo Client, TypeScript, and Styled Components. Explore project structure, dependencies, and files like pages, _app.tsx, _document.tsx, and layout.

Create and use a context API with React hooks to manage authentication state via an AuthContextProvider, wiring sign in, sign up modals, and a shared value across components.

Connect the frontend to the GraphQL server using Apollo Client and wrap the app with ApolloProvider. Configure cors on both frontend and server, using env-driven server URI and fetch.

Demonstrates authenticating users on app startup by querying user data with a GraphQL user query, handling authenticated and unauthenticated states, and wiring a frontend useQuery in an auth context.

Sign in with GraphQL Playground to set the token in cookies, then share the user data via context API using useState and useEffect.

Using the context API, the lecture conditionally shows dashboard and admin links in the navbar based on the logged-in user, with sign in, sign out, or sign up options.

protect routes on the client side by using the context API's loggedInUser to guard the dashboard and admin pages, redirecting unauthenticated users with router.push to the home page.

Learn to implement sign up by using React Hook Form to collect username, email, and password, validate inputs with defined rules, and submit data with Apollo Client.

Learn to implement a sign up flow with Apollo Client using useMutation and gql, define signup arguments with TypeScript, update auth context with setAuthUser, and redirect to the dashboard.

Demonstrate sign up flow in Deno for web developers, testing server startup, token cookies, and GraphQL errors, while adding users and personalizing the dashboard.

Implement sign in by reusing the sign up component in signin.tsx, copying email and password fields, wiring the signin mutation with useMutation and react hook form, routing to admin page.

Test sign in with multiple users, verify token cookies, handle invalid credentials, confirm admin access for the super admin, client restrictions, and outline implementing sign out.

Implement sign out functionality using an Apollo GraphQL mutation, wire it into the navbar with useMutation, update the context and router, and verify token changes and UI updates.

Implement cross-tab signout by storing a signout key in local storage and listening for storage events in React, syncing loggedInUser to null across tabs and redirecting to home.

Implement the first reset password mutation for Deno web developers by wiring a frontend form to the request to reset password GraphQL mutation, handling email input, loading, and user messages.

Test the reset password workflow by signing up with a real email, requesting a reset, and checking the email link to complete the first part.

Learn to implement a reset password flow: open a reset modal from a token in the url, submit a new password via a GraphQL mutation, and redirect on success.

Improve the sign in mutation by blocking login when a user has an active reset password token, forcing reset completion and preventing reuse of the old password.

Query users from the real database on the admin page using Apollo useQuery and QUERY_USERS, handle loading and errors, and render user rows with roles.

Fetch user information on the server with Next.js getServerSideProps, demonstrating SSR data loading, props propagation, and immediate rendering of server-fetched data on the admin page.

Learn to fetch server-side data using fetch api in getServerSideProps to post a GraphQL query with a USER_INFO body, handling token from cookies.

Fetch server side data in deno for web developers by extracting a bearer token from cookies or headers and protecting admin routes with getServerSideProps.

Learn to redirect users on the server side using getServerSideProps, check tokens, enforce authentication and admin access, and pass user data to the client to update auth state.

Develop and test update roles mutation on the admin page by conditionally rendering columns based on super admin status, using isSuperAdmin and admin props across Admin, Admin.tsx, and AdminRow.tsx.

Toggle editor and admin icons for the super admin to change roles, while the client and super admin columns remain fixed. Enable per-user editing and apply changes with updateRoles mutation.

Implement the updateRoles mutation to submit locally edited roles for a user, wiring Apollo useMutation in the frontend, typing with RoleOptions, and refreshing the user list.

Fix the updateRoles mutation, implement error alerts from GraphQL errors with useEffect, and optimize using React memo. Enforce change detection to prevent unnecessary submissions and manage client, itemEditor, admin roles.

Add delete user functionality via a GraphQL mutation triggered by a trash icon, confirm with the user, and refresh the user list with useMutation and refetchQueries.

Configure Apollo Client in-memory cache with typePolicies to merge incoming data for user roles and the users query, avoiding stale data and warnings after updates or deletions.

Learn to implement social media login with Facebook and Google in a web app using react facebook login and react google login. Configure app IDs, client IDs, and env variables.

Add Facebook and Google login buttons on the signup page with the callback function and the cssClass prop, then restart the server after updating the .env.

Design and implement a social media log in mutation in a backend using GraphQL, including schema and typeDefs.ts, a provider enum, and a resolver with token validation and cookies.

Implement a useSocialMediaLogin custom hook to call the socialMediaLogin mutation with five arguments: username, email, id, expiration, and provider. Manage loading and error states, then redirect to the dashboard.

Test social media logins using Facebook and Google, verify user creation in pgAdmin with facebook_id and google_id, and confirm sign in modal buttons.

Enable email sign in for Facebook and Google users by forcing a password reset when accounts use social providers, updated in the backend signin mutation.

Enable email-registered users to sign in with social media by extending the socialMediaLogin mutation to query by email, generate a token, and return the user.