Le Post Infeeny

Les articles des consultants et experts Infeeny

Archives de Catégorie: Non classé

Compiler et minifier les fichiers .less en fichier min.css

Objectif

L’objectif de cet article est d’ajouter une tâche Gulp à vos build définis sur VSTS pour compiler et minifier les fichiers .less.

Prérequis

  • Un projet VSTS avec une application web ASP.NET.
  • Une définition de build pour l’application ASP.NET du projet
  • Installer Node.js :
    • Sur le poste de développement pour définir la tâche Gulp
    • Sur le serveur de build, pour exécuter la tâche Gulp

Création de la tâche Gulp

La création de la tâche Gulp pour compiler et minimiser les fichier .less en fichier .min.css, est faite sur un poste de développement au sein de visual studio 2015.

Poste de développement

Prérequis

En plus de l’utilisation de visual studio 2015, il faut installer :

  • Node.js : pour la gestion et l’exécution des package npm. A télécharger ici
  • Task Runner Explorer: Il s’agit d’une extension pour Visual Studio afin de tester et gérer les tâches Gulp. A télécharger ici

Configurer gulp pour l’application web

Il faut ajouter au projet de l’application web 2 fichiers afin de configurer gulp :

  • gulpfile.js : contient les définitions des tâches Gulp à exécuter
  • package.json : contient les listes des packages nécessaire à l’exécution des tâches définies dans le fichiers précédents

Script de la tâche gulp « less » pour compiler et minifier les fichiers .less en .min.css

var gulp = require('gulp');
var less = require('gulp-less');
var path = require('path');
var watch = require("gulp-watch");
var rename = require('gulp-rename');
var minifyCSS = require('gulp-minify-css');
var plumber = require('gulp-plumber');

gulp.task('less', function () {
    return gulp.src('./Content/**/*.less')
    .pipe(plumber())
      .pipe(less({
          paths: [path.join(__dirname, 'less', 'includes')]
      }).on('error', function (err) {
          console.log(err);
      }))
      .pipe(minifyCSS().on('error', function(err) {
            console.log(err);
       }))
        .pipe(rename({suffix: '.min'}))
      .pipe(gulp.dest('./content/'));
});
Et ci-dessous le fichier de configuration package.json associé
{
  "name": "Mon projet",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "gulp": "^3.9.1",
    "gulp-less": "^3.3.0",
    "gulp-rename": "^1.2.2",
    "gulp-minify-css": "^1.2.4",
    "gulp-watch": "^4.3.11",
    "gulp-plumber": "^1.1.0"
  }
}

 Tester la tâche Gulp

Sous Visual Studio :

  • Cliquez droit sur le fichier gulpfile.js
  • Dans « l’explorateur de solution »cliquez sur « Task Runner Explorer »Menu_Task_runner.png
  • Dans la fenêtre de « Task Runner Explorer », Cliquez droit sur la tache « install » du package.json
  • Cliquez sur « Run »pour installer les packages en local à la solutionRun_Task_Install.png
  • Dans la fenêtre de « Task Runner Explorer », Cliquez droit sur la tache « less »
  • Cliquez sur « Run »pour exécuter le test de la tâcheRun_Task_runner

Ajouter la tâche au build VSTS

Prérequis sur le serveur de build

Le serveur de build doit contenir tout le nécessaire à la compilation de la solution. Node.js doit donc être installé sur le serveur de build. A télécharger ici

Modification de la définition du build VSTS

  • Connectez sur VSTS
  • Allez dans « Build & Realease »/Builds
  • Editez la définition du build pour lequel vous souhaitez ajouter la tâche Gulp
  • Ajoutez une tache « NPM »Add_Task_Npm
  • Configurez cette tache afin d’installer les package npm nécessaire à l’exécution sur la tâche gulp précédemment créée: « less »
    • Working folder : répertoire du projet contenant le fichier package.json
    • npm command : install
    • arguments : -configConfig_Task_Npm.png
  • Ajoutez une tâche « Gulp » afin d’exécuter la tache « less »Add_Task_Gulp
  • Configurez cette tâche afin d’exécuter la tâche gulp précédemment créée: « less »
    • Gulp File Path : Chemin du répertoire du projet contenant le fichier gulpfile.js
    • Gulp Task(s) : nom de la tâche à exécuter
    • Arguments : Arguments nécessaire à la tâche
    • Working Directory : Chemin du répertoire de travail, comme on travaille avec les packages npm définis pour le projet, il s’agit du répertoire du projetConfig_Task_Gulp.png
  • Cliquez sur « Save »

Maintenant votre build VSTS exécute une tâche Gulp pour compiler et minifier les fichiers .less !

 

[SQL 2016]Introduction au Row Level Security

Voici une nouveauté intéressante de SQL Server 2016

Le Row Lever Security (RLS)

Qu’est-ce que c’est ?

Le Row Level Security permet de sécuriser des données au niveau des lignes.

Grace au Row Level sécurité on peut attribuer des rôles et afficher les données correspondant au rôle correspondant à l’utilisateur logué.

Lire la suite

Introduction à PolyBase

PolyBase :

Polybase est une technologie qui permet de requêter et de combiner des données non-relationnelles et relationnelles à partir de SQL Server

PolyBase supporte Hadoop et Azure Blob Storage

Les requêtes sont optimisées pour pousser le calcul vers Hadoop

Comment créer une table polybase :

Lire la suite

Les Temporal Table SQL Server 2016

A la sortie de SQL Server 2016 une nouvelle fonctionnalité est arrivée :

Les Temporal Table !

Qu’est-ce que c’est ?

Vous avez tous eu besoin un jour ou l’autre de devoir auditer vos tables de vos bases de données

Jusqu’à maintenant des solutions existaient :

  • Change Data Capture
  • SQL Broker
  • La mise en place de Trigger ?
  • Lecture des logs ?

Mouais ! Pas toujours très convaincantes ces solutions, mais surtout pas facile à mettre en place et souvent contre performante …  Bref !

Lire la suite

SQL 2016 Le live Query Statistique

Dans les versions passés il n’existait pas de fonctionnalités pour connaitre l’état des requêtes en temps réel.

Lorsque qu’on lançait une requête il était impossible de connaitre l’état d’avancement de celle-ci.

Lire la suite

Création d’un cluster SQL SERVER 2016 dans Azure (IAAS)

Objectif :

L’objectif de ce blog est de vous présenter toutes étapes permettant de créer un système de haute disponibilité  SQL SERVER dans Azure

Voici un peu le détail de l’architecture :

1

Dans ce blog nous allons aborder les sujets suivants :

  • Création du réseau virtuel permettant aux machines de communiquer
  • Création des VM nécessaires à notre architecture
  • Installation des Contrôleurs de domaines depuis Azure
  • Préparation du cluster
  • Installation de SQL Server 2016 en mode cluster

Pré requis :

  • SQL SERVER 2016
  • Un compte Azure
  • 1 réseau virtuel
  • 4 machines Virtuelle :
  • 2 Contrôleurs de domaine (DC1 / DC 2) (Windows Server 2012 R2)
  • 2 machines SQL SERVER 2016 (Windows Server 2012 R2)
  • De l’huile de coude et un peu de bonnes volontés 🙂

Partie 1 : Création d’un réseau virtuel 

Afin que nos machines puissent communiquer nous allons créer un réseau virtuel :

2

3

Le reseau est créé :  4

Partie 2 :Création des 4 machines virtuelles nécessaires à notre configuration :

Dans le portail Azure il faut vous rendre dans l’onglet :

Machine Virtuelles :

5

Nous recherchons Windows Server 2012 R2 DATACENTER

6

Une fois la sélection faite nous allons choisir le type de machine pouvant héberger notre « labs » de test :

7

Dans notre cas j’ai choisis 2 machine A0 de base pour les machines Active Directory et 2 machines A1 de base pour les machines SQL Server.

Il est évident que pour des configurations de production ces machines seraient trop juste et risquerai d’être sous dimensionnée par rapport à vos besoins.

Suivant vos besoins vous être libre de choisir les machines qui se rapproche le plus de votre usage.

Voici le détail de création des machines, vous devez répliquer cette opération autant de fois que votre architecture le nécessite.

8

9

 

Partie 3 Installation du contrôleur de domaine :

Un fois la machine DC1 installée connectez vous en remote et installez l’active Directory :

Rendez vous dans Add Roles and Features sur le Serveur :

17.jpg

Choisissez le service Active Directory

14

Une fois installé rendez vous dans l’onglet active directory :

18

Une fois réalisé il faut promouvoir le controleur de domaine :

19

Votre Active Directory est créée

Il faut rajouter le DNS de la machine primaire a toutes les machines du réseau :

Rendez vous sur le portail azure et dans les paramètre de votre machine modifier le serveur DNS Mettez l’adresse du DNS principal comme celui de votre controleur de domaine que vous venez de créer :

22

Ajouter le DC2 en nouveau contrôleur de domaine sur le domaine :

24

Si vous avez besoin d’aide pour l’installation d’un contrôleur de domaine vous pouvez suivre les étapes suivantes :

http://www.windows8facile.fr/windows-server-2012-installer-active-directory-dns-dhcp/

Une fois votre active directory installé vous pouvez ajouter vos 2 machines SQL au Domaine.

N’oubliez pas d’ajouter le DNS secondaire a vos machine le DNS secondaire correspondant a l’adresse IP de la machine DC2.

23

 

Une fois les machines SQL relié on va préparer l’installation du cluster :

On va ajouter 2 disques qui nous permettrons de faire la réplication :

Dans le portail Azure réaliser l’étape suivante :

25

Le disque va s’ajouter sur la machine il faut le formater et le monter pour qu’il soit disponible :

Aller dans le computer management :

26

Ensuite Formater le volume et attribuez lui la lettre F comme lettre de montage :

 

Sur la machine nous allons installer le cluster

27

Sur la machine nous allons installer le cluster ( On retourne dans le menu Add Roles and Features )

28

En suite connecter vous au portail de configuration et effectuez les opérations suivantes :

29

Cliquer sur Validate Configuration et effectuer les opérations suivantes :

3031323334

Il faut en suite modifier les propriétés de l’adresse IP du Cluster :

35.jpg

Rendez-vous sur le DC1 ou DC2 et ajouter un répertoire qui va nous permettre de créer le Quorum du cluster :

C:\Quorum :

Ajouter les droits en lecture / Ecriture au cluster sur ce répertoire (le cluster étant un ordinateur)

1

 

2

Retourner sur la machine SQL1 et réaliser les actions suivantes :

3

 

476

Telechager DataKeeper qui est un outil qui va nous permettre de simuler le SAN d’hébergement de notre cluster et le miroir de stockage sur azure.

Datakeeper est disponible ici et peut être demandé en version de démonstration pour 14 jours.

Pour plus d’information : http://us.sios.com/products/datakeeper-cluster/

Installer Datakeeper et ajouter y votre licence :

8

Ouvrir l’outil Datakeeper et réaliser les actions suivantes :

Creer un job :

Connectez vous  aux deux serveurs SQL ( SQL1 et SQL2 )

910

Nommer le job comme vous le souhaitez.

Attention pour fonctionner DataKeeper necessite qu’un second disque soit monter pour réaliser le miroir ( action que nous avons réaliser précédement)

Içi nous allons « mirrorer » les disques F que nous avons monter précédements, ils permetteront d’heberger notre cluster :

1112

Nous allons creer un mirroir synchrone pour notre cas :

13

Une fois l’action réalisé DataKeeper nous informe que le volume est éligible au cluster cliquez sur oui :

 

14

Dans DataKeeper verifier que la synchronisation fonctionne bien :

 

15

Partie 4 :Installation de SQL Server 2016 :

Sur la machine SQL 1 :

16171819

Dans notre cas nous allons faire demarrer le service avec notre compte administrateur mais l’idéal est de creer un compte de service spécifique pour le demarrage des services

2021

En suite lancer l’installation suivante :

2223242526

On spécifie une IP pour le Cluster SQL Server

27

Ne pas oublier d’ajouter un administrateur

28

 

Rendez-vous sur la machine SQL2 :

313233343536

Votre cluster est prêt :

N’oubliez pas d’activer les ports distants pour accéder depuis l’extérieur a SQL Server  :

Et d’installer le management studio :

40

pour l’installer cliquer sur le liens suivant qui va vous envoyer sur une page web pour telecharger l’outil et l’installer :

39

Merci a Datakeeper pour leur aide dans l’élaboration de ce tutoriel :

Si vous avez besoins voici des liens utiles :

Creating a SQL Server 2014 AlwaysOn Failover Cluster (FCI) Instance in Windows Azure IaaS #Azure #Cloud

https://azure.microsoft.com/fr-fr/documentation/articles/active-directory-new-forest-virtual-machine/

https://channel9.msdn.com/Series/Windows-Azure-IT-Pro-IaaS/05

https://azure.microsoft.com/fr-fr/documentation/articles/active-directory-install-replica-active-directory-domain-controller/

Windows Server Failover Cluster on Azure IAAS VM – Part 1 (Storage)

https://azure.microsoft.com/en-us/documentation/articles/virtual-machines-windows-classic-portal-sql-alwayson-availability-groups/

Bon courage.

Julien PIERRE                                                                                                                                       Consultant MSBI

 

 

 

 

 

Écriture/lecture/modification de fichiers dans un projet Universel app/UWP et cordova

Dans nos applications, nous avons pris le parti d’écrire nos fichiers en JSON. Nous avons donc conçu une abstraction (en WinJS, avec un système de promises) qui nous permet d’utiliser des méthodes claires et simples sur toutes les plateformes (WinRT/UWP ou Cordova (iOS/Android) )

Ce module « DataContainer » est disponible dans notre libraire WinJSContrib (Github)

Dans WinJSContrib.DataContainer, nous avons 4 fichiers qui exposent les mêmes méthodes avec des implémentations différentes :

  • read : lecture d’un élément
  • save : enregistrement d’un élément
  • remove : suppression d’un élément
  • list : liste des fichiers d’un container
  • child : création/accès container enfant

Dans une application WinRT/UWP nous allons naturellement utiliser la couche WinRT/UWP pour écrire/lire les fichiers. Pour cela il suffit d’inclure le fichier « winjscontrib.datacontainer.winrt.file.js »

Dans une application cordova IOS ou Android, nous avons plusieurs choix :

  • Utiliser une base de données : winjscontrib.datacontainer.cordova.database.js
  • Utiliser le système de fichiers avec le plugin file : « winjscontrib.datacontainer.cordova.file.js »
  • Utiliser le localStorage : « winjscontrib.datacontainer.localstorage.js » (utilisable en WinRT aussi)

Ensuite, il faut instancier un container parent et l’utiliser partout dans l’application.

Dans le JS des applications Windows 8/Phone il suffit d’instancier le container (dossier) parent :

MyApp.Data.container = new WinJSContrib.DataContainer.WinRTFilesContainer(undefined, { logger: WinJSContrib.Logger });

Et changer WinRTFilesContainer par notre choix (CordovaDatabaseContainer par exemple) pour l’application cordova en faisant attention de ne l’appeler qu’après l’enclenchement de l’évènement deviceready.

Et c’est tout, la magie s’opère à l’intérieur de notre librairie 🙂

Quelques exemples d’utilisation :

  • Pour lire un fichier :
  • Data.container.read("objKey").then(function (data) { }, function (error) { });
    
  • Supprimer un fichier :
  • Data.container.remove("objKey").then(function () { }, function (error) { });
    
  • Enregistrer un fichier :
  • Data.container.save("objKey",obj).then(function () { }, function (error) { });
    
  • Accès à un container enfant (sous dossier) avec la lecture d’un fichier fichier :
  • Data.container.child(folderid).read("subObjKey").then( function (subObjInFolderID) { }, function (error) { }));
    
  • Liste des fichiers dans un container :
  • Data.container.list().then(function (res) {}, function (error) { });
    

Workaround to use and debug TypeScript with UWP apps and Visual Studio 2015 update 2/3

Since the Update 2 of Visual Studio, the TypeScript debugging in UWP apps is broken.

After a lot of discussions on the TypeScript repo, Mine Yalcinalp Starks give me a workearound that works just perfectly 🙂

And here the solution (I assume you’re running in an English locale here, otherwise I don’t think the workaround is applicable):

Close VS.
In an administrator command prompt:

cd %ProgramFiles(x86)%\msbuild\microsoft\visualstudio\v14.0\typescript
mkdir en
copy *.xaml en
copy TypeScript.Tasks.dll en\TypeScript.Tasks.resources.dll

The behavior that breaks the TypeScript integration in UWP (In reality, typescript is not officially supported in UWP apps, it will be in VS15 « next ») is potentially due to a TypeScript installation bug.

SQL Server 2016 SSRS et les rapport Hybrid

Bonjour,

Suite à notre session au JSS en date  01/12/2015 avec Mohamed Ismail BEN LAMINE @Sam_Tun ou nous avons présentés les nouveautés SSIS et SSRS SQL 2016, je vais vous exposer une partie intéressante : SSRS et les rapports hybrid.

Pour info vous pouvez consulter la vidéo de notre session ici :

Depuis l’arrivée de la CTP 3.0 de SQL Server 2016 il y a possibilité de publié des parties de Rapport SSRS dans Power BI « On Premise ».

Aujourd’hui nous allons voir comment réaliser cette opération :

Se connecter au SQL Server Reporting Services Configuration manager :

1

Se connecter à l’instance Reporting services :

2

Se rendre dans le nouvel onglet : Power BI Integration

3

S’enregistrer :

4

Vérifier l’enregistrement :

5

Redémarrer le service SSRS une fois l’enregistrement effectué sinon le « pin » du rapport sera impossible :

6

7

8

Se rendre au niveau du serveur de rapport :

9

Cliquer sur le bouton My setting et s’enregistrer sur le serveur de rapport :

10

Ouvrir un rapport pour effectuer le « pin » : sélectionner l’élément à mettre a disposition sur Power BI ( Attention tous les éléments ne peuvent pas être mis a disposition sur Power BI )

11

Une fois l’élément sélectionné choisissez la fréquence de rafraîchissement et le rapport dans lequel vous souhaitez l’intégrer :

17

12

Une fois la mise a disposition de l’élément sur Power BI réalisé.

L’écran suivant s’affiche :

13

Attention : Au moment ou j’écris cet article, le multi langue n’est pas correctement supporté et des bug d’affichage peuvent subsister pour éviter cela il est préférable de mettre tout vos paramètres régionaux dans la langue de Shakespeare.

Un peu d’aide à ce propos : http://windows.microsoft.com/fr-fr/windows/change-system-locale#1TC=windows-7

Une fois cette étape réalisé vous pouvez vous rendre sur le site Power BI pour vérifier le bon « pin » de votre partie de rapport sur le site « On Premise »  :

https://powerbi.microsoft.com/en-us/?WT.srch=1&WT.mc_ID=SEM_TUTXQCC8

14

Il faut savoir que pour pouvoir réaliser cette opération l’agent SQL Server doit être activé pour la raison suivante :

A chaque élément ajouté, une tache est créé permettant d’aller rafraichir les données dans power BI voici un exemple de jobs créé lors de cette opération et que l’on retrouve dans l’agent :

15

 

Le défaut c’est que le nom ne correspond pas clairement à une tache. De plus, après suppression d’un élément dans Power BI la tache n’est pas supprimé automatiquement.

Vous en conviendrez qu’il est difficile de faire du ménage dans ces conditions !  Il y a de quoi faire perdre ses cheveux à un administrateur de bases de données !

Pour votre parfaite information voici à quoi ressemble le script de mise a jour d’un élément :

16

Celui ci va lancer le rafraichissement de la partie de rapport définie lors d’un créneau horaire spécifique.

Conclusion :

Nous sommes dans un système en cours d’élaboration avec quelques limites  mais qui semble intéressant d’utiliser, il ne vous reste plus qu’a essayer 🙂

Je tiens à remercier mes confrères: Mohamed Ismail BEN LAMINE et Frédéric Brossard pour l’aide qu’ils m’ont apportés lors de la réalisation de cette session et de cet article.

Pour aller un peu plus loin :

Julien PIERRE

Consultant MSBI

#SQL Server 2016 | nouveautés POWER BI | CTP 3.0 | nouveautés SSRS

 

 

How to use Vorlon.js desktop

Vorlon.js is now available as a desktop version for Windows and Mac OSX. You could dowload them on Vorlon.js website and get started using Vorlon in a few seconds.

If you want to know more about Vorlon, check out this getting started video. There are also some great articles about using Vorlon.js. In this post, we will focus on the desktop version and its UI.

Vorlon desktop helps you use Vorlon to debug your website without setup  pre-requisites, and help you start and configure your environment very easily.

screen.PNG

On the left side, you have a menu bar.

menu

It gives you access to Vorlon’s logs, settings, and the about page with usefull info and links.

The default settings will probably fit your needs, but you could change it with the dedicated screen. It might be usefull, especially if you need to change ports (if you want to run it side by side with the server version of Vorlon for example).

config

To start debugging your website using Vorlon.js, just add this script to your website or application (it’s so usefull for cordova applications !):

<script src="http://MCNTAB011:1337/vorlon.js"></script>

Vorlon has a session mecanism to differenciate client web sites and applications. If you want to define a session, you just have to specify it in the url like this :

<script src="http://MCNTAB011:1337/vorlon.js/mysession"></script>

When using the desktop application, it’s likely that you will stick to the home screen. From there, you could see if Vorlon server is running, and start or stop it easily (Vorlon server will start automatically when you launch the application).

vorlon status

The desktop version also helps you manage your sessions, and configure Vorlon plugins for each session. The home page displays the list of connected and configured sessions. You could add and configure a session even if no client is connected.

sessions.PNG

The green dot indicate that the session is in use. The empty dot means that there is no client connected.

session options.PNG

For each session, you could see the number of connected clients, and open the Dashboard for that session.

dashboard.PNG

The last button helps you configure your session. You could choose if the client must receive socket.io (if your website already use socket.io, turning this off may helps), and turn each plugin on or off.

session config.PNG

We really hope you will enjoy the desktop version. It’s a great way to get started using Vorlon.js. We welcome any feedback so feel free to join us on github to log your feedback or any issue you may have.