patrickm.consulting

Développeur React.js

React.Js est mon alter ego Delphi sur la toile. Cette belle histoire a commencé avec le JavaScript qui m'a réconcilié avec Java. En dépit de mon inimité avec Java, à ne pas confondre avec Javascript, j'ai décroché pour le compte de mon employeur Exclusive Hôtels, une certification GDS Global Distribution System. J'en étais alors Directeur Technique Informatique.

Après avoir ingurgité du code Java des semaines durant, j'ai pu faire évoluer le moteur de réservation pour le rendre multitâches, et donc suffisamment performant pour répondre aux exigences imposées par l'équipe de certification GDS.

Plus tard, je me suis donc tourné vers le Javascript, tout en résistant aux appels de JQuery dont beaucoup faisaient l'éloge. Je voulais un environnement de développement simple à mettre en œuvre, orienté objet et qui me permettent de réutiliser du code… j'ai choisi React.js.

GetLocation

La fonction GetLocation()

Microsoft Edge ne supporte plus la fonction getLocation : une régression pour les développeurs

Depuis une récente mise à jour, Microsoft Edge ne supporte plus la fonction JavaScript native getLocation, pourtant très utilisée pour obtenir la position géographique de l’utilisateur. Cette régression impacte de nombreux sites et applications web qui s’appuyaient sur cette API pour proposer des services personnalisés ou contextuels.

Une solution de contournement : la fonction getLocation

Pour pallier ce manque, j’ai développé la fonctionGetLocation(), qui s'appuie sur deux api et permet de retrouver le comportement attendu, même sur Microsoft Edge!

Cette fonction, exportée depuis le composant DsCore retourne via une procedure callBack asynchrone, un objet JSON :

{longitude:<city longitude>, latitude:<city latitude>, city:<city name>}

Exemple:

import React, { useEffect, useState } from 'react';
import {GetLocation} from "datasync-core";

const IPCity = () => {
  const [location, setLocation] = useState({ latitude: null, longitude: null, city:null });
  const [error, setError] = useState('');

  useEffect(() => {
    GetLocation({onLocation:(locationObj)=>{setLocation(locationObj)}, onError:(msg)=>{setError(msg)}})
  }, []);

  return (
    <div>
      <h2>City Location</h2>
      {error && <p style={{ color: 'red' }}>{error}</p>}
      {location.city && <p>City : {location.city}</p>}
      {location.latitude && location.longitude ? (
        <p>Latitude: {location.latitude}, Longitude: {location.longitude}</p>
      ) : (
        !error && <p>Detecting location...</p>
      )}
    </div>
  );
};

export default IPCity;