Tools | Code-Inside Blog

HowTo: Senden von Emails testen mit Smtp4Dev

18. Jul, 2010 by Robert Mühsig Kein Kommentar

Vor einer ganzen Weile habe ich bereits darüber gebloggt, wie man das Email-Senden ohne einen richtigen SMTP Server auf seinem Entwickler PC testen kann. Über diverse Blogposts, z.B. dem hier von Alex, bin ich auf Smtp4Dev gestoßen. Fazit: Funktioniert gut & ungemein praktisch.

Firefox 3 – erster Eindruck

17. Jun, 2008 by Robert Mühsig 12 Kommentare

Firefox 3 ist heute erschienen. Natürlich hab ich ihn gleich mal runtergeladen.

Mein erster Eindruck: Nett, nichts weltbewegendes. Schneller auch nicht wirklich (bzw. kann ich es jetzt noch nicht direkt sagen, allerdings funktioniert bei mir erstmal die personalisierte Windows Live Seite nicht )
Die Installation ging ohne Probleme, allerdings gehen momentan nicht alle Addons:

Erster Gedanke als Firebug nicht aktiviert war: “Och nö…”

Ansonsten ist das ein oder andere Feature ganz nett – ich denke auch, dass die Plugins nachziehen werden.

Daher Fazit: Solange IETab und Firebug nicht geht, wird er nicht auf meinem Arbeitsrechner installiert werden.

HowTo: Visual Studio 2005 für .NET 3.0 (WPF, WCF, WF) rüsten

30. Okt, 2007 by Robert Mühsig 1 Kommentar

Zwar ist das .NET Framework in der Version 3.0 schon eine Weile raus, allerdings ist Toolunterstützung noch nicht ganz ideal.
Es gibt zwar die Expression Serie, allerdings kostet der Spaß auch was. Eine andere Möglichkeit ist die Beta von Visual Studio 2008.

Wer allerdings weiter mit Visual Studio 2005 nutzen möchte, benötigt folgende 2 Addons:

Für WindowsPresentationFoundation & WindowsCommunicationFounation

Visual Studio 2005 extensions for .NET Framework 3.0 (WCF & WPF), November 2006 CTP

Nach der Installation gibt es neue Projektvorlagen für das .NET Framework 3.0:

Was besonder hervorzuheben ist, ist der Splitscreen zwischen der XAML und der Designansicht.

Zwar gibt es in der Toolbox Controls zur Auswahl – aber ich kann sie irgendwie nicht per Drag`n`Drop reinziehen – schade (oder ich mach was falsch).

Jedenfalls kann man immerhin mal in dem XAML austoben:

Die restlichen Teile sind so ziemlich normale Projektvorlagen (zu WCF) bzw. bieten diesen XAML Splitscreen.

Für WindowsWorkflowFoundation

Visual Studio 2005 extensions for .NET Framework 3.0 (Windows Workflow Foundation)

Auch hier gibts neue Projektvorlagen:

… und auch wie bei den anderen Extensions, gibt es auch hier eine Besonderheit:

Der Workflow Designer erlaubt es aus einer fülle von Controls sich seinen Workflow zu erstellen:

(… und noch mehr Controls, welche nicht zu sehen sind)

Fazit:

Für WPF Entwickler würde ich entweder VS 2008 und insbesondere wenn es tolle GUIs werden sollen zu Expression Blend raten – zwar kann man alles per Hand machen, allerdings ist es nicht wirklich elegant und macht sehr viel Arbeit.
Tiefergehend in die WF Entwickler habe ich noch nicht reingesehen, sodass ich dies noch nicht beurteilen kann – für WCF Anwendungen sind die Vorlagen eigentlich auch nicht zwingend notwendig, aber eine nette Spielerei.

Links:

Expression Serie
Visual Studio 2008
Visual Studio 2005 extensions for .NET Framework 3.0 (WCF & WPF), November 2006 CTP
Visual Studio 2005 extensions for .NET Framework 3.0 (Windows Workflow Foundation)

Neues HowTo: Javascript debuggen ist anstrengend…

17. Okt, 2007 by Robert Mühsig Kein Kommentar

… muss es aber nicht. Jedenfalls gibt es kleine Helferlein.

In dem neuen HowTo geht es genau daraum: Was sind die “wichtigesten” Tools und was können sie ganz grob.

[Hier gehts zum HowTo]

HowTo: Webanwendung debuggen (Javascript & HTML debuggen mit den entsprechenden Tools)

17. Okt, 2007 by Robert Mühsig Kein Kommentar

Eine normale Webseite zu erstellen geht sehr schnell. Doch heutige Webanwendungen sind seit AJAX und dem ganzen Web 2.0 Spielerein doch immer komplexer geworden. Dazu kommt die Anforderung, dass alle Seiten am Besten in jedem Browser gleich aussehen und ebenfalls auch gleich funktionieren soll.

Da Javascript generell eine eher unschöne Sprache ist, da es nur sehr wenig gute Tools gibt, die einem das Debuggen erleichtern und auch in jedem Browser anders interpretiert wird, braucht man wenigstens gewisse Anhaltspunkte zum Lösen des Problems.
In dem HowTo sollen ein paar Tipps vorgestellt werden, die mir bisher bei den meisten Problemen geholfen haben.

Tools die man als guter Webdesigner braucht:

Als Browser sollte man (je nach Anforderung) diese installiert haben:

- Internet Explorer 7 / Internet Explorer 6

Tipp für den IE6: Wer bereits den IE7 installiert hat, kann sich den IE6 zum Beispiel als Virtual Maschine nochmal installieren.
Das IE Team bietet dazu eine bis zum Dezember gültige Version an (Voraussetzung Virtual PC)
- Firefox 2
- Opera 9

Wer einen Mac hat (die PC Version nehm ich bis jetzt noch nicht wirklich ernst) sollte auch unter dem Safari schauen.

Folgende AddOns sollte man ebenfalls dazu installieren:

Internet Explorer

Internet Explorer Developer Toolbar (Development Tool)

Die IE Developer Toolbar gibt einen Einblick in die DOM und man kann so untersuchen, wie der IE es interpretiert.

Wer die Toolbar nicht findet, obwohl er sie installiert hat, einfach unter Ansicht / Explorer-Leiste nachschauen:

Die IE Developer Toolbar in Aktion:

Im unteren Bereich sieht man die DOM wie der IE sieht sieht – und umrahmt z.B. das gerade angeklickte Element und zeigt dessen Attribtute & Styles.

Das wäre es erstmal für den IE an den wichtigen Addons.

Firefox

IE Tab (Render Tool)

Für den Firefox gibts wohl die meisten praktischen Entwicklertools – welche einem sehr viele Sachen abnehmen.
Fangen wir mit einem kleinen Plugin an, welches wahrscheinlich für die am nützlichsten ist, welche den IE garnicht mögen: IE Tab. Es zeigt Websites mit der IE Render Engine an.

(Momentan ist Firefox/Gecko Rendering aktiviert)

Und nun umschalten auf IE Rendering:

Als Beweis das es funktioniert ein Screenshot von Microsofts Outlook Web Access (mit Firefox Rendering sieht es für gewöhnlich um Längen schlechter aus) :

Das nächste Tool lässt schonmal das Herz des Webdesigners höher schlagen.

Web Developer Toolbar

Die Toolbar bietet sehr viele Möglichkeiten um zu sehen, wie die Seite generell aufgebaut ist. So kann man (ähnlich wie die IE Development Toolbar) Tabellen oder Divs umrahmen lassen oder über ein Mouse-Over-Effekt sehen, welchen Style ein Element hat. Man kann über die Toolbar auch den Cache oder Javascript ausschalten, den Style ausschalten, sich ein Lineal einblenden lassen, Link-/Bildpfade anzeigen, Details zu den Formularen auf der Seite und und und…

Beachte: Das Bild Element ist umrahmt und es wird angezeigt wo der Link verweißt (das Gelbe).

Das Tool fest schonmal mehr als die IE Development Toolbar, aber es geht noch netter:

Firebug

Mittels Firebug kann man, ähnlich wie mit der Toolbar, auch direkt mit einem Mouse-Over die Seite untersuchen und die jeweiligen Elemente werden dann umrahmt und auch die komplette DOM kann eingesehen werden.
Was an Firebug noch besonders ist: Änderungen im Code können direkt eingefügt werden, sodass ein F5 oder ähnliches entfällt. Sehr elegant, wenn man mal wieder ein Style Attribute ändern/suchen muss, damit es überall gleich aussieht.

Im unteren Teil sieht man gut, wie Firebug aufgebaut ist – es gibt mehrere Reiter.

Ein paar Bestandteile mal kurz erklärt:

HTML:

Einsicht in die CSS Eigenschaften des jeweiligen Elements (Rechts daneben)
Editieren des Styles etc.

CSS:

Einsicht in die CSS Datein
Ebenfalls editierbar

Script:

Kompletter Javascript Debugger (!!!)
Wie in Visual Studio kann man Breakpoints setzen (Beispiel ist von der Virtual Earth Demopage) und sofort die Ergebnisseund die DOM sehen

DOM:

Wie der Name schon verrät: Einsicht in die DOM (siehe Script – Rechter Teil)

NET:

Um mal zu sehen, wie lange ein Request dauert oder was als Request und Response Parameter gesendet wird ist dieser Reiter Ideal

Als letztes sei noch Yahoos YSlow Erweiterung für Firebug zu erwähnen.
Diese gibt Performancetipps welche auf der Yahoo Seite einsehbar sind oder einen Status darüber, wieviel Daten beim Aufruf gesendet werden etc.