Hi michifrog,

kurzgefasst im WWW. Du findest mit der Suchmaschine deines Vertrauens im Internet viele schöne Beispiele die nutzen kannst um dich zu inspirieren und eigene entwickeln kannst. Wenn du allgemeine Probleme hast etwas umzusetzen, empfehle ich dir Fachbücher zum Thema zu lesen wie vom Rheinwerk Verlag.

Hier ein paar Bücher für dich:

https://www.rheinwerk-verlag.de/webdesign-das-handbuch-zur-webgestaltung/

https://www.rheinwerk-verlag.de/grundkurs-gutes-webdesign-alles-was-sie-ueber-gestaltung-im-web-wissen-muessen/

https://www.rheinwerk-verlag.de/responsive-webdesign-konzepte-techniken-praxisbeispiele/

...zur Antwort

Wenn du eine Ausbildung zum Mediengestalter Digital und Print Fachrichtung Gestaltung und Technik machst oder den Fachinformatiker Fachrichtung Anwendungsentwicklung, dann bist du mit 2 bis 3 Jahren dabei.

Du kannst auch ohne Ausbildung den Stoff lernen, aber um damit Erfahrungen zu sammeln brauchst du mindestens genauso lange, wenn nicht mehr.

Wenn es um einfache Anfängersachen geht und man in die Programmierung einsteigt brauchst du nur ein paar Wochen. Wenn du es beruflich machen möchtest und damit gut Geld verdienen möchtest, brauchst du Jahre.

...zur Antwort

Hi Alexandraseha22,

ich habe als Mediengestalter Digital und Print viele unterschiedliche Webanwendungen schon entwickeln dürfen. Unter anderem eine Schulverwaltungssoftware, webbasierende Informationstafel mit eigener Administrationsoberfläche und eine Lagerbestandsoftware.

Bei allen Projekten durfte ich sowohl das Design entwickeln als auch die Webentwicklung übernehmen.

Alle Webanwendungen wurden mit HTML, CSS, JavaScript, PHP und SQL angewendent. Die Herausforderung bei Lagerbestandssoftware war es, das es dort Schnittstellen gab und mit einer Oracle-Datenbank lief und auch zum Teil mit MSSQL.

...zur Antwort

Hi MrPatrol,

es gibt ein spezifisches Problem mit der Kodierung von Videos und das liegt nicht nur alleine an Android-Endgeräten. Um das Problem zu beschreiben, würde das den Rahmen hier sprengen. Kurz zusammengefasst - es hat mit Lizenzrechten und technischen Hindernissen zu tun.

Du solltest eine H.264-Codec oder einen AAC-Codec verwenden. Die Videos solltest du ohne Angaben des type-Attributs einbinden und der Aufruf kann via JavaScript erfolgen.

Folgendes zu EventListener: EventListener werden auf ein HTML-Element unter anderem gepackt um z.B. mit einem Click-Event den EventListener zu triggern.

let vidElem = document.querySelector("#meinVideo");
vidElem.addEventListener("click", ()=>{
if(videoElem.paused) {
videoElem.play();
}
});

Viel Spass

...zur Antwort

Dafür benötigst du eine App die dir das Erstellen von Code erlaubt. So eine App wäre z.B. DroitEdit.

...zur Antwort

Hi comedy12,

um mit einer Domain(beispiel.de) umzuziehen, benötigt ihr von eurem Webhoster/Webprovider einen sogenannten AuthCode mit der ihr die Domain zu einem anderem Webhoster umziehen könnt. Beim neuen Webhoster gibt es unterschiedliche Möglichkeiten diese dann dort einzufügen. Informiert euch bei eurem Webhoster, dort gibt es meistens unter den Stichworten von oben Hilfe oder schreibt diese direkt an. PS: Ihr seid die rechtmäßigen Eigentümer der Domain. So ist der Domainhalter/Webhoster dazu verpflichtet euch den AuthCode zu geben. Viel Erfolg

...zur Antwort

Hi Maurice,

verwende lieber Eventlistener innerhalb von JavaScript anstatt onclick-EventHandler. Diese bieten mehr Möglichkeiten und es können mehrere EventListener mit dem gleichen Event registriert werden. Setze deinen JavaScript-Code in den Head-Element von HTML. Das ist semantischer und logischer. Mithilfe von dem DOMContentLoaded-Event kannst du abfragen ob alle DOM-Elemente geladen wurden. Wenn du externe Skripte einbindest kannst auch ersatzweise das defer-Attribut verwenden.

Ich habe zwei Versionen geschrieben da ich davon ausgehe das du nicht nur die Bilder austauschen möchtest, sondern auch die funktionellen Elemente im Elternelement.

Hier die einfache Variante wo nur das Bild gewechselt wird:

<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #tauschen {
            cursor: pointer;
        }
    </style>
    <script>
        "use strict";
        let calcEuro, calcDollar, tauschen;
        document.addEventListener("DOMContentLoaded", init);
        function init() {
            calcEuro = document.querySelector("#calcEuro");
            calcDollar = document.querySelector("#calcDollar");
            tauschen = document.querySelector("#tauschen");
            tauschen.addEventListener("click", tausche);
        }
        function tausche() {
            let flags = document.querySelectorAll(".flag");
            flags.forEach((item)=>{
                if(item.src.includes('eu.png')) {
                    item.src = "img/usa.png";
                } else {
                    item.src = "img/eu.png";
                }
            });
        }
    </script>
</head>
<body>
    <div class="bar">
        <img src="img/menü.png" alt="">
        Währungsrechner
      </div>
  
  
      <div class="input-container">
        <img class="flag" src="img/eu.png" alt="">
        <input value="" id="euroField" type="text">
        <span class="currency">EUR</span>
      </div>
  
  
      <div class="center-container">
        <img src="img/pfeile.png" alt="" id="tauschen">
      </div>
  
  
      <div class="input-container">
        <img class="flag" src="img/usa.png" alt="">
        <input value="" id="usdField" type="text">
        <span class="currency">USD</span>
      </div>
  
  
      <div class="center-container">
        <button id="calcEuro">$ Berechnen</button>
        <button id="calcDollar">€ Berechnen</button>
      </div>
</body>
</html>
    

Hier die andere Variante:

<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tauschen</title>
    <script>
        'use strict';
        let inputContainerList, tausch;
        document.addEventListener("DOMContentLoaded", init);
        function init() {            
            tausch = document.querySelector("#tauschen");
            tausch.addEventListener("click", tauschen);
        }
        function tauschen() {
            inputContainerList = document.querySelectorAll(".input-container");
            let container1 = inputContainerList[0];
            let container2 = inputContainerList[1];
            let clonedContainer1 = container1.cloneNode(true);
            let clonedContainer2 = container2.cloneNode(true);
            container1.parentNode.replaceChild(clonedContainer2, container1);
            container2.parentNode.replaceChild(clonedContainer1, container2);
        }
    </script>
</head>
<body>
    <div class="bar">
        <img src="img/menü.png" alt="">
        <span>Währungsrechner</span>
    </div>
    <div class="input-container">
        <img class="flag" src="img/eu.png" alt="">
        <input value="" id="euroField" type="text">
        <span class="currency">EUR</span>
    </div>
        <div class="center-container">
        <img src="img/pfeile.png" alt="" id="tauschen">
    </div>
    <div class="input-container">
        <img class="flag" src="img/usa.png" alt="">
        <input value="" id="usdField" type="text">
        <span class="currency">USD</span>
    </div>
    <div class="center-container">
        <button id="calcEuro">$ Berechnen</button>
        <button id="calcDollar">€ Berechnen</button>
    </div>
</body>
</html>

Es gäbe noch eine dritte Variante wo man nur ein Button hat zum berechnen, aber das geht in diesem Post zu weit - daher nur die beiden Varianten.

Viel Erfolg Maurice

...zur Antwort

Hi Maurice673,

ich würde dir empfehlen die Wert aus dem Eingabefeld in eine Zahl umzuwandeln.

function calc() { let euro = parseFloat(euroField.value); if (!isNaN(euro)) { let result = euro * 1.08; usdField.value = result.toFixed(2).replace(".", ","); } else { usdField.value = "Invalid input"; } }

function calcEuro() { let usd = parseFloat(usdField.value); if (!isNaN(usd)) { let result = usd * 0.92; euroField.value = result.toFixed(2).replace(".", ","); } else { euroField.value = "Invalid input"; } }

Viel Erfolg

...zur Antwort

Hi Tekeli03,

den Begriff Elite-Programmierer gibt es im Allgemeinen nicht, aber ich weiß was du meinst. Wenn du ein Professioneller Entwickler werden möchtest, musst du ein Studium in der Informatik belegen und jahrelange Berufserfahrungen sammeln um sich als "Elite-Programmierer" nennen zu können. Natürlich gibt es auch Profis außerhalb eines Informatikstudiums, aber ein abgeschlossenes Studium(Bachelor und Master) dazu die jahrelange Berufserfahrung, machen dich erst richtig gut.

...zur Antwort

Keiner deiner Domains würde ich dir persönlich empfehlen. Diese Domains würden mich als Besucher/in abschrecken, daher keine gute Idee.

...zur Antwort

Hi Bestimmtnichtso,

ich würde dir empfehlen mit Büchern zu lernen. Der Rheinwerk Verlag bringt sehr gute Bücher heraus zum Thema Webdesign und Webentwicklung.

Wenn du Lernvideos bevorzugst, würde ich dir empfehlen kostenpflichtige Videos auf Udemy oder LinekedIn learning anzuschauen.

Es gibt aber auch die Möglichkeit auf https://wiki.selfhtml.org/wiki/SELFHTML den ganzen Kram zu lernen.

Wünsch dir viel Erfolg beim lernen

...zur Antwort

Hi Inkognito-User,

die Frage kann ich dir beantworten. Diese Seite kann von einer bis zwei Personen erstellt worden sein. Je nach Skills kann man sowas eventuell auch alleine schaffen. Man sollte aber unterscheiden zwischen Webentwicklung und Webdesign. Das Webdesign, wenn es nicht gekauft wurde(Template), extra Zeit kosten und jemand benötigen der davon Ahnung hat. Ich könnte mir vorstellen das ein PHP-Framework wie Yii oder ähnlichen verwendet wurde. Sowas dauert so um die zwei bis drei Wochen für ein Team mit zwei Entwickler und einem Designer.

...zur Antwort

Hi Deputy18,

na klar ist das möglich. Wenn man bestimmte Sicherheitsmechanismen der Seite bzw. vom Webhoster weg lässt. Sei aber hingewiesen das es echt viele Kombinationen sind, die man eingeben könnte. Etliche User verwenden generierte Passwörter die mehr als 12 Stellen haben. Dies könnte langwierig sein.

Ein weiteres Problem ist auch da: Wenn die Seite nicht auf deinem eigenen Webserver läuft, sondern bei einem Webhoster, machst du dich eventuell strafbar und du viele Webhoster schmeißen dich dann raus.

...zur Antwort

Hi DjMEISTER111,

die aufgelistete Daten wurden aus amtlichen Quellen zusammen getragen. Diese kannst du auch über bestimmte öffentliche Portale der jeweiligen Bundesländer abfragen. Ein sehr schönes Beispiel habe ich in Schleswig-Holstein gefunden. Die stellen sogar verschiedene Datenformate zur verfügung - unter anderem in Formaten wie JSON, XML und CSV.

...zur Antwort

Hi Tekeli03,

der Name Software-Entwickler ist nicht geschützt und so kann sich jede bzw. jeder nennen. Du kannst als Quereinsteiger in Firmen arbeiten, aber dafür brauchst sehr viele Skills die man in einerAusbildung oder Studium aufbauen kann. Besonders die Ausbildung ist sehr praxisorientiert.

Wenn du Genie bist und oder jahrelange Beruferfahrungen nachweisen kannst, wird der Einstieg sehr schwer für dich werden.

Es gibt einige Softwareentwickler die es auch ohne Ausbildung und Studium schaffen, aber dafür braucht man mehr als Talent. Es brauch auch Erfahrungen aus dem Studium oder der Ausbildung, die man nicht so leicht ersetzen kann.

Ich würde dir empfehlen eine Ausbildung zu machen wenn du dich für Entwicklung interessierst, auch wenn das Ausbildungsgehalt am Anfang wenig ist.

...zur Antwort

Hallo Hemo20,

tatsächlich gibt es Informatiker die bei HTML von einer Programmiersprache sprechen. Es wäre mir aber zu kompliziert das ganze zu erklären, deswegen finde ich es leichter dieses passende Video dazu zu posten:

https://www.youtube.com/watch?v=4A2mWqLUpzw

Kurz gesagt HTML ist eine Auszeichnungssprache zugleich eine Programmiersprache, wenn man der Argumentation des Professors für Informatik der Universität von Nottingham folgt.

...zur Antwort
Quereinstieg als Frontend Entwickler mit Background in Business Administration fast unmöglich?

Hallo zusammen, ich habe kürzlich meine Weiterbildung als Frontend-Entwickler abgeschlossen und bin nun auf Jobsuche. Trotz des oft berichteten Fachkräftemangels scheint der Markt für Junior-Stellen hart umkämpft zu sein. Meine Bewerbungsunterlagen wurden von der Weiterbildung geprüft, also können sie nicht so schlecht sein.

Ich habe einen B.Sc. in Business Administration und habe vor kurzem meine Weiterbildung zum Frontend-Entwickler abgeschlossen. Ich habe während des Studiums ein Praktikum im Bereich Operations bei einem IT-Startup absolviert und arbeite derzeit wieder dort als Praktikant, diesmal als Frontend-Entwickler. Aus Budgetgründen können sie im Moment keine neuen Mitarbeiter einstellen. Während dieser Zeit plane ich, mich weiter zum Fullstack-Entwickler (TypeScript + React) zu qualifizieren.

Alternativ denke ich darüber nach, ein SAP-Zertifikat zu erwerben, um eine Stelle im SAP-Bereich zu suchen. Hier gibt es wirklich Stellenangebote (Trainee/Junior) ohne Ende.

Eine weitere Option wäre eine Bewerbung als IT-Consultant, obwohl ich das Gefühl habe, dass ich dafür mehr Erfahrung als Entwickler benötige. Wie soll ich Unternehmen beraten, wenn ich selbst keine Ahnung habe?

Es ist frustrierend, nach dem Sparen und Absolvieren der Weiterbildung keine Stelle zu finden, aber ich bleibe optimistisch und offen für Möglichkeiten. Ich hoffe, ihr könnt mir vielleicht ein paar Tipps geben.

Vielen Dank im Voraus

...zum Beitrag

Hi tian007,

eine reine Weiterbildung bringt dir nicht viel - zumindest nicht wenn du auf dem deutschen Arbeitsmarkt dich bewirbst. Hier werden Webentwickler bevorzugt die eine Ausbildung(Mediengestalter/Fachinformatiker) oder sogar ein Studium im Bereich Webententwicklung(Medieninformatik) gemacht haben.

Es ist auch ein Quereinstieg möglich, dafür sollte man aber Skills und Erfahrungen mitbringen. Ohne Ausbildung oder Studium, müsstest du Praktika machen oder Berufserfahrungen vorzeigen können im Bereich Webentwicklung.

...zur Antwort
CSS Klassen mit Javascript ändern?

Hallo!

Obwohl ich schon etwas Erfahrung mit CSS und Javascirpt habe, bin ich gerade das erste mal auf folgendes Problem gestoßen:

Ich habe für eine Website im Kopf in einem <style> - Bereich einige Klassen definiert.
(z.B.:
.header { border:1px outset gray; margin:.5em; padding:.5em; border-radius: 50%; height: 8%; width: 90%; }
und unten im body dann:
 <div class="header">)
Den Stil dieser Klassen will ich durch Javascript dynamisch ändern.
Javascript soll also nicht den style von einzelnen HTML-Elementen ändern, und auch nicht HTML-Elementen neue Klassen zuweisen. Vielmehr soll der Stil der Klasse direkt geändert werden, so daß sich die Änderung auf alle Elemente dieser Klasse auswirkt.

Konkret möchte ich das Layout dynamisch an die Größe des Browserfensters anpassen. Ein onResize Eventhandler im Body löst eine Javascript-Funktion aus, die entsprechende Änderungen im Layout vornimmt. Dabei wäre es natürlich praktisch, wenn man ähnlich aussehende Elemente (= gleiche class = gleicher CSS-style) auch zusammen anpassen könnte, und zwar auch mit errechneten Werten (z.B. Math.floor(clientHeight / 2)).

Habe lange gegoogelt und auf den üblichen Plattformen gesucht, habe aber immer nur Anleitungen gefunden, wie man Elementen neue Klassen zuweist.

Im Moment löse ich das Problem mit einer for-Schleife:
const AllHeaders = document.getElementsByClassName("header");
for (let i = 0; i < AllHeaders.length; i++) {
var Radius = Math.floor(AllHeaders[i].clientHeight / 2)
AllHeaders[i].style.borderRadius = Radius.toString() + "px";
}
und so weiter, für alle Klassen einzeln.
Das kann irgendwie doch nicht die beste Lösung sein...
Es muß doch eine Möglichkeit geben, auf die Klassen-Definitionen im Stylesheet mit Javascript zuizugreifen. Ansonsten wäre die Funktionalität von CSS doch stark eingeschränkt.

Hoffe, jemand kennt sich aus...

...zum Beitrag

Hi Dungeoneer,

es gibt leichtere Wege um eine Lösung für dein Problem zu generieren. Schaue mal die anderen Antworten der Community zu deiner Frage an. Aber ich möchte dir gerne auch teils deine Frage beantworten wie man mithilfe von JavaScript CSS-Klassen und deren Eigenschaften und Werte ändern kann. Dafür gibt es eine interesannte Lösung.

Hier ein Beispiel von mir in JavaScript:

'use strict';
let stylesheet;
document.addEventListener("DOMContentLoaded", function() {
    stylesheet = document.styleSheets[0];
    for (var i = 0; i < stylesheet.cssRules.length; i++) {
        let rule = stylesheet.cssRules[i];
        if (rule.selectorText === '.my-class') {
            rule.style.color = 'red';
            rule.style.backgroundColor = 'yellow';
        }
    }
});

Hier die Links zum Thema:

https://developer.mozilla.org/en-US/docs/Web/API/Document/styleSheets

https://www.mediaevent.de/javascript/insert-remove-rule.html

Ich hoffe diese Antwort hilft dir das besser zu verstehen. Ich würde dir aber empfehlen andere Wege zu gehen. Zwar ist es nicht falsch mit JavaScript CSS-Eigenschaften aus Klassen zu ändern, aber es wäre besser andere Wege und Methoden zu gehen, um dein Problem zu lösen.

Viel Erfolg Dungeoneer

...zur Antwort

Hi anonymous08106,

ich würde dir für dein Informatikstudium einen Thinkpad empfehlen. Dieser ist robust und bietet alle Features die du für das Studium brauchst. Ich würde dir empfehlen beim Betriebssystem zweigleisig zu fahren und Microsoft Windows als auch Linux auf eine Maschine/Thinkpad zu installieren.

Ein Macbook kostet viel und das Preisleistungsverhältnis ist sehr hoch, auch wenn MacOS an die Hardware angepasst ist und damit in vielen Fällen effizienter ist, so hat man auch sehr viele Nachteile. Bei der Verarbeitung muss man aber es positiv nehmen. Ich kann dir als Student aber das nicht empfehlen und es werden unnötig Kosten enstehen. Meine Empfehlung geht daher von Apple-Produkten weg.

Auch aus eigener Erfahrung heraus weiß ich die Vor- und Nachteile zu schätzen. Ich bin kein Student, aber arbeite in der Entwicklung tagtäglich mit mobielen Endgeräten und dazu zählt auch das Thinkpad.

...zur Antwort