tutorials.de Buch-Aktion 05/2012
  • Webmaster & Internet

    Webmaster & Internet
  • HTML/CSS und Javascripte gemeinsam erarbeiten


    Es war einmal.. na gut, wir fangen anders an. Nicht immer sind Programmierfehler offensichtlich, während syntaktische Fehler noch schnell gefunden werden können, ist es mit logischen Fehlern nicht immer ganz so einfach. Wer hat sich nicht geärgert, dass das Helfen bei Codingproblemen oft mit Copy&Paste anfängt? Code des Hilfesuchenden lokal speichern, grob bereinigen/auffüllen, dann starten und sehen, wo das Problem ist. Hier kommt

    JSFiddle

    ins Spiel. Eine Webseite, mit der man ohne großen Aufwand HTML, CSS und auch Javascript mit Libraries/Frameworks und externen CSS/JS-Daten austesten kann. Das große Plus ist die Speichermöglichkeit (ohne Anmeldung) inklusive Versionierung. So können mehrere Helfer gleichzeitig daran arbeiten bzw. eine Lösung als Link zurückgeben.

    Beispiel Ein User hat noch keine Ahnung von jQuery und möchte erfahren, wie man mit einem Button andere Divs ein- und ausblendet. Das ist zugegeben ein simples Beispiel (und ein Hinweis, dass der Hilfesuchende bis Dato keinen Schritt gewagt hat, sich mal in die Materie reinzulesen aber leider sehr real.

    http://jsfiddle.net/Mtpva/

    Der User formuliert kurz seine Frage, und anstatt den Code hier wiederzugeben, packt er jenen gleich in eine Arbeitsumgebung und verlinkt auf diese, in welcher Helfer den richtigen Weg weisen, indem sie das Beispiel auffüllen. So könnte schon der nächste Eintrag

    http://jsfiddle.net/Mtpva/2/

    sein, in welchem ein helfender User ein simples JS-Script mit dem jQuery-Framework einbindet. (Update-Knopf) - Der nächste User zeigt auch noch, dass anstatt des An- und Ausschaltens auch noch schönere Dinge gehen, so entsteht der nächste Eintrag mit einem weiteren Beispiel.

    http://jsfiddle.net/Mtpva/5/

    Kurzum, JsFiddle.net ist ein sehr brauchbarer Ansatz für beide Seiten - dem Hilfesuchenden, wie auch dem Helfer - schneller und "ordentlicher" zum Ziel zu kommen. Dennoch meine Bitte, das Ergebnis auch hier noch (in Code- oder html-Tags!) zu veröffentlichen, damit
    • der Forenstöberer ohne externe Seite ein Ergebnis zu sehen bekommt
    • der Lösungsweg nicht verloren geht, ich hab nämlich keine Ahnung, wie lange Scripts in jsfiddle gespeichert bleiben

    Viel Spaß mit dem Fund.
    mfg chmee
    Markus Kolletzky, Frezl, sheel und 2 weitere bedanken sich. 


    Kommentare 6 Kommentare
    1. Avatar von Frezl
      Frezl -
      Sehr geiles Tool! Vielen Dank! Letztens hab ich mir von nem Kumpel was mit jQuery erklären lassen, das hat er mir über die Desktop-Ansicht in Skype gezeigt. Das ist n ******, im Vergleich zu jsfiddle :-D

      Grüße,
      Frezl
    1. Avatar von chmee
      chmee -
      Übrigens hat dieser Text einen Blabla-Index von 0.1!
      Er muß also gut sein

      http://www.blablameter.de/index.php
    1. Avatar von GelbesKüken
      GelbesKüken -
      @Frezl :
      Also ich weiß nicht was du als *** bezeichnest ob nun das Remote Programm im Gegensatz zu einem Webeditor oder jQuery im Vergleich zu JSFIDDLE.

      Beide Aussagen sind jedoch falsch.
      Ein Remote Programm ist dafür da um auf fremde PCs zuzugreifen, normalerweise für administrative Zwecke. Natürlich kann man so jemanden etwas besser erklären, als wenn man den Quelltext per Messenger schreibt und auch ziemlich jede andere Methode. Jedoch vergleichst du da Äpfel mit Autos...

      Solltest du meinen das JSFIDDLE besser ist als jQuerx, hast du das gesamte Programm nicht verstanden, daher werde ich es nicht weiter erläutern.

      --

      Ein Tutorial ist es nicht wirklich, sondern eher eine Beschreibung eines Programm mit der man viel gutes machen kann. Das Programm selber ist Top, aber das wäre so als würde jemand ein Tutorial schreiben über die Positiven Aspekte von n++ oder dreamweaver etc..

      Ich hoffe das der Autor selber mitgeschrieben hat an dem Programm und hierdurch Werbung und Backlinks generiert, ansonsten kann ich es nicht wirklich verstehen, aus den genannten Gründen.

      Das kann jeder so sehen wie er/sie will, aber ein einfacher Forenbeitrag hätte es wohl auch getan.
    1. Avatar von Markus Kolletzky
      Markus Kolletzky -
      Und wieso sollte man nicht in einem Artikel auf ein Tool hinweisen, was dem einen oder anderen sicher nützlich erscheint?
    1. Avatar von wollmaus
      wollmaus -
      @Küken:
      Möglicherweise erschliesst sich dir mit satten 15 Wortmeldungen in 4 Jahren nicht der enorme Nutzen von Tools wie jsfiddle für ein Forum wie Tutorials.de(vergleichbares gibt es ja auch für andere Sprachen).

      Hier gibt es 100tausende Postings, in sehr vielen Themen gibt es Codeschnipsel an denen hin-und her-gebastelt wird, man müllt sich den PC daheim zu etc.

      Da ist jsfiddle besonders hier mehr als einen kurzen Forenbeitrag wert, denke ich.
    1. Avatar von ComFreek
      ComFreek -
      Eine Erwähnung wert finde ich auch codepad: http://codepad.org. Dort kann man u.a. C++, PHP, D, Python und Perl ausführen. Genau wie jsFiddle kann man dort auch URLs für seine Posts verschicken.
    Kommentare Kommentar schreiben

    Klicke hier, um dich anzumelden

    Was ist grün und kann quaken?