Utilisation de cette propriété :

• Slider
• Présentation
• Mise en page avec php
• Javascript(effet grâce aux numéros)
• etc …

Cliquer ici pour voir la vidéo.

A bientôt !

Téléchargeons et préparons le framework !

Allez sur le site de zend framework, http://framework.zend.com/, cliquez sur le GROS bouton « download now » et télécharger le framework. Pour les besoins du tuto, j’ai pris le full, mais le minimal devrait suffire .Après un interminable temps de téléchargement, décompresser le framework, et ouvrez le dossier (Ca aussi ça prends du temps ^^) , nous nous occuperons de 2 dossiers seulement !

Préparons l’environnement !

Tout d’abord, si vous avez bien la dernière version de wamp en cours ( la 2.1), allez dans le dossier C:\wamp\bin\php\php5.3.4 et ouvrez le fichier php.ini . Une fois cela fait, allez à la ligne 793 (Je ne suis pas sur de cette ligne, chez moi, c’est celle là, mais cela peut varier), vous devriez trouver ça : Vous allez supprimez la virgule devant le « include_path », qui décommentera et rendra active cette directive.

Une fois la directive activée, allez à la racine de votre ordinateur, le dossier C:\ et créez l’arborescence de dossiers suivante :

Enfin, allez dans le panneau ordinateur, faites clique droit->propriétés->paramètres système avancés->variables d’environnement.ensuite, à la fin de la valeur de la variable Path, rajoutez cela :

;C:\wamp\bin\php\php5.3.4;C:\wamp\bin\php\php5.3.4\zend-bin\;

Voilà, la préparation est finie, on installe le framework maintenant !

Dernière ligne droite !

Dans le dossier du framework, prenez le dossier bin, et mettez le dans le dossier C:\wamp\bin\php\php5.3.4\ puis renommez le dossier bin en zend-bin.

Enfin, prenez le dossier Zend qui se trouve dans le dossier library et mettez le dans le dossier C:\php\includes\

C’est fini !

Pour tester si tout à bien marché, lancer la commande (éxécuter->cmd) et tapez zf –help Si vous ne voyez aucune erreur, c’est bon ! Le Zend Framework est installé !

Bon développement !

Cliquer ici pour voir la vidéo.

Bon apprentissage

Fichiers source : jribbble

Tout d’abord, je m’excuse du manque d’article sur site-waide, ce sont les vacances, mais malgré le temps , plus ou moins libre, que j’ai devant moi, l’envie de tourner un tutoriel seul ne me prends pas, sachez en tout cas que je n’oublie site-waide, et qu’il vas revenir en force, avec, je pense, un élargissement au niveau des sujets de rédactions, je n’ai pas encore choisis quels sujets je vais privilégié, mais si vous avez des idées, des envies, je suis preneur !

Ensuite, pour ceux qui sont venus sur le site ces dernières semaines et qui sont tombés sur des pages 404,  je vais vous expliquer le pourquoi: Tout, d’abord, le serveur hébergeant site-waide (je suis sur un mutualisé) à été attaqué par un pirate (chapeau, au passage), jusque la, pas de problèmes, l’hébergeur me contacte, m’explique le problème, s’excuse etc .. : Il (l’hébergeur)à fait tout ce qu’il fallait.

Le principal soucis dû à l’attaque est le fait que le pirate, après avoir … descendu le serveur, à décidé de corrompre les sauvegardes (tant qu’a faire), impossibilité donc de remettre à jour les sites automatiquement. Toujours mis au courant par l’hébergeur, qui stipule bien que ce sont les fichiers index.

[/html]

et les .htaccess qui ont été touchés et qui doivent être changés. En bon petit soldat, je remets à jour mes fichiers index et vérifie le résultat : l’accueil marche, nickel ! Je n’avais pas fait attention à vérifier les pages des articles, qui sont accessible grâce à l’url rewriting, qui lui même est défini dans le … .htaccess !

C’est donc ce soir, grâce à Identitools, qui m’a montré ce problème, que j’ai pû réparer ce petit, bien que désagréable, problème !

Je conclurais donc sur 2-3 petites choses :

• Toujours écouter son hébergeur et tout vérifier, un coup de flemme et c’est deux semaines, voir trois qui partent en fumée !
• Je m’excuse du manque de réactivité dont j’ai pas fait part
• et, enfin, revenez bientôt, un programme sacrément sympa arrive avant la fin des vacances !

A plus !

Salut à tous, on vas entamer ce nouvel article par la présentation du site Video2Brain, un des leaders du e-learning européen qui propose des formations de qualitée pour un moindre coût. Plutôt que de patauger et d’essayer de vous concocter une description completement naze, je vous copie/colle celle de Video2Brain :

video2brain propose des formations vidéo en ligne et en DVD pour les logiciels et les langages de programmation. Les formations de video2brain sont élaborées et réalisées par les plus grands experts qui s’emploient à rendre votre apprentissage le plus didactique et efficace possible. Collaborant étroitement avec les fabricants de matériels et de logiciels, video2brain est en mesure, dès la parution d’un nouveau logiciel, de proposer rapidement des tutoriels actualisés en français ainsi qu’en allemand, anglais et espagnol.
L’équipe de video2brain France est une équipe dynamique et passionnée qui met tout en œuvre pour ajouter au minimum 3 nouvelles formations par mois à son catalogue et propose des formules adaptées à vos besoins ! Que vous optiez pour une formation individuelle, un coffret ou un abonnement, vous progresserez à votre rythme, où et quand vous le souhaitez. video2brain est toujours à la pointe de la technologie et intègre les dernières avancées technologiques dans ces formations. Ainsi depuis fin 2010, video2brain propose des formations consultables sur iPad et iPhone 4.

Voilà, je n’ai plus que deux choses à faire :

1) Vous recommandez chaudement ce site, les formations sont tout simplement superbe et les formateurs sont top !

2)L’url du site, http://www.video2brain.com/fr

Maintenant, place aux concours.

Je vais vous laisser jusqu’au 28 23h59 (:p ) pour déposer votre commentaire, mais attention, Pour éspérer remporter les lots (surprise ! :p), il vous faudra me proposer une idée de tutoriel à tourner, et celle-ci devra tourner autour du monde du web, soit sur le design, soit sur la programmation. Je choisirais aléatoirement les gagnants.

Récapitulatif :

• Le concours est ouvert du 21/06 à 10h jusqu’a 28/06 à 23h59
• Il faut donner une idée de tutoriel dans un commentaire (vous remplirez aussi avec une adresse mail valide le formulaire)

Les lots :

Le moment que tout le monde attends, que gagnez-vous?

Eh bah tout simplement 3 codes Video2Brain pour vous offrir la vidéo de votre choix ! C’est pas un super cadeau ça?

Allé, au boulot, bonne chance à tous !

Gros P.S:

Vous souhaitez augmenter vos chances de gagner un lot?

Allé faire un tour sur identitools !  http://identitools.fr/actu/5-formations-video-a-gagner-video2brain/ !

Résultat du tutoriel

Cliquer ici pour voir la vidéo.

N’hésitez pas à poster vos réalisations !

1- Need une console

Voilà, votre voisin, disons, de gauche vous embête, et, plutôt que de subir, vous vous décider à lui supprimer tout son travail. Comment faire? Tout d’abord, il va falloir avoir accès à la console, vous savez, ce truc tout noir :

Donc, pour y avoir accès, il y a une technique assez simple : allez dans vos documents, faites un clic droit -> nouveau -> document texte. Appelez le avec le nom que vous voulez, ce n’a aucune importance. Double cliquez sur le fichier, le bloc note s’ouvre, rentrez ce code :



@echo off
start cmd.exe
return 0

Petite explication (je ne suis pas un pro du bat, donc ça restera trèèèès basique ^^ ): @echo off = Cela permet de lancer une série de choses à faire, le off veut dire qu’aucune sortie ne sera utilisé (aucun texte)

start cmd.exe = Ca parle de sois même, on lance le programme de commande, cmd.exe.

return 0 = (Merci le C pour m’avoir appris ça ^^) Vous évite d’avoir deux fenêtres de console ouverte en même temps.

Voilà voilà (Je vous montrerai une technique plus rapide à la fin ).

faites Ctrl+Maj+s et enregistrer avec le nom « console.bat ».

Une fois ce programme lancé, vous allez arriver sur la console !

2- Need une commande

Voilà, déjà, on à réalisé un petit exploit, on à affiché la ligne de commande ! Si je ne me trompe pas, le chemin où vous vous trouvez est celui de vos documents persos, nous allons donc utiliser une commande basique : shutdown. Celle-ci vas prendre un paramètre, qui vas lui spécifier que ce n’est pas notre ordinateur que l’on veut éteindre, mais celui du voisin. Pour cela, tapez shutdown -i. Une fenêtre s’affiche, à tout de suite !

3- LA fenêtre

La voilà, LA fenêtre, je vous l’explique :

• 1 : C’est là qu’on vas chercher les différents ordinateurs du réseau
• 2: La tâche que l’on veut que l’ordi exécute
• 3: Le nombre de secondes pendant lesquelles la cible verra votre petit message.
• 4: La raison de l’extinction
• 5: le commentaire

Donc, pour étreindre un ordinateur, vous cliquez sur parcourir, et allez sur active directory dans la liste déroulante, vous verrez une liste d’ordinateur s’afficher, choisissez celui de la cible, ensuite, cliquez sur ok, et allez choisir l’action, que je mettrais bien à « Arrêter le système, personnelemment ^^, ensuite, si vous voulez vraiment que votre voisin ai le temps de réaliser ce qui lui arrive, mais qu’il ne puisse rien faire, le mieux est de mettre 10 secondes, si vous voulez lui laisser une chance 20-30 secondes, aucune chance: 1-5 secondes. Dans la case 4, j’aime bien choisir le « pour cause de sécurité », je trouve ça paradoxale, c’est fourbe, ça me plaît ! Enfin, le commentaire, celui-là, peaufinez-le ! C’est le must, achevez la cible quoi ! Evitez donc le « Dsl, t avé ka pa me fère chié », ça fait naze, préférez un bon « Salut, je voulais te parler d’un problème, un problème que ton ordi as : Tu t’es fait avoir ! Eh oui, tu vas perdre tout tes documents en cours d’édition, car, comme tu lis ce message, tu ne peux pas faire autre chose, enfin bon, le temps que tu finisse de lire, ton ordinateur sera déjà éteins. [nom d'un mec que vous aimez pas]. » Ce message, bien que basique est assez rageant pour la personne le recevant ! Enfin bon, appuyez sur OK, patientez un peu (le nombre de secondes que vous avez précisez, laisser de la marge, quand même) et fermez la console. Bravo !

4- Compléments

Le problème de cette technique, c’est que si la personne a certaines applications ouverte (je pense à firefox), l’arrêt est stoppé, dans ces cas là, une seule technique : shutdown -i -f . Cette commande à pour conséquence de fermer tout bonnement tout les logiciels puis de lancer l’extinction, imparable !

Je vous copie-colle les arguments que peut prendre la commande :

Sans argument           Affiche ce message (identique à -?)
-i                      Affiche l’interface graphique, doit être la 1ère option
-l                      Ferme la session (ne peut pas être utilisé avec l’option -m)
-s                      Met l’ordinateur hors tension
-r                      Met l’ordinateur hors tension et le redémarre
-a                      Annule une mise hors tension système
-m \\nom_ordinateur     Ordinateur distant à mettre hors tension/redémarrer/annuler
-t xx                   Définir le délai d’expiration pour la mise horstension à xx secondes
-c « commentaire »                Commentaire de la mise hors tension (maximum de 127 caractères)
-f                      Force des applications en cours d’exécution à se fermer sans avertissement
-d [u][p]x:yy         Le code de raison de la mise hors tension
u est le code utilisateur
p est un code de mise hors tension planifié
xx est le code de raison majeur (valeur entière inférieure à 256)
yy est le code de raison mineur (valeur entière positive inférieure à 65536)

Source : http://forum.hardware.fr/hfr/WindowsSoftware/Windows-nt-2k-xp/shutdown-comment-marche-sujet_256062_1.htm

Donc, maintenant, on vas raccourci à maxima les étapes de lancement : Clic droit->nouveau fichier->texte -> nom au pif.

Maintenant, on rentre ça :

@echo off

shutdown -i -f

return 0


Voilà, enfaite, le fait de lancer une commande depuis un .bat, équivaut au lancement de cette commande depuis un terminal. Nous avons donc directement accès à l’interface graphique, avec l’option qui permet de forcer la fermeture.

Bonus

Si un malencontreux voisins vous attaque de cette fourbe manière, lancer un terminal et tapez shutdown -a. Cela à pour effet d’annuler la mise hors tension d’un ordinateur

Allé, salut !

Bon visionnage !

Cliquer ici pour voir la vidéo.

Si vous avez des questions ou autres, n’hésitez pas : Commentez !

Salut !

Sommaire

1. Php, pourquoi, comment,où?
2. Les variables
3. Les conditions
4. [Théorie]Les différents systèmes de stockage

C’est parti !

1- Php, pourquoi, comment, où?

Le php est un langage côté serveur, c’est à dire, que contrairement au html, au css, au javascript, il lui faut l’intervention d’une machine autre que votre ordinateur pour faire fonctionner ce langage. Pour utiliser le php, il nous faudra toujours coder (je sais que vous aaaaadorez ça :p ), mais avec un nouveau language, dont je vous laisse deviner le nom … LE PHP ! Il est par contre nécessaire de préciser que les « conventions » (la forme, l’utilisation) du html ne s’applique surtout pas au php. Le html est un langage de balises, le php, lui, est un langage de fonctions, algorithmique : Chaque étape se passe en fonction d’une autre. (Merci aux gens d‘innaStudio pour m’avoir fait « découvir » cette subtilité du langage!)

Nous avons donc affaire à un langage … nouveau ! (dans tout les sens du terme !). Le php, du fait de son exécution côté serveur, est un langage « dynamique » :  Pour le html, une page = un contenu, pour le php, une page = une infinité de contenu (ok, j’exagère un peu ^^ ). Enfaite, c’est surtout, qu’en créant une seule page (exemple, index.php), nous pouvons afficher tout les articles d’un blog grâce a des liens, nous saurons quel lien affiché grâce à l’url de la page. Voilà donc le côté « dynamique » : En fonction d’un paramètre, on affiche un contenu. En html, il n’y a pas de paramètre(s) à passer, si on veut en avoir un, il faut créer toutes les pages d’un blog une par une et faire tout les liens manuellement, or, en php, tout cela est fait grâce à une seule page ! (vous remarquerez que je ferais pas mal référence au html et au système de blog dans cet article !). Pour dire au serveur que l’on utilise du php, notre document dois commencer par « <?php » et se finir par « ?> » et utiliser l’extension .php (ex : index.php).

En php, une des notions la plus importantes, est les variables, je vous donne donc rendez-vous dans le chapitre suivant pour comprendre leur utilité et leur fonctionnement !

2- Les variables

Une variable, et cela dans tout les langages que vous rencontrerez, est une partie de mémoire. Cette partie de mémoire vous sert à stocker uniquement des chiffres ou des caractères alphanumériques. En php, une variable se déclare sous la forme suivante : $nomDeLaVariable = « Sa valeur »; . On note donc le « $ » devant le nom de la variable, le « = » qui sert à assigner une valeur à cette variable et le « ; » qui sert à dire au serveur que l’instruction est finie. Comme un exemple parle plus que des dizaines de phrases, en voici un :

<?php

$bar = 0; // Pour assigner un chiffre, on ne mets pas de guillemets

$foo = "site-waide.fr"; // Pour assigner des caractères alphanumériques, on DOIT utiliser les guillemets.

?>

Php sert aussi à « jouer » avec ces variables, par exemple, a la place de mettre une url en dur dans une balise « a », vous mettez la variable.

<?php

$foo = "http://site-waide.fr";

?>

<a href="<?php echo $foo; ?>"></a>

Décortiquons cela : Nous déclarons la variable $foo qui contient l’url de site-waide. Nous fermons ensuite le php pour créer une balise de lien, dans laquelle nous rouvrons le php pour le paramètre href, que nous remplissons avec la variable foo. Nous refermons a la fois la balise a et le php .

Autre chose à savoir, une variable, si elle est re-déclarée, aura comme valeur celle assigner à ça dernière déclaration, exemple :

<?php

$foo = 0; // la variable vaut 0

$foo = 1; //la variable vaut 1

//La variable, au final, vaut 1

?>

Voilà, vous connaissez la « base » des variables, leurs utilisation, leurs règles etc … Passons aux boucles !

3- Les conditions

Les conditions sont très importantes en php, dans ce chapitres, je vous en montrerai 2 sur 3 : if et else. (si, sinon)

Commençons par la condition « if »: Cette condition est la base, elle permet de créer une condition de type : si … alors …, exemple, si foo = 2, alors tu affiches foo vaut 2 ! Mise en pratique:

<?php

$foo = 2;

if($foo = 2){

echo 'foo vaut 2 !';

}

Ici, vous avez la base des conditions, si foo aurait valu autre chose que 2, rien ne serait afficher, et nous allons justement remédier à cela grâce à la « condition » else, sinon.

Nous allons dire a php que si notre condition est fausse (que foo est différent de 2), d’afficher « foo ne vaut pas 2″, il suffit juste de rajouter après le bloc que nous venons de faire, un truc du genre : sinon affiche « foo ne vaut pas 2″. Mise en pratique :

</pre>
<?php

//bloc d'avant

else{

echo 'foo ne vaut pas 2';

}

?>
<pre>

Et voilà, la condition est bouclée ! Sympa non ? On vas maintenant passer a un petit paragraphe vous parlant des différents types de stockage !

4- [Théorie]Les différents systèmes de stockage

Pour moi, il existe principalement deux types de stockage, le premier étant la base de données (site-waide.fr utilise ce système). C’est une sorte de logiciel qui enregistre les données dans des meubles, qui contiennent différents tiroirs dans lesquels vous ferez des requêtes pour les récupérer. Ce système est utile lorsqu’il faut sotcker beaucoup de données, mais lorsque nous voulons juste stocker 2-3 bétises, je viendrait plutôt à utiliser le xml !

Ce système se présente sous la forme d’un fichier balisé, que nous parserons pour récupérer le contenu (je vous invite à vous informer sur ce terme, assez dur à définir ! Si quelqu’un a une définition à la fois simple et complètes, je prends !), ce fichier ce présente sous la forme d’un succession de balises de type : <titre></titre><contenu></contenu> etc .. Si vous suivez l’actu du blog, vous aurez vu que j’ai publié un kit graphique customisable, basé sur ce système.

Voilà voilà, cette partie était très théorique, car elle fera l’objet d’un tutoriel vidéo !

Je tiens à vous dire que cette présentation est très simple, PHP ne se borne pas a ça. Par exemple, dans les variables, je n’ai pas abordé les superglobales, les POST et GET etc .. Ne vous inquiètez pas, il y a de quoi bosser encore !

Allé, n’hésitez pas à poser vos questions et à faires des remarques !

Salut !

Allé, puisque je suis sympa, et pour les plus courageux, l’intro de site-waide, faites par mes soins sur after effect :

Cliquer ici pour voir la vidéo.

Allé, après cette petite intro, place au sujet : le Html5.

Si vous suivez un peu les news du développement web, vous avez pu voir que le html5 pointe le bout de son nez, ce qui n’est pas pour nous décevoir ! Certe, cela amène un réapprentissage des bases, mais bon, un petit peu de frais ne fait que du bien !

Donc, pourquoi je vous parle de la sortie du html5, tout simplement car, après avoir fait de petites recherches, j’ai remarqué que peu, voir pas de sites français proposaient des tutoriels sur le html5, je me suis donc dit que c’était le moment pour travailler un peu « dans le futur », avec le html5 et le css3 :p .On verra donc, au fur et a mesure de l’avancée de ces petits tutos, une bonne partie des spécificités du CSS3 et du HTML5 !   A vos blocs-notes, c’est parti !

Partie 1 : Les bases

On vas donc commencer par voire les bases du html5, ce qui change, ce qui ne changes pas.

Donc, le xhtml, comme le html, sont des langages basé sur une « structuration » particulière : ils sont organisés sous forme de balise, une balise, pour rappel est de la forme suivante : <balise></balise> OU <balise />. Dans le premier cas, c’est une balise double, dans le deuxième cas, une balise simple.

Ces rappels fait, on peut continuer : En xhtml, pour structurer un design, on utilisait les balises div , qui représente, en gros, un bloc. Pour ceux de la génération xhtml, comme moi, vous avez donc appris à structurer vos designs grâce à une balise « universelle » et dont le seul signe distinctif était l’ID ou la class qu’on pouvait lui attribuer. Bah, pour le html5, div, c’est fini.

En xhtml, vous codiez vos designs comme ça (c’est simplifié, universalisé, et je n’ai pas pu mettre les guillemets manquant, photoshop me les convertissaient en chevrons) :

Mockup d'un design sous xhtml

Or, maintenant, en html5, des nouvelles balises sont apparues, pour « remplacer » div, ces balises, sont, par exemple : header, article, aside, footer etc … (Non, vous ne revez pas ). Pour simplifier, les 6 balises qui vous seront utiles à la création du design en lui même, donc hors le contenu, tout ce qui est dynamique, sont :

• nav : défini un menu, une navigation
• section : défini une section de contenu
• aside : défini une sidebar
• header : défini un header
• footer : défini un footer
• article : défini un article

Je pense que vous avez compris comment ça marche : on passe de <div id= »header »></div> à <header></header>. Un gain de clarté dans le code assez exceptionnel, je trouve. Le schéma :

Mockup d'un design sous html5

Voilà, on voit donc que, soit dans le css, soit dans le html, on a un gain de visibilité et de clarté. Maintenant, pour compléter cette approche de Html5, je vais vous passer la liste des nouvelles balises (source : w3school) avec leur « définition », traduites par mes soins :

* Je ne suis pas sur de la définition de cet élément, si je me trompe, corrigez moi dans les commentaires !

Voilà, maintenant, un truc vraiment super cool qui à été implanté en html5, on peut enfin connaître le doctype par coeur !!! Maintenant, on peut définir le doctype comme suit : <!doctype>, simple, clair et concis ^^

Voilà voilà, on a vu les bases du html5, les balises, comment on organise un design etc… Si je devais faire une conclusion a partir de ce qu’on vient de voir, je dirais que html5 à vraiment tout prévu, on a une balise pour tout, c’est assez sympa, même si il va y avoir du boulot pour tout apprendre ^^ . N’hésitez pas à commenter, et, que pensez vous du html5?

A la prochaine !