Archive pour la catégorie ‘Tutoriaux’

Yop, yop.

Aujourd’hui j’ai eu besoin d’exporter un fichier SQLite vers une db MySQL, pour un de mes projets privés. Pour ce faire, facile, sous Mac OSX:

[codesyntax lang="bash"]

sqlite3 MyDB .dump .quit >> mon_export.sql

[/codesyntax]

Ensuite, le moins facile si on a une grosse DB comme moi (103 Mo) remplacer les:

• Les quelques single quotes (‘) qui sont entre double quotes (« ) par « \’ » (pour le \ appuyer sur Alt-Maj-/)
• Double quotes (« ) par des single quotes (‘)
• « AUTOINCREMENT » par « auto_increment »
• Effacer les lignes « BEGIN TRANSACTION », « COMMIT », « sqlite_sequence »
• « VARCHAR », etc par leur identique mais déclaré: VARCHAR(255)
• Supprimer les single quotes autour des noms de tables

Ensuite importer dans la db MySQL via Querious, Sequel, PHPMyAdmin ou tout autre client…

Tout designer qui se respecte passe son temps à compliquer la vie des intégrateurs Web (si, si) en sortant des standards et en utilisant une bête police qui ne se trouve pas sur tous les ordis…

Vient LA solution: @font-face (le sujet d’un prochain article) mais avec cette solution arrive un autre problème: le EULA de la fonte. Toute fonte ne peut pas être redistribuée légalement et même si la légalité et moi on est pas potes, je tiens pas à ce que mes clients se mangent des proçès, au final c’est ma gueule qui prendra…

Donc voila le problème, je me retrouve avec un design utilisant du Myriad Pro dans un titre potentiellement modifiable (donc pas d’image). Problème la license de Myriad Pro ne permet pas la redistribution de la fonte. Dans ton cul, lulu! (je m’excuse déjà aupres de tou(te)s les lulus).

Mais oh joie, oh miracle, un petit malin a créé la fonte « Vegur » qui ressemble étrangement à Myriad:

Source: http://www.wilki.me/2009/10/myriad-pro-goes-open-source/

Un petit tour sur FontSquirrel pour générer le pack font-face et hop, in ze pocket, ni vu ni connu, le designer n’y voit que du feu… Cool non?

Après pas mal d’essais et de dépatouillage, j’ai enfin compris comment faire. Yeah!

Voila quelques mois que je voulais tester LESS, un système (en Ruby) qui permet d’utiliser des variables et l’héritage en CSS. On a notre belle css clean pleine de variables, on la compile et paf! Voila notre css générée utilisable par tous les browsers. Cool, non?

Sur papier, oui, par contre en pratique… Je me suis pris la tête sur l’install, pas moyen d’accéder au repository avec les gems pour prendre toutes les dépendances… Après quelques heures de recherche, j’ai laissé tomber.

Mais aujourd’hui, voila qu’on me cause de SASS, une technique similaire mais beaucoup plus complète, que je pourrais utiliser sur le nouveau projet Belgacom. Rebelotte, on file sur le site de Ruby, on installe avec le one-click installer, on teste, pas moyen d’installer une gem ^^Après quelques recherches, je tombe sur le repository principal rubygems.org où ils proposent un installeur différent – et plus récent – RubyInstaller, j’installe et ça marcheeeeeeuuuuuuuh! Prise de tête finie.

Alors, pour installer SASS:

1. Installer Ruby via le RubyInstaller (j’ai installé la version 1.9.1) rc1
2. Lancer une ligne de commande avec ruby (disponible depuis le menu démarrer)
3. updater l’utilitaire, pas obligatoire mais plus propre…
   [codesyntax lang="bash"]

   gem update --system

   [/codesyntax]

4. installer la gem haml (aussi un projet intéressant que je vais m’empresser de tester), qui contient SASS
   [codesyntax lang="bash"]

   gem install haml

   [/codesyntax]

5. C’tout c’est fini.

Dans un prochain article, comment utiliser SASS avec Eclipse/Aptana. Je m’empresse de convertir OOCSS en SASS pour voir comment ça marche.

Oui, j’utilise souvent le terme « empresser » mais on s’en fout…

Ce que je préfère en photo, ce sont les conditions lumineuses difficiles : au crépuscule, la nuit et à l’aube (même si j’en ai pas fait beaucoup, je me lève trop tard ). J’adore les challenges et nul photographe ne peut dire que ce genre de conditions est simple à gérer. C’est un peu devenu ma spécialité, et on me demande régulièrement comment je fais, donc voilà, je me suis enfin décidé à prendre mon clavier pour tenter d’expliquer, simplement, la technique là derrière…

Pour une question de lisibilité, il faudra cliquer sur « Lire plus » pour voir la suite, je ne suis pas trop fan de ce principe mais bon, un article de 3km sur la une du blog, c’est un poil longuet

Lire la suite de cette entrée »

Apache

Nous allons créer ce que l’on appelle des Serveurs Virtuels (= Virtual Hosts => VHost): J’utilise cette technique pour bien différencier les sites sur mes serveurs en créant des adresses différentes pour chaque site. Par exemple: blog.he8us-portable et mysql.he8us-portable…

Le nom du VHost est alors mysql.he8us-portable et pas seulement mysql

Remarque pratique: Dans la configuration d’Apache la dièse (#) est la marque de début de commentaire. (La fin de ligne en étant la marque de fin…)

Windows

1. Editez le fichier « C:\Program Files\Apache Software Foundation\Apache2.2\conf\httpd.conf » et decommentez la ligne:
   [codesyntax lang="apache"]

   include conf/extra/httpd-vhosts.conf

   [/codesyntax]

2. Ouvrez le fichier « httpd-vhosts.conf » situé dans « extra\« 
3. Vérifiez que la ligne  suivante est présente dans le fichier (attention parfois l’astérisque est suivie d’un « :80« , si vous le laissez, ajoutez le dans chaque définition):
   [codesyntax lang="apache"]

   NameVirtualHost *

   [/codesyntax]

4. Effacez le reste du fichier et ajoutez le bloc suivant pour ajouter le site par défaut (c’est la page qui sera affichée si l’url d’accès n’est pas reconnue par le serveur):
   [codesyntax lang="apache"]

   #default VHOST
   <VirtualHost *>
   	DocumentRoot "D:/wwwRoot/www/"
   	<Directory D:/wwwRoot/www/>
   		AllowOverride All
   		Options Indexes FollowSymLinks
   		Order Deny,Allow
   		Allow from all
   	</Directory>
   </VirtualHost>

   [/codesyntax]

5. Les différents blocs (un exemple se trouve plus bas) à ajouter sont à ajouter en dessous de celui ci… (un bloc par définition de VHOST)
6. Ajouter une ligne dans le fichier « C:\WINDOWS\system32\drivers\etc\HOSTS » par VHOST défini. (J’utilise l’utilitaire HostsMan pour la gestion de mon fichier HOST)
   [codesyntax lang="text"]

   127.0.0.1 NomDuVirtualHost

   [/codesyntax]

7. Une fois tous les Virtuals Hosts ajoutés, relancez Apache et votre navigateur

Linux

1. Editez le fichier « /var/apache2/sites-available/default » et remplacez son contenu par:
   [codesyntax lang="apache"]

   NameVirtualHost *
   <VirtualHost *>
   	ServerAdmin votreAdresse@mail.be
   	DocumentRoot /wwwRoot/www/
   	<Directory /wwwRoot/www/>
   		AllowOverride All
   		Options Indexes FollowSymLinks
   		Order Deny,Allow
   		Allow from all
   	</Directory>
   </VirtualHost>

   [/codesyntax]

2. Pour chaque virtual host, créez un fichier au nom du site dans « /var/apache2/sites-available/« 
3. Une fois le fichier créé, lancez la commande suivante:
   [codesyntax lang="bash"]

   a2ensite NomDuFichier

   [/codesyntax]
   et ajoutez la ligne suivante au fichier « /etc/hosts« :
   [codesyntax lang="text"]

   127.0.0.1 NomDuVirtualHost

   [/codesyntax]

4. Lorsque tous les hôtes sont rajoutés rechargez la config d’Apache

Exemple de bloc de définition de virtual host

[codesyntax lang="apache"]

#phpMyAdmin VHost
<VirtualHost *>
	ServerAdmin cedric@he8us.be
	DocumentRoot "D:\server\root\phpmyadmin\"
	ServerName mysql.he8us-portable
	ErrorLog "D:\server\logs\mysql_error.log"
	CustomLog "D:\server\logs\mysql_access.log" common
	<Directory "D:\server\root\phpmyadmin\">
		AllowOverride All
		Options Indexes FollowSymLinks
		Order Deny,Allow
		Allow from all
	</Directory>
</VirtualHost>

[/codesyntax]

MySQL

Pour une raison de compatibilité avec la pluspart des hébergeurs, nous allons configurer le serveur MySQL pour qu’il accepte le système de mot de passe MySQL 4 (nous travaillerons en MySQL 5). Pour ce faire:

1. Lancez « MySQL Administrator » (avec les droits d’admin sous Linux) et entrez les infos de votre serveur Web:
   • Host: localhost
   • Username: root
   • Password: le mot de passe que vous avez choisi lors de l’installation
2. Connectez vous et allez sur l’onglet « Service Control »
3. Arretez le serveur
4. Dans « Startup Variables »> »Security » cochez « Use old password » (Sous linux choisisez le fichier « mysqld »)
5. Appliquez les changements et relancez le serveur

Une fois les virtual hosts installés et le serveur MySQL modifié, allez sur http://mysql.localhost/ on va pouvoir commencer à configurer phpMyAdmin…

Ca fait lontemps que j’ai oublié cette série de tutos, hum, ben voila l’occasion ou jamais de la reprendre, je viens de réinstaller ma bécane…

Ici rien de bien compliqué, et c’est la même chose sous Windows comme sous Linux:

1. Récupérer la dernière version de phpMyAdmin sur son site
2. Le dézipper dans le dossier MySQL créé dans l’arborescence…

Passons à la suite avec la configuration des serveurs

Windows

Sous windows pas de grosse install comme nous en voyons tant mais un simple dézip du fichier se trouvant sur le site (Je sais qu’il y a un installateur mais je préfère installer PHP comme module à Apache plutôt que comme script CGI). Je l’ai dézippé dans « c:\PHP5\« 

Par contre la configuration est plus ardue que pour les autres serveurs:

1. Dans le dossier ou vous avez dézippé PHP cherchez après « php.ini-recommended« , copiez le et renommez le en « php.ini« .
2. Editez le comme cela:
   1. cherchez la ligne non commentée (sans point virgule devant) qui contient « error_reporting«   et vérifiez que sa valeur est bien sur « E_ALL« 
   2. même chose pour « display_errors » mais avec la valeur « On« 
   3. la ligne « extension_dir » et mettez le chemin vers le dossier ext (ici ce sera « c:/PHP5/ext/ » => prenez attention au slashes)
   4. décommentez les lignes:
      • extension=php_mysql.dll
      • extension=php_mbstring.dll
      • extension=php_mcrypt.dll
3. Copiez le php.ini dans « c:\windows\« .
4. Copiez la liste de fichier suivante dans « c:\windows\system32\ »:
   • libmysql.dll
   • libmhash.dll
   • libmcrypt.dll
   • libeay32.dll
5. Editez le fichier « C:\Program Files\Apache Software Foundation\Apache2.2\conf\httpd.conf » et recherchez la liste de lignes qui commencent par:
   

   LoadModule

   et ajoutez ce bloc à la fin:

   AddType application/x-httpd-php .php
   AddType application/x-httpd-php-source .phps
   LoadModule php5_module « C:\PHP5\php5apache2_2.dll »

6. Modifiez également la ligne:
   

   DirectoryIndex index.html

   pour rajouter « index.php »:

   DirectoryIndex index.php index.html

7. Relancez Apache et créez un fichier « index.php » dans « C:\Program Files\Apache Software Foundation\Apache2.2\htdocs\ » dans lequel vous mettez ceci:
   

   <?php
   phpinfo();
   ?>

8. Ensuite pointez votre navigateur vers http://localhost/
9. Vous devriez voir une belle page reprenant toutes les infos relatives à PHP…

Linux

1. Depuis un terminal:
   

   $ sudo apt-get install php5 libapache2-mod-php5 php5-mysql php5-mcrypt

   Si apache vous dit qu’il ne peux définir le nom du serveur, ce n’est pas grave, il suffit de spécifier dans le fichier « /etc/apache2/apache2.conf »

   ServerName 127.0.0.1

2. Redémarrez Apache
3. Créez un fichier « phpinfo.php » dans le repertoire « /var/www/ » (avec les droit super user):
   

   <?php
   phpinfo();
   ?>

4. Ensuite pointez votre navigateur vers http://localhost/phpinfo.php
5. Vous devriez voir une belle page reprenant toutes les infos relatives à PHP…

Passons ensuite à l’installation de phpMyAdmin

Bon, passons ensuite au serveur MySQL

Windows

1. Commençons par récupérer MySQL sur le site officiel. J’ai pris l’édition communauté en version 5.1.30, le package essentials. (Vous pouvez aussi récupérer les GUI Tools, nous les utiliserons plus tard)
2. Lors de l’installation, j’ai laissé en Typical et la configuration directe
3. Dans la configuration je met habituellement les infos suivantes:
   1. « Detailed Configuration »
   2. Server Type: « Developer Machine »
   3. Database usage: « Multifunctional »
   4. La position des fichiers de db, je choisis souvent une partition externe pour pourvoir les garder en cas de formatage et/ou de switch windows/linux
   5. Le nombre de connections: je choisis « OLAP », voire je baisse a 15 ou 10 selon si c’est une petite configuration ou pas…
   6. Networking Option, je laisse par défaut
   7. Pour l’encoding, je choisis « latin1″
   8. Pour le service, je vous conseille de le laisser mais si vous ne préférez pas qu’il soit lancé automatiquement, n’oubliez pas de le lancer plus tard…
   9. Pour le mdp root, choisissez ce que vous voulez (sans le « enable root access from remote machines ») et je vous déconseille l’anonymous account
   10. Depuis le même site, téléchargez et installez le package MySQL Gui Tools (qui permettra de configurer MySQL)

Linux

Même chose que pour apache, un simple

[codesyntax lang="bash"]

sudo apt-get install mysql-server mysql-admin

[/codesyntax]

depuis un terminal suffit à installer la version des dépots (5.0.67) et les outils de gestions de MySQL…

Lors de l’installation on vous demandera de choisir un mdp admin, si vous l’oubliez vous pouvez le réinitialiser plus tard en faisant:

[codesyntax lang="bash"]

sudo dpkg-reconfigure mysql-server-5.0

[/codesyntax]

Même chose que pour apache:

[codesyntax lang="bash"]

sudo /etc/init.d/mysql [start|stop|restart|reload]

[/codesyntax]

Pour plus d’infos sur MySQL Server: http://doc.ubuntu-fr.org/mysql

Voila une bonne chose de faite, continuons avec PHP

Bien, maintenant la pratique, à partir de maintenant, je vais splitter mes articles en deux, une partie Windows et une partie Ubuntu.

Windows

1. Commençons par récupérer Apache, pour ce faire, rendons nous sur le site officiel et récupérons la dernière stable (la 2.2.10 à l’heure où j’écris ces lignes). J’ai choisi la version sans le mod SSL car je n’en ai pas l’utilité dans le serveur que je veux créer…
2. Installez le avec les options par défaut.
3. Lors de l’installation, Apache demandera le nom de domaine, le nom du serveur et l’adresse mail de l’administrateur du serveur, je remplis habituellement avec des données bidons (on s’en fout un peu, c’est mon serveur de développement, pas un serveur de prod)
4. L’installateur demandera aussi sur quel port installer Apache, laissez le port 80 si il n’y pas d’autre serveur HTTP qui tourne (genre Zope ou IIS)
5. Une fois Apache installé, rendez vous sur http://localhost/. Si vous voyez un message « It Works », félicitations, Apache marche au poil. Sinon, ben il y’a toujours le
   [codesyntax lang="bash"]

   format c:

   [/codesyntax]

   dans la ligne de commande. (Pour les neuneux gens plus sérieux, ceci est de l’humour, essayez plutôt les commentaires…)

Pour info, vous avez une nouvelle icône dans votre barre de notification, elle vous permet de redémarrer/arrêter/lancer Apache. Les fichiers de config sont dans votre dossier d’installation, répertoire « conf/ »

Linux

1. On va faire simple:
   [codesyntax lang="bash"]

   $ sudo apt-get install apache

   [/codesyntax]

   installera la version d’Apache qui se trouve dans les dépots (version 2.2.9-7)

2. Lancez votre browser et allez sur http://localhost/. Si vous voyez un beau message « It Works! » c’est bon, vous avez réussi… (faut avouer que c’était pas complexe)

Les fichiers de config sont dans « /etc/apache2″ et la doc est disponible à http://localhost/manual/

Pour contrôler apache (lancer, arrêter, redémarrer, recharger la configuration), dans un terminal:

[codesyntax lang="bash"]

$ sudo /etc/ini.d/apache2 [start|stop|restart|reload]

[/codesyntax]

Bien, passons ensuite à MySQL.

Etablissons les bases de tout serveur, l’arborescence. Je veux créer ce qu’on appelle des virtual hosts, un virtua-quoi??

Vitual Host

Bien vous connaissez certainement http://www.google.com et http://mail.google.com, et bien les virtual hosts permettent de d’avoir deux sites différents sur le même domaine (si vous ne connaissez pas vos bases d’adressage, wikipédia est aussi votre ami). En pratique, pourquoi ai-je besoin de ça?

Simplement parce que je suis un maniaque du rangement (virtuel seulement ^^) et j’aime bien séparer tous mes sites, je vais donc préparer quelques dossiers pour mes différents sites.

Sur mon portable (sous windows, je rappelle):

Je rassemble tout sur une partition dédiée (par exemple d:) dans laquelle j’ai créé un dossier server/.

Je crée les dossiers suivants:

• « logs/ » qui contiendra les logs d’Apache.
• « root/ » qui contiendra les différents sites.
  • « www/ » qui contiendra le site par défaut (quand on arrive sur mon portable, via un mauvais virtual host).
  • « mysql/ » qui contiendra un site permettant la gestion de MySQL (pour les curieux, c’est PHPMyAdmin).
  • « blog/ » qui contient ma version de travail de ce même blog.
• « sessions/ » qui contiendra les sessions d’utilisateurs de PHP

Voila pour ma machine de Dev, passons à ma mon serveur de test.

Mon serveur (sous Ubuntu):

Bon, ici rien de bien complexe, même chose que sous windows, j’utilise une partition dédiée accessible à l’adresse /media/server/ et j’y crée les mêmes dossiers…

Passons enfin aux choses sérieuses, l’installation du serveur Web