Using PHP/MySQL with Google Maps - Google Maps API Ben Appleton, Google Geo TeamWith contributions from Lary Stucker, Maps API DeveloperApril 2007 This tutorial is intended for developers who are familiar with PHP/MySQL, and want to learn how to use Google Maps with a MySQL database. After completing this tutorial, you will have a Google Map based off a database of places. The map will differentiate between two types of places—restaurants and bars—by giving their markers distinguishing icons. An info window with name and address information will display above a marker when clicked. The tutorial is broken up into the following steps: Creating the Table When you create the MySQL table, you want to pay particular attention to the lat and lng attributes. Note: This tutorial uses location data that already have latitude and longitude information needed to plot corresponding markers. If you prefer interacting with your database through the phpMyAdmin interface, here's a screenshot of the table creation. Populating the Table Outputting XML with PHP
MySQL Vous avez de nombreuses données à traiter et vous voulez les organiser correctement, avec un outil adapté ? Les bases de données ont été créées pour vous ! Ce tutoriel porte sur MySQL, qui est un Système de Gestion de Bases de Données Relationnelles (abrégé SGBDR). C'est-à-dire un logiciel qui permet de gérer des bases de données, et donc de gérer de grosses quantités d'informations. Il utilise pour cela le langage SQL. MySQL peut donc s'utiliser seul, mais est la plupart du temps combiné à un autre langage de programmation : PHP par exemple pour de nombreux sites web, mais aussi Java, Python, C++, et beaucoup, beaucoup d'autres. MySQL avec l'interface PHPMyAdmin MySQL avec une console windows Différentes façons d'utiliser MySQL Quelques exemples d'applications Vous voulez créer un site web dynamique en HTML/CSS/PHP avec un espace membre, un forum, un système de news ou même un simple livre d'or. Points abordés dans ce tutoriel
Dynamisez vos sites web avec Javascript ! Bienvenue à toutes et à tous, Qui n'a jamais entendu parler du JavaScript ? Créé dans les années 90 en tant que simple langage de script, JavaScript est désormais un des poids lourds du développement Web ! Qui plus est, il se démocratise au sein d'autres environnements comme les serveurs avec le célèbre Node.js, les applications pour smartphones et tablettes, avec PhoneGap d'Adobe, les applications pour Windows 8, mais aussi les logiciels multiplateformes. Bref, JavaScript est partout ! Mais avant de se targuer de créer des applications pour serveurs, tablettes et Windows, il faut d'abord apprendre la base et s'intéresser aux origines : le JavaScript au sein des pages Web. Voici quelques exemples de ce qui est réalisable grâce au JavaScript : Sur ce, bonne lecture !
Ajax Tutorial - MySQL We already know how to run an external PHP script with AJAX, so let's take it to the next level and pull some data down from a MySQL database. Our "order.html" file and PHP script will have to be updated and we also need to make a new database. To clearly illustrate how easy it is to access information from a database using Ajax, we are going to build MySQL queries on the fly and display the results on "order.html". Create a new database or use an existing one and then import the table ajax_example.sql to that database. This sql file will create the table ajax_example and insert all the data rows. The table has four columns: ae_name - The name of the person ae_age - Person's age ae_sex - The gender of the person ae_wpm - The words per minute that person can type We want to be able to build queries from our HTML file, so there are a few form elements that will need to be added. Maximum Age (Text Input) - Let the user select the maximum age to be returned. order.html HTML/Javascript Code: <?
SQL Avant d'utiliser les jointures, il faut que votre base de données relationnelle soit correctement conçue. Vous apprendrez dans cette partie quelques règles de base (loin d'être exhaustives) dans la conception des bases de données. Pour ce faire, utilisons un exemple. Citation Vous êtes informaticien dans une agence de presse et vous devez stocker les articles des journalistes de l'agence dans une base de données relationnelle. Ces règles n'étant pas faciles à comprendre de prime abord, appliquons-les à notre exemple. On aurait a priori tendance à créer une table "articles" ayant la structure suivante (notez l'absence de caractères spéciaux, d'espaces et d'accents dans les noms des champs) : Ce qui donne, avec quelques données (exemple) : On remarque cependant qu’il y a répétition des informations sur l'auteur. On va donc créer une table "auteurs" en relation avec la table "articles" pour éviter d'avoir une répétition inutile de toutes les informations sur les auteurs. Mise en pratique :
Simplifiez vos développements JavaScript avec jQuery Si vous avez déjà programmé en JavaScript, vous savez que ce langage est puissant, mais aussi « verbeux » et souvent assez complexe à mettre en œuvre. Si vous voulez accéder à toute la puissance de JavaScript en utilisant des instructions simples, logiques, faciles à comprendre et à maintenir, jQuery est vraiment fait pour vous ! Avec ce cours, je vous propose de découvrir les multiples facettes du framework jQuery. De la sélection d'éléments à la manipulation du DOM, en passant par l'animation, les requêtes AJAX, l'utilisation et la création de plugins, la création de jeux et bien d'autres choses encore ! N'ayez crainte, votre apprentissage se fera en douceur et de très nombreux exemples de code documentés viendront consolider vos connaissances. Au fil des pages, votre approche deviendra de plus en plus naturelle et les nouveaux chapitres ne feront qu'apporter une pierre de plus à l'édifice, sans en ébranler les fondations.
Tutoriel Ajax en exemples Asynchronous Javascript + XMLLa création de pages web dynamiques coté client Ajax est seulement un nom donné à un ensemble de techniques préexistantes. Il dépend essentiellement de XMLHttpRequest, un objet coté client utilisable en JavaScript, qui est apparu avec Internet Explorer 4.0. XMLHttpRequest a été conçu par Mozilla sur le modèle d'un objet ActiveX nommé XMLHTTP créé par Microsoft. Il s'est généralisé sur les navigateurs après que le nom Ajax ait été lancé par un article de J. Pourquoi utiliser Ajax? Ajax permet de modifier partiellement la page affichée par le navigateur pour la mettre à jour sans avoir à recharger la page entière. Ajax est une technique qui fait usage des éléments suivants: HTML pour l'interface. Le terme "Asynchronous", asynchrone en français, signifie que l'exécution de JavaScript continue sans attendre la réponse du serveur qui sera traitée quand elle arrivera. Dynamic HTML est aussi un ensemble de techniques, qui comprend: HTML, CSS, JavaScript. Attributs
Creer un site Responsive Le RWD, s'adapter au nouveau cadre Comment concevoir aujourd'hui une interface qui réagira aux écrans de demain ? Comment ajuster le rendu à son support ? Telles sont les questions du Webdesigner, plus que jamais confronté à la problématique du multi-écran. Ainsi, la diversité des résolutions d'écran lui impose un nombre gradissant de contraintes, mais la conception d'une interface souple et adaptable enrichit son expérience et renouvelle son approche du Web. Cette explosion des usages confirme bien la place prépondérante que le Responsive Web Design va prendre dans l'univers de la création Web. Vous allez donc pouvoir, au travers de ce dossier et de ses tutoriels, appréhender cette technique, connaitre les spécificités qui y sont liées et découvrir les secrets de la conception d'un site RWD. Au sommaire
Tips Facebook: Comment récupérer un access_token pour accéder à la Graph API Vous l’avez sans doute constaté, l’API de Facebook a (encore) changé ! Maintenant il vous faudra un « access_token » pour accéder via l’API Open Graph aux données de page Fan. Ainsi, le script que j’avais publié sur la récupération d’informations provenant d’une page Fan ne marche (pour l’instant) plus. Tout d’abord essayons de comprendre la mécanique. Principe Différentes étapes doivent être accomplies afin de pouvoir à nouveau utiliser l’Open Graph API pour les pages fan. s’identifier en tant que développeurcréer une application où l’on va récupérer certaines informations précieuses.autoriser l’application à utiliser les informations facebookrécupérer un access_tokenutiliser cet access_token pour accéder à la Graph API Détails pas à pas S’identifier en tant que développeur Pour cela, rendez-vous sur la page developers.facebook et acceptez de devenir développeur. Créer une application Allez sur la page facebook.com/developers et cliquez sur « Créer une application » en haut à droite.
Les Bugs D'Internet Explorer en CSS - Bug IE 6 - BUG IE 7 - Compatibilité entre navigateurs - Firefox 2 et 3 (esprit-creatif) Internet Explorer 6 est souvent difficile à contrôler et un jeune webmaster peu vite être dérouté par les différences d'affichage qu'il pourra constater entre Internet Explorer 6 (IE 6), Internet Explorer 7 (IE7) et FireFox (FF). Je vais commencer par vous donner quelques conseils pour éviter un maximum de bugs, puis je vais établir ci-dessous une liste des bugs rencontrés sur Microsoft Internet Explorer 6 et le cas échéant la solution à appliquer. J'ajouterai au fur et à mesure de mes heureuses surprises. Pour m'y encourager, laissez-moi un commentaire ou cliquez sur une bannière si cet article vous a aidé ! A. 1# Bien renseigner son doctype Essentiel à la bonne compréhension de votre code, le doctype va donner une clé à IE 6 pour interpréter votre code HTML. Le DOCTYPE se place tout en haut de votre page HTML. Ex: L'importance va être de choisir le doctype adapté. Plus d'informations : Lire l'excellent article de Pompage.net 2# Valider son code HTML et son CSS B.
Empêcher les flottants de dépasser de leur conteneur Par défaut dans les navigateurs, les éléments positionnés grâce à la propriété CSS float (aussi appelés flottants, ou en anglais floats) sortent du flux de leur conteneur. Autrement dit, les flottants «dépassent». C'est ainsi qu'on se retrouve avec des conteneurs qui font zéro pixel de hauteur, des colonnes qui passent à travers un pied de page, et autres résultats peu souhaitables. Par exemple, avec ce code HTML et CSS les «colonnes» flottantes dépasseront de leur conteneur: <div id="conteneur"><div class="colonne">AAA</div><div class="colonne">BBB</div><div class="colonne">CCC</div></div> Comment bloquer ponctuellement le dépassement des flottants? La propriété overflow La propriété CSS overflow définit comment un bloc doit se comporter lorsqu'un contenu dépasse de ce bloc. Cette propriété a aussi pour caractéristique, lorsqu'on utilise les valeurs autres que visible, de créer ce qu'on appelle un contexte de formatage de bloc. Avantage: technique efficace, tient en une ligne.
Loic Le Meur Digital Brittany: Embeddable Facebook Page Photo Gallery I FINALLY got it! I don't even want to admit the time it has taken me to make this code.... But it is finally done! You can find your album ID by looking in the address bar of your browser while viewing your album: Then paste the code to your webpage and viola! Features: •Photos open in new window. This script only works for Facebook Page albums and NOT personal profile albums. SEE ONE IN ACTION! Like it?