Archive for the ‘howto’ Category

Great JavaScript Performance Video

Dienstag, März 30th, 2010

Hier ist ein sehr cooles JavaScript Video. Es geht um Performance von JavaScript und als Web-Entwickler kommt man nicht an JavaScript vorbei und v.a. ist JavaScript nicht böse, auch wenn manche immer noch der Meinung sind. Ihr habt den Knall nicht gehört…

Have fun (via)

PhpDocumentor unter Xampp (Windows 7)

Sonntag, März 21st, 2010

Hallo,

nach einer kleinen Pause soll es jetzt wieder weiter gehen mit hilfreichen Blogeinträgen (jetzt habe ich ja Unterstützung siehe Beitrag vor diesem).

Heute geht es um eine kurze Anleitung, wie man in ein paar Schritten unter xampp(lite) PhpDocumentor installiert und natürlich anschließend nutzen kann.

Ich setze voraus, dass xampp oder in meinem Fall xampplite installiert ist.

Und los gehts:

Als erstes setzen wir mal, falls noch nicht getan php in die PATH-Variable von Windows, d.h. rechts Klick auf den Arbeitsplatz, dann Eigenschaften anklicken und dann “Erweiterte System Einstellungen” (ich nutze kein deutsches Windows, aber so ähnlich müsste der Button heißen). Dann unter Erweitert (Advanced) auf Systemvariablen und dann bei PATH (nicht alles löschen!!!) sondern einfach folgendes hinzufügen:

;C:\xampplite\php

(der Semikolon dient hier als Trenner zwischen den angegeben Pfaden)

Jetzt können wir in der cmd.exe auf alle Programme unter C:\xampplite\php zugreifen, also auch auf PEAR. Erstmal müssen wir PEAR kurz konfigurieren:

 pear config-set data_dir c:\xampplite\htdocs\pear\ 

Ok, jetzt die Installation von PhpDocumentor:

pear install PhpDocumentor

Schwierig oder?

Ok, jetzt müsst ihr natürlich passend kommentierte PHP-Dateien haben dann könnt ihr mit dem Befehl hier loslegen:

phpdoc -t <targetdir> -o HTML:default:default -d parsedir

Have fun und immer schön Code dokumentieren!

apache virtual hosts mit ssl unter linux

Dienstag, Februar 2nd, 2010

Es wird immer wichtiger, dass man Daten nicht einfach so durchs Netz schickt, sondern die Daten verschlüsselt transportiert. Die Lösung ist ein apache, mit ssl und verschiedenen virtuellen hosts. Meine Grundidee ist folgende: schnell und einfach https://<dienstname>:<port> zu implementieren. Dazu braucht es natürlich erstmal eine funktionierende apache Installation. Aber das erkläre ich hier sicher nicht! Und wir gehen noch davon aus, dass wir nicht den Standard Port 443 nehmen wollen, sondern einen beliebigen. Das Ziel ist ja mehrere Seiten/ Dienste zu erstellen.

Zuerst kümmern wir uns um die Zertifikate:

  • sucht euch einen beliebigen Ort, z.B. /tmp/test um dort die Zertifikate zu erstellen und erstmal zu speichern
  • und los gehts:
    $ sudo openssl genrsa -des3 -out <name>-ssl-cert-private.key 1024
    

    ihr müsst nichts eingeben, außer dem Passwort und das natürlich gut merken!

  • ok, dann nehmen wir den erstellten Key und erstellen ein ‘certificate request’:
    $ sudo openssl req -new -key <name>-ssl-cert-private.key -out <name>-ssl-cert-file.pem
    
  • und jetzt erstellen wir noch das selbst-signierte Zertifikat:
    $ sudo openssl x509 -req -days 365 -in <name>-ssl-cert-file.pem -signkey <name>-ssl-cert-private.key -out <name>-ssl-server.crt
    
  • jetzt müssen die Zertifikate an den richtigen Ort kopiert werden:
    $ sudo cp <name>-ssl-server.crt /etc/ssl/certs
    
    $ sudo cp <name>-ssl-cert-private.key /etc/ssl/private
    

Das wars auch schon fürs Erste.

(weiterlesen…)

htaccess Links und HowTo

Samstag, Januar 30th, 2010

Hallo,

als Webmaster versucht man stets seine Homepages zu optimieren. Dazu gehört auch der korrekte Umgang einer .htaccess-Datei, v.a. wenn man eben keinen direkten Zugriff auf die Apache Konfiguration hat. Mit einer .htaccess-Datei könnt ihr relativ einfach Konfigurationsvariablen für den zugehörigen Apache Server setzen und einstellen. Dies setzt natürlich voraus, dass der Hoster die Einstellungen, die ihr vornehmen wollt auch selbst in seiner Konfiguration des Apache genehmigt hat. Normalerweise könnt ihr recht viel Einstellungen machen.

Ich will hier aber gar keine große Anleitung schreiben, was ihr alles machen könnt oder was ihr genau bei Wordpress machen solltet, sondern ich will euch ein paar hilfreiche und informative Links zur Verfügung stellen und ihr könnt dann selbst nachlesen, was ihr für sinnvoll haltet.

Ein paar Tipps gebe ich natürlich schon:

  • komprimiert eure Anfragen mit gzip (howto)
  • schützt eure htaccess-Datei & wp-config.php
  • verhindert, dass eure Bandbreite genutzt wird, in dem Bilder von eurer Seite in anderen eingefügt werden
  • versucht zu cachen
  • leitet http://<domain> anfragen an www.<domain> um

Und hier ein paar Links:

Es gibt sicher noch jede Menge Anleitungen, aber zu viel Informationen bringen auch nur Verwirrung. Ich denke mit der obigen Sammlung kann man schon so einiges aus seiner Seite raus holen.

Viel Vergnügen und falls ihr gute Links habt, postet sie in den Kommentaren.

CSS Divs statt Tabelle

Dienstag, Januar 26th, 2010

Hallo,

für diesen kleinen Beitrag könnte es viele Überschriften geben, z.B. Divs richtig anordnen, divs positionieren, divs in divs, divs nebeneinander, etc….

Ich habe schon des öfteren divs in divs benötigt und manchmal auch nebeneinander oder untereinander und so weiter, heute wollte ich euch mal zeigen, wie einfach dies gehen kann.

Hier erstmal der CSS Code:

<style>

#wrapper {
	height: 165px;
	width: 500px;
	border: 1px solid blue;
	padding: 25px;
}

#demo_div1 {
	float:left;
	width: 190px;
	height: 160px;
	background: green;
}

#demo_div1_sub1  {
	float:left;
	margin: 5px;
	width: 170px;
	height: 70px; b
	ackground: red;
}

#demo_div1_sub2  {
	float:left;
	margin: 5px;
	width: 170px;
	height: 70px;
	background: black;
	color: red;
}

#demo_div2 {
	float:left;
	width: 190px;
	height: 160px;
	background: red;
	margin-left: 19px;
}

#demo_div2_sub1  {
	float:left;
	margin: 5px;
	width: 170px;
	height: 70px;
	background: green;
}

#demo_div2_sub2 {
	float:left;
	margin: 5px;
	width: 170px;
	height: 70px;
	background: black;
	color: red;
}
</style>

Dann noch ein paar HTML Schnippsel:

<div id="wrapper">
   <div id="demo_div1">
		<div id="demo_div1_sub1">div1_sub1</div>
		<div id="demo_div1_sub2">div1_sub2</div>
	</div>

	<div id="demo_div2">
		<div id="demo_div2_sub1">div2_sub1</div>
		<div id="demo_div2_sub2">div2_sub2</div>
	</div>
</div>
<p>ready...</p>

und fertig ist das ganze:  Demopage

Vor allem ist das hier nützlich für Bilder, oder für kleine oder auch größere Formulare, wenn ihr eure label-tags über euren input-Feldern oder Checkboxen wollt. Natürlich muss man dann noch ein paar Größenanpassungen machen, mehr ist allerdings nicht nötig.

Have fun