JavaScript – die besten Beiträge

Brauche ich einen anderen Weg um besser im programmieren zu werden?

In den letzten Monaten komme ich immer wieder in die selbe Spirale.

In der such ich ständig nach Projekten, fange sie an, beende sie nicht und dann suche ich wieder Projekte, um mich zu motivieren.

Mein Ziel ist es, eine Karriere in der Embedded-Programmierung zu machen. Ich habe auch einige Projekte gemacht (auch mit einigen selbstentwickelten PCBs in den letzten zwei Jahren), aber ich habe immer das Gefühl, dass ich länger damit beschäftigt bin, das Hardware-Projekt zu machen, anstatt die Software zu schreiben.

Oder:

Die Hardware ist für mich ziemlich komplex und die Software scheint dann ziemlich einfach zu sein. Ich habe zum Beispiel eine eigene Wetterstation gebaut. Es hat mich viel Zeit gekostet, die Platine mit den verschiedenen Sensoren zu planen und zu entwerfen, und dann war die Hardware in zwei Tagen fertig, weil es nur darum ging, ein paar Daten zu übertragen und sie auf einem Display darzustellen.

Mein Ziel ist es, mich mit schwierigen Softwareaufgaben zu beschäftigen, die nicht so viel mit Hardware zu tun haben. So kann ich mich darauf konzentrieren, größere Projekte zu planen und in die Struktur einzusteigen (was für mich meistens sehr schwer zu verstehen ist, wenn ich mir einige Open-Source-Code-Beispiele ansehe).

Ich komme dann immer an den Punkt, an dem ich darüber nachdenke, von C auf etwas wie Javascript oder Python umzusteigen, damit ich wirklich Software-Projekte machen und mit dem Programmieren ohne Hardware vorankommen kann. Aber dann komme ich mir immer blöd vor, weil ich das Gefühl habe, dass mich das nicht weiterbringt, wenn auf mein Karriereziel erreichen hinarbeite.

Ich habe die meisten meiner Projekte auf STM32-Basis gemacht und ich habe auch ein okayes Verständnis der HAL-Bibliothek, wie man die Dokumentation liest usw. Aber wenn ich darüber nachdenke, eine Art von Algorithmus zu implementieren, fühle ich mich so verloren und weiß nicht, wo ich anfangen soll, und das ist, was ich wirklich üben möchte. Aber die Hardware bremmst mich da immer ab.

Andererseits denke ich, dass ein Wechsel zu Javascript oder Python, um meine Problemlösungsfähigkeiten zu verbessern, am Ende besser sein wird, weil ich dann einfach mehr Code schreiben würde als in der Phase, in der ich jetzt feststecke je schreiben würde.

Keine Projekte und kein Fortschritt in meinen Problemlösungsfähigkeiten...

Ich weiß wirklich nicht, wie ich diese Phase überwinden soll... Hatte sonst noch jemand solche Probleme?

programmieren, JavaScript

Wie erstelle ich eine simple HTML Website mit Github Pages?

Moin,

ich verstehs wirklich nicht. Habs jetzt online als auch mit dem Github Desktop Client versucht und ich kriegs nicht hin. Es gibt Videos von vor 3 Jahren die das erklären, dann die offizielle Erklärung von Github selbst und die Erklärung von ChatGPT und nichts scheint zu funktionieren.

Ich versuch mal zu erklären was ich versucht habe: Scheinbar muss ich meinen Benutzername als Name meines Repositories angeben und in diesem Format schreiben: username.github.io. Mein Username ist beispielsweise jetzt Johannes623, das heißt meine Repository soll johannes623.github.io heißen. Außerdem soll die Repository öffentlich sein und eine README-File enthalten. Soweit so gut.

Als nächstet aktiviert man Github Pages in den Einstellungen. Dort wählt man dann "Deploy from a branch" und dann "main und /root" als Branch aus. Jetzt geht man zurück zur README-Datei und fügt dort den Code der Website ein. Danach geht man zurück zur Github Pages Seite und schaut ob die Website unter der Domain erreichbar ist.

So wurde es mir erklärt. Problem ist nur, dass all das hier nicht funktioniert.

Kann mir jemand sehr simpel und strukturiert erklären, wie ich es hinbekomme eine Website zu erstellen? Und am besten noch dazu erklären, wie ich eine Custom Domain zu dieser Website hinzufügen kann? (Hab eine bei einem anderen Anbieter gekauft).

Vielen vielen Dank schonmal im Vorraus!!

Homepage, HTML, Webseite, CSS, JavaScript, Code, Webdesign, Webentwicklung, Webhosting, github

JavaScript: Wie kann ich Daten zwischen zwei Dateien verteilen?

Hallo zusammen,

ich bitte euch um Hilfe bei meinem Problem. Und zwar muss ich im Studium eine Seite so nachbauen, dass ich mittels einer Filterauswahl eine Liste ausgeben kann.

Letztens haben wir gelernt, dass wir den Code anhand Komponenten aufteilen sollen. Ich habe also die Komponenten Titelleiste (wo der Filter, Logo und Titel enthalten sein sollte), Tabelle und Filter erstellt.

Zudem gibt es ja diese Hauptdatei App.js. In einem ersten Schritt habe ich in der Filter.js Funktionen geschrieben, um meine Daten gemäß der möglichen Suchbegriffe zu filtern und habe den aktuellen Wert, welcher vom Nutzer gewählt wird, in einem useState abgespeichert.

Wie kann ich diesen Wert nun der Tabelle.js übergeben, damit dort anhand der Filterung die Ausgabe generiert werden kann?

ChatGPT hat mir geraten, die Daten zuerst in die App.js zu schreiben. Aber wie geht das? Wie komme ich von einem Child in das Parent?

Ich denke, ihr erkennt, dass ich leider noch sehr unerfahren im Programmieren bin.

Folgend die Codes:

App.js:

const Titelseite = () => {
  return (
    <div className="titelseite-container">
      <BasicTable />
    </div>
  );
};

const Tabelle = () => {
  return (
    <div className="tabelle">
      <div>Tabellenleiste</div>
    </div>
  );
};

function App() {
  const [service_ausg, setService] = useState("");
  const [anbieter_ausg, setAnbieter] = useState("");
  const handleServiceChange = (value) => {
    setService(value);
  };
  const handleAnbieterChange = (e) => {
    setAnbieter(e);
  };

  return (
    <div className="App">
      <Titelleiste>
        <Filter
          onChangeService={handleServiceChange}
          onChangeAnbieter={handleAnbieterChange}
        />
        <BasicTable />
      </Titelleiste>
      <Titelseite />
    </div>
  );
}

export default App;

Titelleiste.js:

import Grid from "@mui/material/Grid2";
import { Filter } from "./Filter";
import { useState } from "react";
import data from "./data/tableData.json";

export const Titelleiste = () => {
  const getData = (data) => {
    console.log("Ich bin in Titelleiste und komme von Filter");
  };

  return (
    <Grid container spacing={2}>
      <Grid item size={4}>
        <p>
          <img src="geoharvester.png" width="100px" height="50px" />
        </p>
      </Grid>
      <Grid item size={4}>
        <p>Ein Katalog für schweizer Geodienste</p>
      </Grid>
      <Grid item size={4} container justifyContent="flex-end">
        <p>
          <Filter onChange={getData} />
        </p>
      </Grid>
    </Grid>
  );
};

Filter.js :

import "./App.css";
import { useState } from "react";
import InputLabel from "@mui/material/InputLabel";
import MenuItem from "@mui/material/MenuItem";
import FormHelperText from "@mui/material/FormHelperText";
import FormControl from "@mui/material/FormControl";
import Select from "@mui/material/Select";
import data from "./data/tableData.json";
import { App } from "./App";

export const Filter = ({ onChangeService, onChangeAnbieter }) => {
  let array_service = data.map((element) => element.service);
  let array_service_ausg = [...new Set(array_service)]; //* new "Set", entfernt automatisch die Duplikate und erstellt ein neues Objekt. Das neue Objekt wird mittels den "..." in eine Liste gespeichert
  let array_anbieter = data.map((element) => element.anbieter);
  let array_anbieter_ausg = [...new Set(array_anbieter)];
  const funService = (e) => {
    const [service_ausg, setService] = useState("");
    setService(e.target.value);
  };
  const funAnbieter = (e) => {
    TransferAnbieter(e.target.value);
  };

  return (
    <div>
      <form>
        <Select name="service" onChange={funService} sx={{ width: 100 }}>
          {array_service_ausg.map((service) => (
            <MenuItem value={service}>{service}</MenuItem>
          ))}
        </Select>
      </form>
      <Select name="anbieter" onChange={funAnbieter} sx={{ width: 100 }}>
        {array_anbieter_ausg.map((anbieter) => (
          <MenuItem value={anbieter}>{anbieter}</MenuItem>
        ))}
      </Select>
      <br />
    </div>
  );
};

Nach einigen Stunden, die ich bereits in die Recherche meines Problems investiert habe, danke ich euch herzlich für eure Hilfe.

Bild zum Beitrag
HTML, IT, Webseite, JavaScript, HTML5, Code, Informatik, Programmiersprache, Softwareentwicklung, Webentwicklung, Frontend, React

Meistgelesene Beiträge zum Thema JavaScript