nyroBlog
Ban NyroBlog, by Emi
Image by Emi - ?

Tag: Libre


Tutoriel : Transférer son site

Comme j'ai transférer mes 2 sites la semaine dernière, le sujet est tout chaud pour moi.

Avant de m'atteler à la tâche, j'ai chercher un petit tuto comme celui-ci, qui m'aurait permis de noter tous les points à ne pas oublier. Comme je n'ai pas trouver, je l'écris pour qu'un tel article existe !

Introduction

Commençons par poser le problème, histoire que tout le monde comprenne de quoi on parle.
Lorsqu'on veut publier un site internet sur la toile, on a besoin de 2 choses : un nom de domaine et un espace disque (serveur ou simple hébergement. Le terme serveur sera utilisé par la suite) dans lequel on stockera les fichiers du site.

Le nom de domaine est l'adresse avec laquelle vous accéder au site internet; nyrodev.info pour ce blog par exemple. Ce nom de domaine doit diriger votre visiteur sur vers votre serveur pour ainsi accéder au fichier. Votre serveur est accessible avec une addresse IP unique sur la toile. La liaison entre le nom de domaine se fait grâce aux DNS. Les DNS sont des ordinateurs sur la toile que n'importe qui peut interroger pour connaître l'adresse IP attribué à un nom de domaine.

Le serveur est là où sont stockés vos fichiers. Il s'agit ni plus ni moins que d'un ordinateur avec des logiciels spéciaux d'installés. Un serveur peut contenir plusieurs sites. Ce qui veut dire que plusieurs noms de domaines pointeront sur ce même serveur. L'affichage des bons fichiers se fera par le biais d'un panel de logiciel bien paramétrer pour chaque site. Cette partie ne sera pas traité dans ce billet. Dans la plupart des cas, les serveurs dédiés proposent des outils d'administration qui configure automatiquement tous ces logiciels serveurs pour vous à la création d'un nouveau site.

Notre but est de changer de serveur. Nous devrons donc transférer les fichiers du site (images, pages html, etc...), les base de données éventuelles et bien plus encore. Au final, nous changerons l'adresse IP sur laquelle point le nom de domaine pour utiliser le nouveau serveur.

Voyons donc quelles actions doivent être réaliser et dans quel ordre pour que tout se passe bien, en perdant un minimum de visiteurs durant le transfert.

Dans la suite du billet :
  • domaine.com : le nom de domaine à transférer
  • Serveur A : ancien serveur, sur lequel le nom de domaine pointe actuellement
  • Serveur B : nouveau serveur

1. Préparer le terrain

La première étape de ce transfert est de préparer le serveur B à recevoir le nouveau site. Créer le site dans votre administration afin de lui allouer un espace. Vous pouvez lui attribuer tout de suite domaine.com, ce sera toujours ça de gagner, avec les paramétrages des serveurs de mail, de FTP, etc... Cela ne pose pas problèmes[1] puisque domaine.com pointe toujours sur l'ancien serveur.

Ensuite, vous pouvez créer tous vos emails et redirection d'emails que vous avez sur le serveur A de façon à ne perdre aucun email. Pour les base de données, créez simplement les base de données sans les tables, cette partie fera l'objet d'une autre partie.

2. Transférer les fichiers

A ce stade là, vous pouvez transférer vos fichiers statiques. Ne transférer pas dès maintenant les fichiers uploadés par les visiteurs car le site est encore accessible, et donc des uploads peuvent encore avoir lieu.

Si vous avez un accès en SSH sur votre serveur A, pourquoi ne pas créer une archive tar.gz pour tout regrouper dans un seul fichier compressé, pour gagner du temps ?
Déplacer vous dans votre répertoire contenant vos fichiers, et pour créer l'archive :
tar cvzf dossier.tar.gz dossier
Récupérer ce fichier par FTP, et transférer le sur le serveur B, sur lequel vous devrez aussi avoir un accès SSH. Dans le dossier où vous avez uploadé cette archive, décompressez vos fichiers :
tar xvzf dossier.tar.gz
Ces fichiers contiendront peut-être des configurations pour accéder à la base de donnée, des fichiers .htaccess avec des répertoires absolus, etc... Autant de configurations qui seront sans doute différent sur le nouveau serveur. Modifier les maintenant.

Si vous n'avez par accès en SSH, rapatriez simplement tous vos fichier par votre FTP normalement. Vous pouvez faire les changements de configurations avant de les transférer.

De plus, pensez aux droits des dossiers dans lesquels vos scripts écrivent vos fichiers.

A ce stade là, vous devez avoir votre site prêt à fonctionner, en ajoutant simplement vos bases de données.

3. Fermeture temporaire du site

Pour être sûr de ne perdre aucune donnée durant le transfert, nous allons empêché complètement l'accès au site sur le serveur A, avant de transférer tous les fichiers dynamiques et les base de données.

Nous allons fermer la totalité du site avec un simple fichier .htaccess, interdisant tout et redirigeant sur une simple page texte pour dire que le site déménage. Le fichier .htaccess est :
Deny from all

    Allow from all

ErrorDocument 403 http://www.domain.com/transfert.php
Et créer votre fichier transfert.php qui explique que c'est temporaire et ne devrait pas durer plus de 24h.

4. Transfert des derniers éléments

Une fois le site fermé, vous pouvez transférer vos fichiers dynamiques, uploadés par vos utilisateurs. Vous pouvez être sûr qu'il n'y en aura plus de nouveaux.

Passons au transfert de la base de donnée.

Si vous n'avez pas d'accès à SSH, utilisez simplement phpMyAdmin pour exporter votre base sur le serveur A et l'importer dans le serveur B.

Mais si vous accès en SSH, il est préférable de procéder différemment pour 2 raisons : l'export de phpMyAdmin est parfois buggé, et si votre base de donnée est trop grosse, phpMyAdmin donnera des erreurs dues au timeout du PHP.

Donc nous avons besoin ici de deux ligne de commandes. La première pour exporter dans un fichier texte :
mysqldump --host=localhost --user=LOGIN --password=PASSE --add-drop-table NOMBASE > base.sql
Transférer ensuite le fichier base.sql sur le serveur B, et exécutez cette commande :
mysql -h localhost -u LOGIN --password=PASSE BASE < base.sql
Votre site doit maintenant être totalement opérationnel sur le serveur B. Si vous pouvez, un petit test ne fera pas de mal, pour être bien sûr.

5. Modifier le DNS

Enfin, il ne vous reste plus qu'à effectuer les modifications de votre nom de domaine pour qu'il pointe sur le serveur B, en modifiant l'adresse IP des DNS de ce dernier. Et puis patienter pour tester si tout est ok. Pour teste plus rapidement si tous vos paramètres sont bons et si tout se passe bien, je vous conseille fortement d'utiliser les serveur DNS d'Open DNS sur votre ordinateur (et pourquoi pas les garder par la suite ?). L'avantage d'Open DNS est qu'ils sont très rapide à se mettre à jour, et que vous pouvez le forcer à rafraîchir son cache. Faites-le donc pour votre site 15 à 20 minutes après avoir effectuer vos changements.

S'ils pointent sur la nouvelle IP, rafraichissez les DNS de votre ordinateur. Pour Windows: Démarrez > Exécuter > cmd. Puis la ligne de commande :
ipconfig /flushdns

Et tester dans votre navigateur préférer pour voir si tout est bon, ce qui est devrait être le cas.

Durant les jours qui suivent, vous devrez récupérer des emails sur les deux serveurs, en attendant que les DNS soient à jour partout.

Voilà, j'espère que ce tutoriel vous sera utile. Bien sûr il existe différentes méthodes à chaque étape. J'ai simplement présenter celles que j'ai utiliser et qui ont marcher parfaitement pour moi.
Si vous avez des remarques, questions, feedbacks, les commentaires sont là pour ça !

Merci à Niko qui m'a conseillé lors de mes transferts.

[1] : Le seul problème qu'il peut y avoir (et qui m'est arrivé) et si sur le serveur B, vous avez d'autres sites qui envoient des mails sur domaine.com. En effet, le serveur ne perdra pas de temps à l'envoyer à l'extérieur, puisque pour lui, ce nom de domaine lui appartient. Ce n'est un problème que si on ne le sait pas. Comme vous allez au final récupérer vos emails sur ce serveur, vous les aurez quoiqu'il arrive plus tard. Un petit webmail pour vérifier tout ça durant le transfert et tout est bon.

English Version of this post

TinyMCE en version 3 Alpha 1

Depuis un peu plus de 3 mois, on n'avait pas de nouvelles de TinyMCE. Je m'étais promené sur le site pour essayer de trouver une roadmap mais je n'avais pas trouvé.

Et aujourd'hui, qu'est-ce qui tombe dans mon netvibes ?
L'annonce de la sortie de la version 3 alpha 1

Et les changements sont réjouissants :

  • Réécriture complète du code (d'où le passage à la version 3) avec nettoyage en profondeur
  • Réduction de 33% de la taille totale des scripts
  • Réduction de 75% des requêtes au serveur
  • Les popups sont maintenant personnalisables à souhait lors d'une ouverture inline (popup Ajax)
  • Les plugins peuvent maintenant ajouter des éléments au menu contextuel, avec des sous-menus possibles
  • Chargement à la demande des éléments et non tout au chargement
  • Tous les éléments d'affichages passent maintenant par CSS (les images des boutons par exemple). Ce qui veut dire que la personnalisation sera encore amélioré à ce niveau là
  • Les listes déroulantes (pour sélectionner la police par exemple) sont maintenant crées en javascript. On peut donc voir la police sur chaque ligne comme dans votre éditeur de texte favori

Et encore plein d'autres.

Je n'ai pas encore eu le temps de regarder en profondeur comment cette nouvelle mouture marche, mais on nous dit :

From a pure feature point of view, this release might not be very impressive, but if you are interested in JavaScript and do a lot of custom development, this is the release you have been waiting for.

En français :

Du point de vue des fonctionnalités, cette version ne sera pas vraiment impressionnante, mais si vous vous intéressez au JavaScript et à la personnalisation de TinyMCE, c'est la version que vous attendiez.

Dès que j'ai le temps, je fais un petit tour des nouvelles fonctionnalités JavaScript.

Vous pouvez d'ores et déjà voir la démo de cette dernière version : attention, les fichiers de langue n'étant pas encore prêt, vous verrez sans doute des choses bizarres...

Edit : Sans avoir de timeline véritablement défini, l'équipe de Moxiecode pense sortir une version finale à la fin du mois. Ils travaillent à la correction de bug, à la documentation et un tutoriel sur comment passer de la version 2 à la version 3.

Firefox réduit au minimum pour un maximum d'efficacité

Firefox est un outil de travail, absolument indispensable à tout développeur. Suite à une petite discussion avec Miho, je vais vous faire ici un tour complet de tous les plugins et astuces d'affichage que j'utilise pour en tirer le meilleur parti.

Les extensions
Firefox propose une très grand nombre d'extensions. Certains sont très utiles, d'autres un peu moins, mais toutes trouvent des utilisateurs. Je vais donc vous lister ici celles que j'ai installés, par ordre de préférence/utilisation.

  • FireBug permet de déboguer HTML, CSS, JavaScript et Ajax très simplement et très rapidement. Malheureusement, je ne l'utilise pas car cette extension augmente considérablement la taille en mémoire de mon Firefox, passant très rapidement de 70-80Mo à plus de 300 ! Il intègre les fonctionnalités de Dom Inspector et Live HTTP Headers et en a bien d'autres. Visitez le site officiel pour tout savoir.
  • Web Developer est un autre incoutournable du développement web. Permet de désactiver images, javascript, CSS et tout plein d'autres choses, d'afficher toutes sortes d'information sur la page (taille totale des script, des images, de la page), vider le cache en 2 clics, redimenssionner la fenêtre, valider la page et encore plein d'autres choses. Là encore je ne peux que vous encourager à visiter le site officiel
  • Dom Inspector permet de voir l'architecture de votre page HTML telle qu'elle est actuellement, avec les modifications éventuelles qu'auront réalisé des éventuels scripts.
  • Live HTTP Headers affiche toutes les requêtes envoyées par Firefox avec toutes les infos qui vont avec. Par requêtes, comprenez chargement de page HTML, image ou script, mais aussi requêtes Ajax, flash ou tout autre chose dans le même genre.
  • Tab Mix Plus ajoute plein de configurations à la gestion des onglets. Pour moi c'est le mode fenêtre unique, les popups ouvertes en onglet, l'ouverture automatique en onglet automatique et plein d'autres trucs.
  • CustomizeGoogle ajoutera plein de petites fonctionnalités à vos recherches Google, comme un compteur de positions, des liens vers d'autres moteurs, vers Wayback Machine, de supprimer les pubs, etc...
  • GooglePreview ajoute la fonctionnalité qui manque à l'extension précédente, l'affichage des vignettes des sites dans les résultats.
  • Full Fullscreen vous offre la possibilité de visualiser vos sites sans absolument rien d'autre.
  • FoxyTunes contrôle votre lecteur média dans la barre d'état de Firefox, utile pour toujours garder la main dessus.
  • Custom Buttons offre la possibilité de créer vos propres boutons avec vos propres actions, écrites en JavaScript (j'y reviendrai dans un prochain billet). Il se trouve en bas de la liste car je viens de le découvrir...

L'interface
Tout d'abord j'ai un windows XP customisé afin de réduite au maximum la barre des tâches et la barre de titre pour libérer un maximum de place au contenu même de chaque fenêtre.
De plus j'utilise un thème Mini pour Firefox afin de rendre les polices, menu et icônes au minimum et encore gagner de la place.
Je me retrouve donc avec un espace d'affichage des pages web de 676 par 1280 pixels (si si, c'est Photoshop qui le dit !) pour une résolution d'écran de 1280 par 800. Je gagne 43 pixels par rapport à une configuration de base, thème Windows et Firefox compris. Ca paraît petit, mais j'ai l'impression que c'est énorme.
J'ai donc un espace maximal pour visualiser les pages. De plus je trouve ces deux thèmes beaucoup plus jolis que ceux de bases, surtout pour celui de Windows et son bleu qui m'arrache les yeux...

Les petits plus... qui font beaucoup !
Puisque j'utilise Tab Mix Plus pour n'avoir qu'une seule fenêtre, j'ai paramétrer la barre des onglets pour être toujours visibles, avec des taille d'onglet petites, affichant la barre de chargement et changeant de style si la page n'a pas été vue. Lorsque j'utilise la recherche de Firefox, entre une nouvelle adresse, clique sur un lien externe sur un site ou ouvre une nouvelle page depuis une autre application, j'ai un nouvel onglet qui s'ouvre pour ne jamais perdre la page sur laquelle j'étais.

J'ai positionné les boutons de Web Developper tout en haut à gauche, sur la même ligne que le menu général de Firefox, ce qui a pour effet de rendre toutes les fonctionnalités accessibles en un clic.

Pour finir, voici un petit screenshot de mon Firefox tout joli tout beau.

Dans la même idée, j'ai modifié la position des boutons de Thunderbird pour gagner encore aussi de la place, et de l'efficacité, en supprimant les boutons non utilisé et en plaçant les plus utilisé (indésirables et répondre) plus proche des messages.

Et vous, des astuces dans le même genre ? Des extensions que vous utilisez chaque seconde ?

Ubuntu 7.10 fait sa sortie

Ubuntu 7.10Sortie à la date prévu, le 18 octobre. Difficile de la télécharger les premiers jours car tout le monde s'empressent de la télécharger dès sa sortie. Pour le moment, ça à l'aire d'être revenu à peu près normal.

Alors bien sûr, vous pouvez faire une mise à jour depuis votre version actuelle avec le gestionnaire de mise à jour.

J'ai préféré repartir sur de bonnes bases, tout réinstaller car je commençais à avoir plein de trucs qui ne servaient à rien. Téléchargement de l'iso donc (sur un serveur australien, le plus rapide pour moi) et gravure. Reboot sur le live CD, et avant de passer à l'installation, petite exploration des nouveautés.

Pas de grand grands changements à première vue. A part la Desktop Search qui permet, à l'image de MAC OS ou de google Desktop de faire une recherche sur l'ensemble de son ordinateur (ou internet) très rapidement. Pas encore vraiment testé, mais ça peut être pratique. Un autre outil dans la barre des tâches fait son apparition; il permet de changer d'utilisateur en un seul clic. Très pratique dans un environnement multi-utilisateurs, pas pour moi...

En fouillant un peu dans les paramètres de la bête, j'ai découvert quelques trucs qui m'ont ravis. Premièrement, la configuration de l'écran avec la possibilité de faire du dual-screen très simplement, en paramétrant graphiquement, ce qui manquait terriblement. Je n'ai malheureusement pas pu testé... La gestion des périphériques et drivers est vraisemblablement plus accrue. J'ai d'ailleurs installé mon driver nVidia que je n'avais jamais réussi à installer avant (sans trop chercher non plus). Là, en un clic et un téléchargement avec apt, mon driver est installé, et je peux profiter des effets graphiques sur les fenêtres et bureaux. C'est beau, c'est sympa, mais ce n'est pas le plus important pour moi, ce n'est pas ce qui m'intéresse le plus dans un OS.

Le support du NTFS avec écriture est maintenant installé d'office, ce qui évite des petites bidouilles. Il utilise NTFS 3G dont je vous avais déjà parlé, ça marche sans aucun problème.

Beaucoup de plugins Firefox peuvent maintenant être installé directement depuis Synaptic (ou apt pour être plus général). D'un côté je trouve ça bien pour tout centraliser, mais de l'autre, Firefox le gère très bien tout seul, avec sa gestion des mises à jour et autres... Et là, j'ai peur qu'ils faillent jongler entre des plugins installé par apt et d'autres par Firefox. A voir donc si à l'utilisation ce n'est pas trop lourd et contraignant.

Voilà pour ce qui est d'un rapide aperçu de la nouvelle version d'Ubuntu.

Plus d'infos, en anglais :

PHP, mes lectures du moment

Comme il m'arrive d'avoir du temps libre pendant mon stage, j'en profite pour lire de nombreux articles sur la programmation objet en PHP, la conception de sites, framework ou applications web.

Je vais donc vous faire une petite liste des plus intéressants. Beaucoup d'articles datent de 2004 ou même avant. La plupart sont en PHP 4, il faut donc savoir ce que l'on peut maintenant faire de mieux grâce à PHP 5 et son nouveau modèle objet.

Pour commencer, un petit tour sur la doc officielle et son paragraphe sur le langage objet en PHP 5. La lecture complète de ce paragraphe est plus qu'instructive, et changera sans doute votre vision des objets PHP.
La partie sur la surchage est très intéressantes, pour pouvoir faire des choses du genre $objet->variable = 'chouette';, où variable n'existe pas réellement en tant que propriétés de l'objet. La même chose est possible avec les appels de fonctions.
La petite page sur Réflexion et ses différentes classes/interfaces est tout aussi intéressante pour qui veut faire des instanciations et appels de méthodes dynamiquement et proprement.
Enfin, la minuscule page sur les masques introduit ce qui suit.

Qu'est-ce qu'un masque (ou design pattern ou patron de conception) ?
Wikipédia nous répond très simplement :

Un patron de conception est un concept destiné à résoudre les problèmes récurrents suivant le paradigme objet.

En lisant cet article, une fièvre studieuse est montée en moi pour lire tous les articles sur chaque patron de conception. Certains sont très peu explicites, il faut donc se creuser un peu la tête pour en voir l'application ou l'implémentation quand elle n'est pas donnée. Parfois, il est plus facile de lire le code et le comprendre, puis de remonter à la description pour comprendre à quoi cela sert vraiment. L'idée ici n'est pas d'utiliser tous ces patrons de conception, mais c'est d'en connaître leur existence et leur fonctionnement. Plus tard, si vous vous retrouver face à un problème susceptible d'être résolu par l'un de ces design pattern vous vous en souviendrez et vous pourrez l'appliquer rapidement, puisque vous l'aurez compris.

Ensuite, je me suis mis en tête de lire sur les différentes implémentations de ces patrons de conception PHP. C'est là que les vieux articles entre en jeux.
Le plus important est PHP Patterns, dont le dernier article date de 2005, mais dont la pertinence des articles et les exemples simples en font selon moi une référence. La partie la plus intéressante se trouve dans la partie design. Lisez-donc un maximum d'article en gardant à l'esprit que c'est du PHP4, et qu'il faudra donc repasser ça à la sauce PHP 5 à grands coups d'abstract, interfaces et autres...

Et puis avec ces lectures, j'atteri sur ce post à propos de Smarty et des moteurs de templates, de 2001 mais qui garde tout son sens encore maintenant. La plupart des arguments sont pertinents, quelques-uns un peu moins... Et puis là où ça devient encore plus intéressant, au délà de la discussion, c'est sur cette page où la personne donne un exemple utlra-léger mais ultra-fonctionnel d'un moteur de templates.

Et puis d'autres liens, donnés en vrac :

Enfin, une liste de framework, tous ayant des points de vues différents et des philosophies différentes. Les regarder et se plonger un peu dans le code de chacun est long est fastidieux, mais croyez-moi, très instructif !

Et plein d'autres sur Wikipédia fr et un joli comparatif sur la version anglaise.

La branche des développeurs d'IBM a posté un premier billet sur un comparatif détaillé des 3 premiers cités ci-dessus, à suivre.

Voilà, bonne lecture à tous, et si vous en avez d'autres sous le coude, n'hésitez pas à les mettre en commentaires ici.