„Wenn ein Arbeiter seine Arbeit gut machen will, muss er zuerst seine Werkzeuge schärfen.“ – Konfuzius, „Die Gespräche des Konfuzius. Lu Linggong“
Titelseite > Programmierung > HTML-, CSS- und JavaScript-Projekte

HTML-, CSS- und JavaScript-Projekte

Veröffentlicht am 03.11.2024
Durchsuche:913

HTML, CSS, and JavaScript Projects

Willkommen in meiner Sammlung von HTML-, CSS- und JavaScript-Projekten! Dieser Blogbeitrag bietet einen umfassenden Überblick über verschiedene von mir erstellte Projekte und stellt verschiedene Aspekte der Webentwicklung vor. Jedes Projekt ist in einem eigenen Repository verfügbar, das den gesamten Code enthält, den Sie zum Erkunden und Lernen benötigen.

Inhaltsverzeichnis

  • Einführung
  • Projektübersicht
  • Erste Schritte
  • Beitrag leisten
  • Autor

Einführung

Als Webentwickler arbeite ich gerne an einer Vielzahl von Projekten, die mir dabei helfen, meine Fähigkeiten in HTML, CSS und JavaScript zu verfeinern. Von einfachen Taschenrechnern bis hin zu komplexeren Anwendungen demonstrieren diese Projekte verschiedene Techniken und Best Practices in der Webentwicklung. Unten finden Sie eine kuratierte Liste von Projekten, jedes mit einem Link zum jeweiligen GitHub-Repository.

Projektübersicht

Hier ist eine Übersicht der Projekte, an denen ich gearbeitet habe:

  1. Abhi ki News

    • Eine Nachrichtenanwendung, die die neuesten Schlagzeilen zusammenfasst und anzeigt.
    • Code anzeigen
  2. Beratungsgenerator

    • Generiert zufällige Ratschläge, um Benutzern hilfreiche Tipps zu geben.
    • Code anzeigen
  3. Altersrechner

    • Ein Tool zur Berechnung des Alters basierend auf der Eingabe des Geburtsdatums.
    • Code anzeigen
  4. Analoguhr

    • Zeigt eine funktionsfähige Analoguhr mit JavaScript an.
    • Code anzeigen
  5. Artikelkarte

    • Eine stilisierte Kartenkomponente zur Präsentation von Artikeln.
    • Code anzeigen
  6. BMI-Rechner

    • Berechnet den Body-Mass-Index basierend auf Benutzereingaben.
    • Code anzeigen
  7. Countdown-Timer

    • Ein Timer, der bis zu einem bestimmten Datum und einer bestimmten Uhrzeit herunterzählt.
    • Code anzeigen
  8. Würfelwurfsimulator

    • Simuliert Würfeln mit einem Zufallszahlengenerator.
    • Code anzeigen
  9. Schlagzeug

    • Ein virtuelles Schlagzeug, mit dem Benutzer verschiedene Schlagzeugklänge spielen können.
    • Code anzeigen
  10. FAQ Akkordeon

    • Ein FAQ-Bereich im Akkordeon-Stil für Websites.
    • Code anzeigen
  11. Münze werfen

    • Eine einfache Münzwurfsimulation.
    • Code anzeigen
  12. Fokus auf den Tag

    • Hilft Benutzern, sich mit einer fokussierten Benutzeroberfläche auf tägliche Aufgaben zu konzentrieren.
    • Code anzeigen
  13. Feinschmecker-Hamburger

    • Ein stilvolles Hamburger-Menü für Websites zum Thema Essen.
    • Code anzeigen
  14. Kreditrechner

    • Berechnet Kreditrückzahlungen basierend auf Benutzereingaben.
    • Code anzeigen
  15. Anmeldeformular

    • Ein einfaches Anmeldeformular mit Formularvalidierung.
    • Code anzeigen
  16. Monatskalender

    • Zeigt einen Kalender für einen bestimmten Monat an.
    • Code anzeigen
  17. Hypothekenrechner

    • Berechnet Hypothekenzahlungen basierend auf verschiedenen Eingaben.
    • Code anzeigen
  18. News-Homepage

    • Ein Homepage-Layout für eine Nachrichten-Website.
    • Code anzeigen
  19. Newsletter-Anmeldeformular

    • Ein Formular für Benutzer zum Abonnieren von Newslettern.
    • Code anzeigen
  20. Passwortgenerator

    • Generiert sichere Passwörter mit anpassbaren Optionen.
    • Code anzeigen
  21. Pomodoro-Timer

    • Ein Timer zur Steigerung der Produktivität mithilfe der Pomodoro-Technik.
    • Code anzeigen
  22. Profilkarte

    • Eine Kartenkomponente zur Anzeige von Benutzerprofilen.
    • Code anzeigen
  23. QR-Code-Generator

    • Generiert QR-Codes basierend auf Benutzereingaben.
    • Code anzeigen
  24. Stein-Papier-Schere

    • Ein in JavaScript implementiertes Stein-Papier-Schere-Spiel.
    • Code anzeigen
  25. Einfacher Rechner

    • Ein einfacher Rechner zur Durchführung arithmetischer Operationen.
    • Code anzeigen
  26. Sneakers E-Commerce

    • Eine E-Commerce-Seite für Sneaker mit Produktlisten.
    • Code anzeigen
  27. Temperaturkonverter

    • Rechnet Temperaturen zwischen Celsius, Fahrenheit und Kelvin um.
    • Code anzeigen
  28. Referenzen-Slider

    • Eine Slider-Komponente zum Anzeigen von Benutzerreferenzen.
    • Code anzeigen
  29. Text-to-Speech-Generator

    • Konvertiert Texteingaben mithilfe der Web Speech API in gesprochene Wörter.
    • Code anzeigen
  30. Tic-Tac-Toe

    • Ein klassisches Tic-Tac-Toe-Spiel, implementiert in JavaScript.
    • Code anzeigen
  31. Trinkgeldrechner

    • Berechnet den Trinkgeldbetrag basierend auf der Rechnung und dem Trinkgeldprozentsatz.
    • Code anzeigen

32

. Todo-Liste
- Eine einfache To-Do-Listen-Anwendung zum Verwalten von Aufgaben.
- Code anzeigen

  1. Gewichtsumrechner
    • Rechnet Gewichte zwischen verschiedenen Einheiten um.
    • Code anzeigen

Erste Schritte

Um eines dieser Projekte zu klonen und lokal auszuführen, befolgen Sie diese Schritte:

  1. Das Repository klonen:
   git clone https://github.com/abhishekgurjar-in/html-css-javascript-projects.git
  1. Navigieren Sie zum Projektverzeichnis:
   cd 
  1. Öffnen Sie das Projekt in Ihrem Browser: Öffnen Sie die Datei index.html in Ihrem Browser, um das Projekt in Aktion zu sehen.

Mitwirken

Wenn Sie zu einem dieser Projekte beitragen möchten, befolgen Sie bitte diese Richtlinien:

  1. Forken Sie das Repository.
  2. Erstellen Sie einen neuen Zweig für Ihre Änderungen.
  3. Übernehmen Sie Ihre Änderungen und übertragen Sie sie in Ihr gespaltenes Repository.
  4. Erstellen Sie eine Pull-Anfrage mit einer Beschreibung Ihrer Änderungen.

Autor

Abhishek Gurjar

Freigabeerklärung Dieser Artikel wird unter: https://dev.to/abhishekgurjar/html-css-and-javascript-projects-3b6e?1 reproduziert, wenn es zu Verstößen besteht. Bitte wenden Sie sich an [email protected], um ihn zu löschen.
Neuestes Tutorial Mehr>

Haftungsausschluss: Alle bereitgestellten Ressourcen stammen teilweise aus dem Internet. Wenn eine Verletzung Ihres Urheberrechts oder anderer Rechte und Interessen vorliegt, erläutern Sie bitte die detaillierten Gründe und legen Sie einen Nachweis des Urheberrechts oder Ihrer Rechte und Interessen vor und senden Sie ihn dann an die E-Mail-Adresse: [email protected] Wir werden die Angelegenheit so schnell wie möglich für Sie erledigen.

Copyright© 2022 湘ICP备2022001581号-3