- Видео 52
- Просмотров 678 310
Genka
Германия
Добавлен 31 дек 2011
random programming stuff
Fullstack OAuth2 - Angular, Spring Boot & Keycloak
In this tutorial we build a complete OAuth2 secured webplatform using angular, spring boot with spring security and keycloak as the oauth server.
Done with angular 17 and spring boot 3 / spring security 6.
Github: github.com/tamani-coding/fullstack-oauth2-angular-spring-boot-keycloak
(00:00) - Intro
(00:58) - Keycloak via Docker
(03:03) - Keycloak Realm Configuration
(05:02) - Setup Angular & OAuth2 Login
(10:09) - JSON Web Token explained
(11:22) - Logout
(12:23) - Spring Boot, Spring Security, OAuth2 Setup
(20:23) - Use Acces Token to Call API
(22:40) - Authorize API with User Roles
(26:23) - Outro
Done with angular 17 and spring boot 3 / spring security 6.
Github: github.com/tamani-coding/fullstack-oauth2-angular-spring-boot-keycloak
(00:00) - Intro
(00:58) - Keycloak via Docker
(03:03) - Keycloak Realm Configuration
(05:02) - Setup Angular & OAuth2 Login
(10:09) - JSON Web Token explained
(11:22) - Logout
(12:23) - Spring Boot, Spring Security, OAuth2 Setup
(20:23) - Use Acces Token to Call API
(22:40) - Authorize API with User Roles
(26:23) - Outro
Просмотров: 8 770
Видео
Angular & Web Components - Using Angular Elements to create Custom Elements
Просмотров 6 тыс.Год назад
Web Components is a standard to create framework agnostic HTML elements. In Angular we create an Angular Component, using Angular Elements to expose this Component as a Custom Element and use it outside of Angular. This video provides a step-by-step introduction how to create a custom component with Angular, how to use it in plain HTML and to deal with Input and Output of that custom element. G...
Spring Boot Webflux CRUD Tutorial - Using Spring Data R2DBC & PostgreSQL
Просмотров 6 тыс.Год назад
We create a fully functional spring boot webflux CRUD service. So we can create, read, update and delete entries in a postgres database. This video explains which spring dependencies are needed, how to setup postgres database, with flyway schema scripts and configuration of the spring boot service. We apply best practices like three layer architecture and use Spring Data R2DBC with reactive rep...
three.js Marching Cubes - Create Meta Balls!
Просмотров 1,7 тыс.Год назад
In this video we check out the marching cubes algorithm and render meta balls in three.js! Github: github.com/tamani-coding/threejs-marching-cubes-example Stackblitz: stackblitz.com/github/tamani-coding/threejs-marching-cubes-example?file=README.md (00:00) - Intro (00:27) - Marching Cubes Algorithm (03:48) - Meta Balls Function (06:19) - Code of The Algorithm (11:51) - Outro
three.js Glass Objects with Physical Material
Просмотров 3,1 тыс.Год назад
The MeshPhysicalMaterial enables us to create realistic looking glass objects. In this video we achive that step by step by setting the relevant attributes of the material. Github: github.com/tamani-coding/threejs-glassy-object-effect Stackblitz: stackblitz.com/github/tamani-coding/threejs-glassy-object-effect (00:00) - Intro (00:20) - MeshPhysicalMaterial Setup (00:54) - Transmission & Roughne...
three.js Stencil Buffer - Learn the WebGL Stencil Buffer
Просмотров 4,5 тыс.Год назад
Hey, this video describes the WebGL stencil buffer and how to use it. With the stencil buffer you can hide or show parts of mesh objects. We develop a magic cube, where each cube faces shows or hides certain meshes. Chech out the github repo of this example! Github: github.com/tamani-coding/threejs-stencil-buffer-example Stackblitz: stackblitz.com/github/tamani-coding/threejs-stencil-buffer-exa...
three.js Render Target Tutorial - Render a Second Scene as a Texture
Просмотров 4,7 тыс.Год назад
Hey, in this video we try out the render target. We will render a second scene as a texture onto a plane and create the illusion of a window into a different scene. Github: github.com/tamani-coding/threejs-render-target-example Stackblitz: stackblitz.com/github/tamani-coding/threejs-render-target-example (00:00) - Intro (01:33) - Scene Setup (02:51) - Render Target (04:22) - Render Secondary Sc...
three.js with HTML text - Use Position Projection to display a Text Box
Просмотров 6 тыс.Год назад
In this video we create a text box which is attached to the position of a 3D model. This can be used to display a health bar, a damager counter, stat screen or user interface. Learn how to transform a 3d position into browser window position via projection. Github: github.com/tamani-coding/threejs-html-text Stackblitz: stackblitz.com/github/tamani-coding/threejs-html-text?file=README.md (00:00)...
Three.js Navigation Mesh Tutorial - Pathfinding with a Navmesh
Просмотров 8 тыс.Год назад
Hey, in this video we use the three-pathfinding library to find a path for a character in a 3D level. We also build our own level and a corresponding navmesh with the Blender extension UPBGE! Check out tutorial code: github.com/tamani-coding/threejs-navmesh-example Try it out: stackblitz.com/github/tamani-coding/threejs-navmesh-example (00:00) - Intro (01:11) - Scene Setup (02:08) - Build a Lev...
Discord Chatbot Tutorial - Implement a Discord Application in Javasacript
Просмотров 276Год назад
Let's build our own discord chatbot! github.com/tamani-coding/discord-bot-example (00:00) - Intro (01:10) - Prerequisites (01:21) - Create your own discord channel (01:38) - Setup ngrok for a public tunnel (02:53) - Discord Developer Portal (05:14) - Setup a Javascript Nodejs webapplication (09:02) - Discord Request Verification (11:02) - Handle a Ping Request (12:07) - Configure the Interactio...
Angular & Google Login OAuth2 / OpenID Connect - Using the angular-oauth2-oidc Library
Просмотров 35 тыс.2 года назад
Google has deprecated their Google Sign-In JavaScript client library. An angular google authentication can be implemented using Googles OAuth2 / OpenID Connect System. For that we use the anuglar-oauth2-oidc library, which is compatible will any authorization provider, which supports these standard protocols. The angular example application in video has full google login and logout supports and...
three.js & rapier3D - Character Terrain Movement
Просмотров 18 тыс.2 года назад
I extend my previous basic character controller with physics. Using rapier3D we get a physical world, generate randomized terrain, make our character move on that terrain and interact with other physical bodies! See previous video: ruclips.net/video/C3s0UHpwlf8/видео.html Stackblitz: stackblitz.com/github/tamani-coding/threejs-rapier3d-character-terrain-movement Github: github.com/tamani-coding...
three.js WebGL Shaders Tutorial - For Beginners
Просмотров 4,2 тыс.2 года назад
We use the three.js shader material and make our own vertex and fragment webgl shaders to discover the possibilities! Stackblitz: stackblitz.com/github/tamani-coding/threejs-webgl-shaders-tutorial Github: github.com/tamani-coding/threejs-webgl-shaders-tutorial (00:00) - Intro (00:20) - Shaders Introduction (03:46) - Use Shader Material with own shaders and uniforms (05:17) - Advanced Fragment S...
three.js Sprite Animation - Implement a Sprite Flipbook / Sprite Mixer
Просмотров 6 тыс.2 года назад
three.js Sprite Animation - Implement a Sprite Flipbook / Sprite Mixer
three.js Particles - Using three-nebula Particle Engine
Просмотров 8 тыс.2 года назад
three.js Particles - Using three-nebula Particle Engine
Angular Unit Test Tutorial - Crash Course for Angular & Jasmine
Просмотров 18 тыс.2 года назад
Angular Unit Test Tutorial - Crash Course for Angular & Jasmine
three.js Basic Character Controls - GLTFLoader, AnimationMixer, 3rd Person Controller
Просмотров 51 тыс.2 года назад
three.js Basic Character Controls - GLTFLoader, AnimationMixer, 3rd Person Controller
three.js Buffergeometry - How to Morph 3D Objects
Просмотров 25 тыс.2 года назад
three.js Buffergeometry - How to Morph 3D Objects
Angular ngrx-store Tutorial - Action, Reducer, Selector
Просмотров 20 тыс.3 года назад
Angular ngrx-store Tutorial - Action, Reducer, Selector
Angular Internationalization / i18n - Using ngx-translate & Phrase
Просмотров 18 тыс.3 года назад
Angular Internationalization / i18n - Using ngx-translate & Phrase
three.js & tween.js - Tweening Tutorial
Просмотров 12 тыс.3 года назад
three.js & tween.js - Tweening Tutorial
three.js Raycaster - Tutorial for mouse picking / drag & drop
Просмотров 31 тыс.3 года назад
three.js Raycaster - Tutorial for mouse picking / drag & drop
Akka Http Server Scala Tutorial - Build a Webservice
Просмотров 7 тыс.3 года назад
Akka Http Server Scala Tutorial - Build a Webservice
WebGPU Tutorial - Cube Rendering with Color, Texture and Light Shading
Просмотров 3,1 тыс.3 года назад
WebGPU Tutorial - Cube Rendering with Color, Texture and Light Shading
A Basic Scene Renderer with WebGPU - Tutorial
Просмотров 17 тыс.3 года назад
A Basic Scene Renderer with WebGPU - Tutorial