Category Archives: Uncategorized
Vue.js: The Documentary
Fusion 360 Cheatsheet
Fusion 360 Videos
Mistermestro
Kristian_Laholm
Fusion 360 – Sketch problem, Fully Constrained but not Fully defined (No Lock on Sketch)
Product Design Online
Learn Autodesk Fusion 360 in 30 Days for Complete Beginners! (Playlist)
HOW and WHY to Fully Constrain Your Sketches – Learn Autodesk Fusion 360 in 30 Days: Day #17
- Strategy how your sketch entities relate to one other at the beginning of each model
- Design Intent
- Pencil and paper before you start sketching anything out in Fusion 360
- Square washer plate with a hole cut out
![]() |
![]() |
![]() |
![]() |
Learn the Fusion 360 User Interface (2021)
Ümit Acku
Fusion 360 Kaufteil / Katalogteil einfügen und fixieren – Baugruppe – Gelenke – Skizze – Zep To
Riesen Consulting
Autodesk Fusion 360 – STEP-, / SAT-Dateien bearbeiten – Deutsch Tutorial Schulung
LearnItDoItMakeIt
Joint (Face-to-Face) – Day 42 of 100 Autodesk Fusion 360 Journey
Autodesk Fusion 360
Using As Built Joints
QUICK TIP: Ground vs As-Built Joint
Fusion 360 School
Fusion 360 | Master Model Workflow
Fusion 360 – Master Model | Top Down Design
Fusion 360 – Master Model Workflow
Fusion 360 – Case Studies (Playlist)
NYC CNC
Joints in Fusion 360: A Comprehensive Tutorial! FF117
Chong Siu
Replacing a Component and Managing its Dependencies in Fusion 360
Aircraft & HElicopter
TEX – Design & Engineering
How to Model a Car | Fusion 360 Tutorial Series
How to Model a Helicopter | Fusion 360 Tutorial Series
How to Model an Aircraft | Fusion 360 Tutorial Series
Omega Fusion
Boeing 757
A350 Designing
How to Design a Aircraft
Model Rocket
JavaScript Videos
YouTube
MaxSandelin
Learn to code a to-do list app in JavaScript – Part 1
Learn to code an API in JavaScript – Part 1
github.com/themaxsandelin/todo
maxsandelin.com
The Coding Train
9.19: Prototypes in Javascript – p5.js Tutorial
Coding Challenge #65.1: Binary Search Tree
1.4: JSON – Arbeiten mit Daten und APIs in JavaScript
Traversy Media
Async JS Crash Course – Callbacks, Promises, Async Await
Level Up Tutorials, LLC.
Level Up Tutorials Website
Level Up Tutorials Playlist
Programming with Mosh
ES6 Tutorial: Learn Modern JavaScript in 1 Hour
Fun Fun Function
Object Creation in JavaScript (Playlist)
Must-know JavaScript Features
var, let and const – What, why and how – ES6 JavaScript Features
Web Dev Simplified
MutationObserver – This Is Unbelievably Powerful
Async vs Defer – What Is The Fastest Way To Load JavaScript
ES6
The ES6 Guide
JavaScript ES6 Features
These are the features in ES6 that you should know
Understanding Destructuring, Rest Parameters, and Spread Syntax in JavaScript
ES6 Handbook: Everything You Need to Know
JavaScript ES6 (ECMAScript 2015)
Text
ECMAScript 2009 | ES5 |
ECMAScript 2015 | ES6 |
ECMAScript 2016 | – |
ECMAScript 2017 | – |
ECMAScript 2018 | – |
Learn JavaScript
Mozilla
JavaScript building blocks
Looping code
Introduction to events
Making decisions in your code — conditionals
Performance interface
Funktionen
Methoden Definitionen
- Die Funktionsdeklaration (function Statement)
- Der Funktionsausdruck (function Ausdruck)
- Die Generatorfunktionendeklaration (function* Statement)
- Der Generatorfunktionsausdruck (function* Ausdruck)
- Der Pfeilfunktionsausdruck (=>)
- Der Function Konstruktor
- Der GeneratorFunction Konstruktor
- Das arguments Objekt
- Konstruktor vs. Deklaration vs. Ausdruck
var
Variablendeklarationen werden immer ausgeführt bevor Programmcode ausgeführt wird, egal wo sie im Programmcode vorkommen. Der Gültigkeitsbereich einer Variablendeklaration mit var
ist der aktuelle Kontext. Dieser ist der Kontext der umschließenden Funktion oder für Deklarationen außerhalb von Funktionen der globale Kontext.
let
let
ermöglicht es Variablen zu deklarieren, deren Gültigkeitsbereich auf den Block, den Befehl oder den Ausdruck beschränkt ist, in dem sie deklariert sind. Der Unterschied zum var
Schlüsselwort ist, dass der Gültigkeitsbereich auf Blöcke und nicht auf Funktionen bzw. Global beschränkt ist.
ES6 In Depth: let and const
Explaining JavaScript Scope And Closures
JavaScript modules
Express/Node introduction
// Load HTTP module const http = require("http");
<script type="module" src="main.js"></script> import { name, draw, reportArea, reportPerimeter } from './modules/square.js';
dofactory
JavaScript Objects
JavaScript Advanced Objects
JavaScript Function Objects
academind
javascript.info
Raycasting Videos
Vue.js Videos
CSS Videos
YouTube
Online Tutorials
Magic Navigation Menu Indicator using Html CSS & Javascript | Curve Outside Effects 02
Colorful Rain Animation Effects using Html CSS & Vanilla Javascript
Top CSS & Javascript Animation & Hover Effects | January 2021
Magic Navigation Menu Indicator using Html CSS & Javascript | Curve Outside Effects
CSS 3D Text Animation Effects | Html CSS Animated Cigarette
Coding – kurz und knapp
Responsive Navigationsleisten | HTML, Flexbox, JavaScript, CSS Tutorial Deutsch
Kevin Powell
Learn CSS Grid the easy way
Amazing 3D CSS creations from my community
Flexbox design patterns you can use in your projects
Responsive navbar tutorial using HTML CSS & JS
Simplify your CSS with these 3 grid layout solutions
Rachel Andrew
The fundamentals of CSS layout | Workshop
CSS Layout Workshop
The Net Ninja
CSS Flexbox Tutorial (Playlist)
github.com/iamshaunjp
github.com/iamshaunjp/css-flexbox-playlist
Unleashed Design
CSS3 Grid/Flex Layout richtig nutzen! [TUTORIAL]
Dieser CSS Card Effekt macht süchtig! Spotlight Border Animation [DE/Tutorial]
Web Dev Simplified
Learn CSS Display Property In 4 Minutes
Learn CSS Position In 9 Minutes
Learn CSS Media Query In 7 Minutes
HTML und CSS Tutorial für Anfänger | Eigene Webseite erstellen
The Morpheus Tutorials
CSS 3 Tutorial #24 – Animationen Grundlagen
Cod Mark
Border Animation CSS | Quick Animation
LearnWebCode
CSS Layout: Flexbox & Grid Basics
Text
Mozilla
Grundlegende Konzepte der Flexbox
CSS-Tricks Text
A Complete Guide to Flexbox
Intro to Vue.js: Animations
Intro to Vue.js: Vuex
Creating Vue.js Component Instances Programmatically
Creating Vue.js Transitions & Animations
Vue Design System
Getting Started with Vue Plugins
How the Vue Composition API Replaces Vue Mixins
Vue 3
vscode
CSS Cheatsheet
Collapsed Margins
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> <div class="flexbox"> <div class="flexelement">Box 1</div> <div class="flexelement">Box 2</div> <div class="flexelement">Box 3</div> <div class="flexelement">Box 4</div> <div class="flexelement">Box 5</div> </div> </body> </html>
html { background: #afafaf; } .flexbox { width: 90%; margin: 5%; background: #dadada; } .flexelement { background: #ff6600; color: #ffffff; text-align: center; margin: 10px; padding: 15px 0 15px 0; }
![]() |
Why does this CSS margin-top style not work?
Float left
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> <div class="flexbox"> <div class="flexelement">Box 1</div> <div class="flexelement">Box 2</div> <div class="flexelement">Box 3</div> <div class="flexelement">Box 4</div> <div class="flexelement">Box 5</div> </div> </body> </html>
html { background: #afafaf; } .flexbox { width: 90%; margin: 5%; background: #dadada; } .flexelement { background: #ff6600; color: #ffffff; text-align: center; margin: 10px; padding: 15px; float: left; }
- background vom Parent ist transparent?
![]() |
- Parent hat nun auch float left! Background wieder da!
.flexbox { width: 90%; margin: 5%; background: #dadada; float: left; }
![]() |
- Letztes div nicht mehr float left
<div class="flexelement-clear">Box 4</div> <div class="flexelement">Box 5</div>
.flexelement-clear { background: #ff6600; color: #ffffff; text-align: center; margin: 10px; padding: 15px; clear: left; }
![]() |
Flexbox kein Wraparound?
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> <div class="flexbox"> <div class="flexelement">Box 1</div> <div class="flexelement">Box 2</div> <div class="flexelement">Box 3</div> <div class="flexelement">Box 4</div> <div class="flexelement">Box 5</div> <div class="flexelement">Box 6</div> </div> </body> </html>
html { background: #afafaf; } .flexbox { width: 90%; margin: 5%; background: #dadada; display: flex; } .flexelement { background: #ff6600; color: #ffffff; text-align: center; margin: 10px; padding: 15px; }
.flexbox { width: 90%; margin: 5%; background: #dadada; display: flex; flex-direction: row; flex-wrap: wrap; }
Flexbox Menu-Punkte mit justify-content: flex-end
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> <div class="flexbox"> <div class="flexelement">Box 1</div> <div class="flexelement">Box 2</div> <div class="flexelement">Box 3</div> <div class="flexelement">Box 4</div> </div> </body> </html>
html { background: #afafaf; } .flexbox { width: 90%; margin: 5%; background: #dadada; display: flex; flex-direction: row; justify-content: flex-end; } .flexelement { background: #ff6600; color: #ffffff; text-align: center; margin: 10px; padding: 15px; }
Flexbox align-items
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> <div class="flexbox"> <div class="flexelement">Box 1 asdf sasdf asdf sd fasdf asf sadfas fasdf asdfasdf saafd</div> <div class="flexelement">Box 2</div> <div class="flexelement">Box 3</div> <div class="flexelement">Box 4</div> </div> </body> </html>
html { background: #afafaf; } .flexbox { width: 90%; margin: 5%; background: #dadada; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: stretch; } .flexelement { background: #ff6600; color: #ffffff; text-align: center; margin: 0 0 1% 0; padding: 15px 0 15px 0; width: 20%; }
.flexbox { width: 90%; margin: 5%; background: #dadada; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; }
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Nav</title> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> <div class="flexbox"> <div class="flexelement box1">Box 1</div> <div class="flexelement">Box 2</div> <div class="flexelement">Box 3</div> <div class="flexelement">Box 4</div> </div> </body> </html>
html { background: #afafaf; } .flexbox { width: 90%; margin: 5%; background: #dadada; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: baseline; } .flexelement { background: #ff6600; color: #ffffff; text-align: center; margin: 0 0 1% 0; padding: 15px 0 15px 0; } .box1 { font-size: 50px; }
Wireshark TLS Encryption
YouTube
How to Decrypt HTTPS Traffic with Wireshark // TLS Decryption // Wireshark Tutorial
Analyzing TLS session setup using Wireshark
Tutorials
Browser-SSL entschlüsselt
NSS Key Log Format
SSLKEYLOGFILE environment variable doesn’t populate any text file
K50557518: Decrypt SSL traffic with the SSLKEYLOGFILE environment variable on Firefox or Google Chrome using Wireshark
Bug 12779 – Add TLS 1.3 support
TLS ENCRYPTED
How to Decrypt SSL using Chrome or Firefox and Wireshark in Windows