<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>ThreeJs Archive - CEOsBay</title>
	<atom:link href="https://ceosbay.com/tag/threejs/feed/" rel="self" type="application/rss+xml" />
	<link>https://ceosbay.com/tag/threejs/</link>
	<description>It&#039;s all about Tech</description>
	<lastBuildDate>Sun, 16 Apr 2023 10:22:17 +0000</lastBuildDate>
	<language>de</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.0</generator>

<image>
	<url>https://i0.wp.com/ceosbay.com/wp-content/uploads/2022/11/image.jpg?fit=32%2C32&#038;ssl=1</url>
	<title>ThreeJs Archive - CEOsBay</title>
	<link>https://ceosbay.com/tag/threejs/</link>
	<width>32</width>
	<height>32</height>
</image> 
<site xmlns="com-wordpress:feed-additions:1">211828771</site>	<item>
		<title>JavaScript &#8211; Die Sprache für interaktive und dynamische Webanwendungen</title>
		<link>https://ceosbay.com/2022/11/12/javascript/</link>
					<comments>https://ceosbay.com/2022/11/12/javascript/#respond</comments>
		
		<dc:creator><![CDATA[CEO]]></dc:creator>
		<pubDate>Sat, 12 Nov 2022 06:00:00 +0000</pubDate>
				<category><![CDATA[DevOps]]></category>
		<category><![CDATA[Open Source]]></category>
		<category><![CDATA[Programmieren]]></category>
		<category><![CDATA[Website]]></category>
		<category><![CDATA[Acrobat]]></category>
		<category><![CDATA[Anwendungsentwicklung]]></category>
		<category><![CDATA[Apache]]></category>
		<category><![CDATA[Azure]]></category>
		<category><![CDATA[Bibliotheken]]></category>
		<category><![CDATA[Browser]]></category>
		<category><![CDATA[Cloud]]></category>
		<category><![CDATA[Code]]></category>
		<category><![CDATA[Codestruktur]]></category>
		<category><![CDATA[Deklarativ]]></category>
		<category><![CDATA[Dojo]]></category>
		<category><![CDATA[Dynamisch]]></category>
		<category><![CDATA[Frameworks]]></category>
		<category><![CDATA[Frontend]]></category>
		<category><![CDATA[Geschichte]]></category>
		<category><![CDATA[Heute]]></category>
		<category><![CDATA[Imperativ]]></category>
		<category><![CDATA[Java]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[Microsoft]]></category>
		<category><![CDATA[Multiparadigmisch]]></category>
		<category><![CDATA[Multipragmatisch]]></category>
		<category><![CDATA[Objektorientiert]]></category>
		<category><![CDATA[OOP]]></category>
		<category><![CDATA[Oracle]]></category>
		<category><![CDATA[Paradigmen]]></category>
		<category><![CDATA[Programmierer]]></category>
		<category><![CDATA[Quellcode]]></category>
		<category><![CDATA[Reac]]></category>
		<category><![CDATA[React]]></category>
		<category><![CDATA[Script]]></category>
		<category><![CDATA[Semantik]]></category>
		<category><![CDATA[Single]]></category>
		<category><![CDATA[Thread]]></category>
		<category><![CDATA[Three]]></category>
		<category><![CDATA[ThreeJs]]></category>
		<guid isPermaLink="false">https://ceosbay.com/?p=510</guid>

					<description><![CDATA[<p>JavaScript ist eine der bekanntesten Skriptsprachen für Websites. Es ist eine leichtgewichtige, interpretierte und just-in-time kompilierte Software-Sprache, die erstklassige Funktionen nutzt. Viele Nicht-Browser-Umgebungen wie Adobe Acrobat, Apache CouchDB und Node.JS® nutzen JavaScript. Diese weit verbreitete &#8230;</p>
<p>Der Beitrag <a href="https://ceosbay.com/2022/11/12/javascript/">JavaScript &#8211; Die Sprache für interaktive und dynamische Webanwendungen</a> erschien zuerst auf <a href="https://ceosbay.com">CEOsBay</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">JavaScript ist eine der bekanntesten Skriptsprachen für Websites. Es ist eine leichtgewichtige, interpretierte und just-in-time kompilierte Software-Sprache, die erstklassige Funktionen nutzt. Viele Nicht-Browser-Umgebungen wie Adobe Acrobat, Apache CouchDB und <a href="https://ceosbay.com/2022/11/11/node-js-mit-npm-auf-macos/">Node.JS®</a> nutzen JavaScript. Diese weit verbreitete Software-Sprache ist prototypenbasiert, deklarativ, imperativ, stark objektorientiert, single-thread, dynamisch und multiparadigmatisch. Die genannten Begriffe werden nachfolgend erklärt aber zu einem späteren Zeitpunkt in einen anderen Beitrag, bei dem ich verschiedene Paradigmen vorstelle, verschoben.</p>



<h3 class="wp-block-heading">Prototypenbasierte Programmierung</h3>



<p class="wp-block-paragraph">Prototypenbasierte Programmierung, auch als klassenlose Objektorientierung bekannt, ist eine Form der objektorientierten Programmierung, die auf das Sprachelement der Klasse verzichtet. Objekte werden nicht durch Instanziierung (Der&nbsp;Prozess des Lesens oder des Angebens von Informationen) einer Klasse, sondern durch Klonen bereits existierender Objekte erzeugt. Bei diesem Klonen werden alle Eigenschaften (Attribute und Methoden) des Prototyp-Objektes kopiert. Sie können aber überschrieben werden, und das neue Objekt kann mit neuen Eigenschaften versehen werden. Hierzu aber in einem anderen Beitrag mehr.</p>



<h3 class="wp-block-heading">Deklarative Programmierung</h3>



<p class="wp-block-paragraph">In der Informatik ist die deklarative Programmierung ein Programmierparadigma &#8211; ein Stil zum Aufbau der Struktur und der Elemente von Computerprogrammen -, dass die Logik einer Berechnung ausdrückt, ohne ihren Kontrollfluss zu beschreiben. Folglich wird im Quellcode festgelegt, was in welcher Reihenfolge und wie zu tun ist: „First do this and next do that / Erst dies und dann das tun“.  Ich werde dieses Thema aber noch in einem anderen Beitrag ausführlich behandeln.</p>



<h3 class="wp-block-heading">Imperative Programmierung</h3>



<p class="wp-block-paragraph">Die Imperative Programmierung ist ein Programmierparadigma, nach dem „ein Programm aus einer Folge von Anweisungen besteht, die vorgeben, in welcher Reihenfolge was vom Computer getan werden soll. Auch dieses Thema wird später noch in einem anderen Beitrag genauer thematisiert.</p>



<h3 class="wp-block-heading">Objektorientierte Programmierung</h3>



<p class="wp-block-paragraph">Die objektorientierte Programmierung (kurz OOP) ist ein auf dem Konzept der Objektorientierung basierendes Programmierparadigma. Die Grundidee besteht darin, die Architektur einer Software an den Grundstrukturen desjenigen Bereichs der Wirklichkeit auszurichten, der die gegebene Anwendung betrifft. Eines der wichtigsten Programmierparadigmen unserer Zeit. Ich werde noch einige Beiträge zur objektorientierten Programmierung erstellen.</p>



<h3 class="wp-block-heading">Single-thread</h3>



<p class="wp-block-paragraph">In der Informatik bezeichnet Thread einen Ausführungsstrang oder eine Ausführungsreihenfolge in der Abarbeitung eines Programms. Ein Thread ist Teil eines Prozesses. In meiner Jugend kannte man diesen Begriff noch in Zusammenhang mit Multithreading bei Prozessoren. War damals für uns wie ein Traum. Aber auch zu diesen Begrifflichkeit in einem anderen Beitrag mehr.</p>



<h3 class="wp-block-heading">Dynamische Programmierung</h3>



<p class="wp-block-paragraph">Die dynamische Programmierung dient zur Lösung eines Optimierungsproblems durch algorithmische Verfahren. Das Problem wird in Teilprobleme zergliedert und es werden systematisch Zwischenergebnisse gespeichert. Auch hierzu in einem späteren Beitrag mehr.</p>



<h3 class="wp-block-heading">Multiparadigmatische Programmiersprachen</h3>



<p class="wp-block-paragraph">Eine Multiparadigmen Programmiersprache ist eine Programmiersprache, die zur Problemlösung mit verschiedenen Programmierparadigmen die geeigneten Sprachmittel besitzt.</p>



<h3 class="wp-block-heading">Java = / ≠ JavaScript</h3>



<p class="wp-block-paragraph">Sowohl Java als auch JavaScript sind in den USA und anderen Ländern eingetragene Marken von Oracle. Sie sind aber keineswegs identisch. Obwohl sie ähnlich klingen, sind sie in Bezug auf Syntax, Semantik und Anwendung der Sprache im wirklichen Leben sehr unterschiedlich.</p>



<h3 class="wp-block-heading">Geschichte</h3>



<p class="wp-block-paragraph">Brendan Eich (Ein Programmierer der Netscape Communication Corporation) hat JavaScript 1995 entwickelt. Offenbar brauchte er etwa 10 Tage, um Mocha zu entwickeln. Später wurde der Name der Sprache in Mona und dann in LiveScript geändert. Derzeit ist sie allgemein als JavaScript bekannt. 1996 wurde es von der ECMA übernommen, die JavaScript mit der ECMAScript Language Specification und den ECMAScript Internationalized API Spezifikationen versah. Im Jahr 2005 traten Eich und Mozilla der ECMA bei, und die JavaScript-Gemeinschaft blühte auf. Im Jahr 2016 nutzten 92 % der Websites JavaScript, von großen Tech-Giganten wie Facebook und Google bis hin zu kleinen Start-Ups, wie <a href="https://www.coezbay.com" target="_blank" rel="noreferrer noopener">meines</a>.</p>



<h3 class="wp-block-heading">Heute</h3>



<p class="wp-block-paragraph">Derzeit wird die Sprache immer noch überall eingesetzt und ist eine der am häufigsten verwendeten clientseitigen Skriptsprachen. Von 1995 bis heute hat JavaScript einen langen Weg zurückgelegt. Heutzutage wird es innerhalb von HTML-Elementen geschrieben, um Dynamik in Webprojekten und konventionellen Desktop-Anwendungen zu ermöglichen. So ziemlich alle Echtzeit Onlinespiele beinhalten die Sprache. Viele andere Technologien wurden auf der Grundlage von JavaScript entwickelt, zum Beispiel <a href="https://ceosbay.com/2022/11/11/node-js-mit-npm-auf-macos/">NodeJS®</a> &#8211; welches ich in einem anderen Beitrag kurz angeschnitten habe, React &#8211; was ich in einem anderen Beitrag thematisieren werde. JavaScript ist zwar alt und hat eine komplexe Vergangenheit, doch genau diese Tatsache haben wir es zu verdanken, dass sie auch enorm großes Spektrum an Bibliotheken und Frameworks bietet. Hierzu nachfolgend mehr.</p>



<h3 class="wp-block-heading">JavaScript-Bibliotheken</h3>



<p class="wp-block-paragraph"><a href="https://dev.to/t/discuss"></a>Um die Programmierung zu erleichtern, gibt es, wie bereits erwähnt, Unmengen an sogenannter JavaScript-Bibliotheken und -Frameworks. Diese Bibliotheken werden verwendet, um Code für komplexere Funktionalitäten schneller schreiben zu können. Sie ermöglichen es Entwicklern, vorgefertigte Code-Snippets zu nutzen und eigene Code-Snippets für die zukünftige Verwendung zu erstellen und zu speichern. Wenn man solch eine Bibliothek für seine eigenen Routinen erstellt hat und Herr dieser Daten ist, sind auch Zeit- als auch Arbeitsersparnisse die daraus resultieren immens. Beispiele für JavaScript-Bibliotheken sind: jQuery, ReactJS, Google Polymer, Dojo-Toolkit und Three.js. Wobei Three.js eine browserübergreifende JavaScript-Bibliothek und gleichzeitig eine Anwendungsprogrammierschnittstelle zur Erstellung und Anzeige animierter 3D-Computergrafiken in einem Webbrowser mit WebGL darstellt. Letzteres ist eines meiner Lieblingsdinge, mit denen ich mich beruflich als auch privat gerne beschäftige.</p>



<h3 class="wp-block-heading">JavaScript-Frameworks</h3>



<p class="wp-block-paragraph">JavaScript-Frameworks sind Vorlagen, die eine Codestruktur vorgeben, der man folgen kann. Dadurch wird die Entwicklung teilweise erleichtert. Doch gleichzeitig schränkt es einen auch in gewisser Weise ein, da man als Entwickler gewisse Regeln beachten muss. Beispiele für JavaScript-Frameworks sind. beispielsweise Vue.js, AngularJS und Apache Royale.</p>



<p class="wp-block-paragraph">Übrigens: Wenn JavaScript ohne die Verwendung von Bibliotheken oder Frameworks geschrieben, wird es als „Vanilla-JavaScript“ bezeichnet.</p>



<h3 class="wp-block-heading">Clientseitiges JavaScript und serverseitiges JavaScript</h3>



<p class="wp-block-paragraph">JavaScript kann sowohl clientseitig als auch serverseitig genutzt werden. Clientseitiges JavaScript ermöglicht die Manipulation von Browsern und Webseiten. Es führt das Skript im Browser des Nutzers aus und ist eine der häufigsten Verwendungsformen von JavaScript. Ich habe hierzu in einem anderen <a href="https://ceosbay.com/2022/10/30/aus-alt-mach-neu/">Beitrag</a> ein paar Zeilen geschrieben bzw. es findet in der Three.js Web-Anwendung statt, die im Header Bereich <a href="https://cagatayoezbay.com">meiner persönlichen Website</a> zum Einsatz kommt.</p>



<p class="wp-block-paragraph">Serverseitiges JavaScript läuft nicht im Browser, sondern auf dem Server. Generell ist es weniger verbreitet als clientseitiges JavaScript. Ein Beispiel für ein beliebtes serverseitiges Scripting-Framework für JavaScript ist <a href="https://ceosbay.com/2022/11/11/node-js-mit-npm-auf-macos/">NodeJS®</a>.</p>



<h3 class="wp-block-heading">Fazit</h3>



<p class="wp-block-paragraph">JavaScript ist eine der wichtigsten Programmiersprachen. Sie ist sehr dynamisch und wird sowohl in der Anwendungs-, Frontend- als auch in der Backend-Webentwicklung verwendet.</p>



<p class="wp-block-paragraph">Angesichts der möglichen Auswirkungen auf die Geschwindigkeit und Performance der Anwendung oder Webseite ist es wichtig zu verstehen, wie JavaScript funktioniert. Anhand von Best Practices kann man lernen, effektiver zu programmieren und die Leistung seiner Anwendungen und Webseiten zu verbessern. Auch in Bezug auf SEO (Search Engine Optimization = Suchmaschinenoptimierung &#8211; Die Maßnahmen, die dazu dienen, um die Sichtbarkeit einer Webseite und ihrer Inhalte für Benutzer einer Suchmaschine bzw. die Auffindbarkeit zu erhöhen) spielt dies eine sehr große Rolle. Aber das Thema SEO werde ich in einem späteren Beitrag thematisieren.<br></p>
<p>Der Beitrag <a href="https://ceosbay.com/2022/11/12/javascript/">JavaScript &#8211; Die Sprache für interaktive und dynamische Webanwendungen</a> erschien zuerst auf <a href="https://ceosbay.com">CEOsBay</a>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://ceosbay.com/2022/11/12/javascript/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">510</post-id>	</item>
		<item>
		<title>Website &#8211; Aus ALT mach NEU</title>
		<link>https://ceosbay.com/2022/10/30/aus-alt-mach-neu/</link>
		
		<dc:creator><![CDATA[CEO]]></dc:creator>
		<pubDate>Sun, 30 Oct 2022 21:27:25 +0000</pubDate>
				<category><![CDATA[Website]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[API]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[Open Source]]></category>
		<category><![CDATA[Repository]]></category>
		<category><![CDATA[ThreeJs]]></category>
		<category><![CDATA[WebGL]]></category>
		<category><![CDATA[Webseite]]></category>
		<guid isPermaLink="false">https://ceosbay.com/?p=12</guid>

					<description><![CDATA[<p>Vor einigen Jahren ist das nachfolgende interaktive 3D Menü für meine Website entstanden, welches ich damals mit JavaScript und ThreeJS programmiert habe. Three.js ist eine browserübergreifende JavaScript-Bibliothek und Anwendungsprogrammierschnittstelle (API) zur Erstellung und für die &#8230;</p>
<p>Der Beitrag <a href="https://ceosbay.com/2022/10/30/aus-alt-mach-neu/">Website &#8211; Aus ALT mach NEU</a> erschien zuerst auf <a href="https://ceosbay.com">CEOsBay</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">Vor einigen Jahren ist das nachfolgende interaktive 3D Menü für meine Website entstanden, welches ich damals mit <a href="https://ceosbay.com/2022/11/12/javascript/">JavaScript</a> und <a href="https://threejs.org" target="_blank" rel="noreferrer noopener">ThreeJS</a> programmiert habe. Three.js ist eine browserübergreifende <a href="https://ceosbay.com/2022/11/12/javascript/">JavaScript</a>-Bibliothek und Anwendungsprogrammierschnittstelle (API) zur Erstellung und für die Anzeige animierter 3D-Computergrafiken in einem Webbrowser mit WebGL. Der Quellcode wird in einem Repository auf GitHub gehostet und ist als OpenSource erhältlich. Als &#8222;<a href="https://ceosbay.com/2022/11/16/erklaerung-open-source/">Open Source</a>&#8220; wird Software bezeichnet, deren Quelltext öffentlich und von Dritten eingesehen, geändert und genutzt werden kann. <a href="https://ceosbay.com/2022/11/16/erklaerung-open-source/">Open-Source</a>-Software kann meistens kostenlos genutzt werden. Hierzu aber in späteren Beiträgen mehr.</p>



<figure class="wp-block-video"><video height="888" style="aspect-ratio: 1982 / 888;" width="1982" controls src="https://ceosbay.com/wp-content/uploads/2022/10/Bildschirmaufnahme-2022-10-30-um-22.31.52.mp4"></video></figure>



<p class="wp-block-paragraph">Die 3D Objekte wurden damals kurzerhand mit dem OpenSource 3D Programm <a rel="noreferrer noopener" href="https://www.blender.org" target="_blank">Blender</a> erstellt. Im Anschluss wurde mit ThreeJS programmiert und die 3D Objekte wurden mit Animationen und weiteren Interaktionsmöglichkeiten zum Leben erweckt.</p>



<p class="wp-block-paragraph">In den letzten Tagen habe ich angefangen, diverse Themen zu erlernen. In diesem Zusammenhang bin ich auch über <a href="https://github.com/tweenjs" target="_blank" rel="noreferrer noopener">tween.js </a>gestolpert. Eine <a href="https://ceosbay.com/2022/11/16/erklaerung-open-source/">JavaScript</a>&#8211; Engine für &#8222;vereinfachte&#8220; Animationen. Vereinfacht deshalb, da diverse Gleichungen von einem gewissen Herrn Robert Penner wesentlich optimiert und zur Verfügung gestellt wurden. </p>



<p class="wp-block-paragraph">Einige meiner Webanwendungen die ich erstelle, benötigen komplexe Berechnungen. Beispielsweise um 3D Objekte in einem Browser von A nach B zu bewegen. Dank der Hilfe von tween.js, geht dies nun wesentlich schneller. Vor allem, weil man sich nicht so viele Gedanken über die komplexen Gleichungen machen muss. Das Ergebnis könnt ihr auf der Begrüßungsseite meiner persönlichen Website oder gleich aus der nachfolgenden Bildschirmaufnahme entnehmen.</p>



<figure class="wp-block-video"><video height="888" style="aspect-ratio: 1982 / 888;" width="1982" controls muted src="https://ceosbay.com/wp-content/uploads/2022/10/Bildschirmaufnahme-2022-10-30-um-21.53.51.mp4"></video><figcaption class="wp-element-caption">&#8222;Neues&#8220; bzw. modifiziertes interaktives 3D Menü auf der Website</figcaption></figure>



<h3 class="wp-block-heading">Interoperabilität</h3>



<p class="wp-block-paragraph">Diese Art der Visualisierung soll interaktiv darstellen, dass alle Bereiche, die ich so in meinem Portfolio, durchaus miteinander kompatibel sind.</p>



<p class="wp-block-paragraph">Ein kurzes Beispiel hierfür: </p>



<p class="wp-block-paragraph">Man erstellt hochwertige 3D Laser-Scans des Interieurs undAußenanlage eines Unternehmens. In der Regel durch den Einsatz von Luft- und Boden-Laser-Scannern. Im Anschluss ein bis auf ein hundertstel Millimeter präzises digitales Abbild des Firmengebäudes und des Firmenareals. Optimiert und konvertiert man die Point Cloud in ein konventionelles 3D Modell (3d Mesh), kann man dieses im Anschluss verwenden, um mit Hilfe von diversen Tools, die Produktionsabläufe zu optimieren oder aber auch Umbauten oder Anbauten besser zu planen. </p>



<p class="wp-block-paragraph">Selbstverständlich dienen all diese Daten auch der Dokumentation. Denkt man zurück, an den Brand von Notre-Dame in Paris 2019, konnten dank solcher Scans, die vorher zur Erstellung von Spielewelten erstellt wurden, manche Teile die bei dem Brand zerstört wurden, wesentlich akkurater wiederhergestellt werden. Bedenkt man die Tatsache, dass von derart alten Gebäuden größtenteils keine Baupläne erhältlich sind, können auch diese anhand von Laser Scans, dementsprechend präzise erstellt werden. Im kleineren Maßstab lassen sich auch Ersatzteile oder neue Teile für Produkte im 3D-Druck-Verfahren erstellt werden. Die Möglichkeiten sind geradezu unbegrenzt und werden mit Sicherheit noch in den zukünftigen Blogbeiträgen zu Wort gebracht.</p>
<p>Der Beitrag <a href="https://ceosbay.com/2022/10/30/aus-alt-mach-neu/">Website &#8211; Aus ALT mach NEU</a> erschien zuerst auf <a href="https://ceosbay.com">CEOsBay</a>.</p>
]]></content:encoded>
					
		
		<enclosure url="https://ceosbay.com/wp-content/uploads/2022/10/Bildschirmaufnahme-2022-10-30-um-21.53.51.mp4" length="1901008" type="video/mp4" />
<enclosure url="https://ceosbay.com/wp-content/uploads/2022/10/Bildschirmaufnahme-2022-10-30-um-22.31.52.mp4" length="1395462" type="video/mp4" />

		<post-id xmlns="com-wordpress:feed-additions:1">12</post-id>	</item>
	</channel>
</rss>
