Laravel : Actu la version 6 est dans les back Qui s’est qui pourra freiner l’avancé fulgurante de ce framework PHP?

Laravel 6, la dernière version enfin dévoilé depuis fin Août, depuis ces dernières années Laravel a su gagner des parts de marché par rapport au géant du marché Symfony

Le framework se structure dans sa version 6 dans le support et versioning de ces releases qui depuis quelques temps s’enchainaient à une cadence infernale officiellement nous avons maintenant:

VersionReleaseBug Fixes UntilSecurity Fixes Until
5.5 (LTS)August 30th, 2017August 30th, 2019August 30th, 2020
5.6February 7th, 2018August 7th, 2018February 7th, 2019
5.7September 4th, 2018March 4th, 2019September 4th, 2019
5.8February 26th, 2019August 26th, 2019February 26th, 2020
6.0 (LTS)September 3rd, 2019September 3rd, 2021September 3rd, 2022

extrait de https://laravel.com

Laravel 6 maintenant respecte le semantic versionning.

https://semver.org/

pour rester compatible avec tous les autres packages open source

Mais la plus grosse nouveauté est sa compatibilité avec Laravel vapor https://vapor.laravel.com/ un des derniers nées de l’écosystème Laravel, maintenant les applications Laravel peuvent être serverless! et oui il fallait s’y attendre et c’est ce qu’il manquait à cette stack et à PHP en général, un déploiement on demand avec des ressources serverless pour une scalabilité no limit de votre application et cela c’est le top à des coûts réduits et contrôlés.

En gros c’est quoi Serverless? vous payez uniquement quand vous exécutez une fonction https://aws.amazon.com/fr/lambda/

  • Vous faites une requête http, une lambda fonction est appelé pour traiter votre requête et vous retourner une réponse
  • Vous téléchargez une image, une lambda fonction générè un Thumbnail de votre image
  • Vous envoyez un job dans une queue , une lambda fonction exécute ce job

Vous ne paierez qu’à l’exécution du code et rien d’autre

Le core de Laravel 6 permet d’intégrer de manière transparente cette fonctionnalité pour pouvoir utiliser les fonctionnalités AWS Lambda fonctions.

Au niveau Debug? Laravel 6 dispose d’un nouveau package Ignition pour permettre de débugger et diagnostiquer en profondeur et décrypter les erreurs sur les templates Blade ( équivalent des Twig sous Symfony) et bien d’autres erreurs communes du framework.

Il y a bien sûr d’autres évolutions mais celle ci sont les plus importantes! Comme on le voit Laravel veut scaler plus gros et plus vite sur des environnements complexes à fortes volumétries.

https://laravel.com

WordPress designer sa page login sans un morceau de code

Idéal quand on est débutant , la fenêtre de WordPress un peu fade et peut être pas à l’image de votre site, vous souhaitez la relooker?

  • Vous ne savez pas coder
  • Vous n’avez pas le temps

Voici un petit plugin bien utile :

je vous donne le lien :

Essayez le 😉 et faites moi un retour! perso je le trouve très pratique! et il n’y a rien de compliquer vous pouvez facilement changer

  • L’arrière fond
  • Changer la couleur et la police
  • Changer les noms des champs

JAVASCRIPT SWAL2 Faire des popups de messages du type alerte

On est tous passé par là afficher des popups par différents moyens

le fameux alert(‘hello’) pour afficher un message à l’utilisateur sur une validation de formulaire par exemple mais je dois dire c’est très moche mais pratique pour le Debug

ou alors la fameuse fenêtre modal du framework Bootstrap pour ceux qui utilise ce framework

<div class="modal" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">×</span>
        </button>
      </div>
      <div class="modal-body">
        <p>Modal body text goes here.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary">Save changes</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

Bon je cherchais une librairie pour des alertes de messages simples à mettre en oeuvre peu verbeux et sexy!

j’ai trouvé Swal

https://sweetalert2.github.io/

Je vous donne la page de leurs exemples :

https://sweetalert2.github.io/#examples

suffit de regarder on a une fenêtre avec peu de code et plutôt bien faîtes et ca c’est un must surtout quand notre page web commence à déborder de contrôles javascripts :

Swal.fire({  type: 'error',  title: 'Oops...',  text: 'Something went wrong!',  footer: '<a href>Why do I have this issue?</a>'})

Je vous laisse regarder leur site car la documentation est vraiment bien faîtes!

LARAVEL Manipuler les fichiers

Une des fonctionnalités qui à coup sûr vous êtes confronté ou serait confronté un jour ,c’est le fameux envoi de fichier et gestion des fichiers media quelques soient leurs types et tailles.

  • Comment et ou je les stocke
  • Comment je fais le lien entre le fichier et mon application Laravel : URL temporaire , fixe..
  • Comment je gère la sécurité et les droits d’accès
  • Quels types de droits puis je donner pour accéder à la ressource : public ou privé
  • La performance le download et upload sont consommateurs de ressources : stream gzip pour optimiser la compression.
  • Les interconnexions possibles en plus de stocker localement sur votre serveur de pouvoir stocker sur du Cloud, ou du FTP..
  • Comment proprement j’intègre mon Model Laravel de mon app avec ma gestion de fichiers et de tous les cas cités ci dessus

Pour cela j’ai trouvé un package qui vraiment est le must :

https://github.com/spatie/laravel-medialibrary

Une documentation très bien faites et une simplicité d’utilisation!

https://docs.spatie.be/laravel-medialibrary/v7/introduction/

La classe de base est hasMedia , il suffit de faire hériter votre propre model de cette classe

class PrivateDocument extends Model implements HasMedia{

	protected $table = 'privatedocument';
	
	use HasMediaTrait;
	
	public $timestamps = true;
	
	protected $fillable = array('name','userid','note','created_at','updated_at');
	
	public function assignedUser()
	{
		return $this->belongsTo('Groovel\Cmsgroovel\models\User','userid','id');
	}
	
	
	
	public function hasSharePrivateDocuments(){
	    return $this->hasMany('Test\Easyged\models\SharePrivateDocument','privatedocid','id');
	}
}

Pour y accéder rien de plus simple :

                $document=PrivateDocument::find(id);//id du fichier
    		ici je stocke tous mes fichiers dans une collection appelé private vous pouvez nommer vos collections    		
    		$media = $document->getFirstMedia('private');//pour accéder au fichier
    		$url = $document->getFirstMediaUrl('private');//retourne l'url vers la ressource fichier

Le package va générer une nouvelle table en base : media

qui va maintenir le lien logique entre votre class model Laravel et votre fichier et tout cela de manière transparente

L’API est très facile à utiliser, il est facilement possible de customiser les URL , de resizer les images, et de faire des contrôles de tailles et de type de fichiers stockés.

Cette librairie est très performante, vous pouvez streamer vos fichiers Référez vous à la documentation! et merci au développeur de ce package , beau boulot!

Javascript Upload de fichiers From scratch ou avec une Librairie?

Alors oui il s’agit d’une des fonctionnalités auquel vous n’allez pas y réchapper, à chaque fois on s’arrache les cheveux car :

Mes fichiers sont volumineux et le navigateur rame voir plante

Comment dealer proprement entre le réseau, notre serveur et notre navigateur.

L’idée de base c’est d’utiliser le format binaire blob et de l’envoyer sur le réseau par petits morceaux chunk de cette manière vous éviterez le fameux error 500 ou la page qui mouline à n’en plus finir.

Coté serveur il va falloir consolider l’ensemble de ces chunks pour retrouver notre fichier alors la c’est du boulot et qu’en est il si le fichier plante lors de son envoi est ce que l’on doit tout renvoyer à nouveau?

Bon je vous dévoile une librairie vraiment robuste que j’utilise dans certains projets et qui résout ces problèmes et en plus opensource voici le lien le développeur a vraiment bien taffé

https://github.com/blueimp/jQuery-File-Upload

Ce que je kiffe :

  • Vous pouvez drag and dropper vos fichiers
  • Uploader plusieurs fichiers
  • Faire une pause sur l’envoi de fichier
  • Vous pouvez limiter la taille des fichiers à envoyer
  • Vérifier le type de fichier qui est envoyé

Très simple à utiliser elle repose sur Jquery

$(function () {
    'use strict';

    // Initialize the jQuery File Upload widget:
    $('#fileupload').fileupload({
        // Uncomment the following to send cross-domain cookies:
        //xhrFields: {withCredentials: true},
        url: '/post/private/myfiles',
        autoUpload: false,
        singleFileUploads:true,
        sequentialUploads:true,
        acceptFileTypes: '@',
        maxChunkSize: 1000000,
        maxFileSize:{{@config("test.maxsize_filesupload")}},
        disableImageResize: /Android(?!.*Chrome)|Opera/
            .test(window.navigator.userAgent),
        previewMaxWidth: 100,
        previewMaxHeight: 100,
        previewCrop: true,});
 // Enable iframe cross-domain access via redirect option:
    $('#fileupload').fileupload(
        'option',
        'redirect',
        window.location.href.replace(
            /\/[^\/]*$/,
            '/cors/result.html?%s'
        ))
        .on('fileuploadadd', function (e, data) {
         

         }).on('fileuploadsubmit', function (e, data) {
    
         }).on('fileuploadfailed', function (e, data) {
          
         });
    
  
         
 });
 
});

Je la recommande car les exemples fournis avec sont vraiment complets

et je balance un peu elle s’intègre facilement avec vos frameworks favoris ..Laravel par exemple 😉

JQUERY Le célèbre et indémodable Faire une requête AJAX

JQUERY est l’une des librairies Javascript qui permet de manipuler le DOM HTML intercepter des events de votre page tel que les clics pour soumettre des formulaires

bien utile bien que détrôner par des frameworks javascripts qui sont Reactjs ou Angular ou Vuejs qui proposent et uniformisent une architecture front pour manipuler les pages web intercepter les events et proposer un workflow de traitement

Jquery est une librairie bien utile dans certains cas bien que l’on avait tendance à tout faire avec avant l’apparition des frameworks ci dessus cela devenait vite un plat de spaghetti allez vous faites encore de la validation de formulaire avec Jquery?

Voici quelques morceaux de codes que je vous livre et que j’utilise souvent

Requêtes formulaires AJAX vers un backend :

requête de type post :
function postContent(form,action){
	$.post('/admin/content/'+action, form, function (data, textStatus) {
		if(textStatus=='success'){
			if(data!=null){
		             var parsed = data;
			      if(parsed['success']){
			      /**DO SOMETHING***/
                   }
                    else if(parsed['success']==false){
                          /**DO SOMETHING***/
                    }else{
			 /**DO SOMETHING***/	
		        alert('data problems');
			}
		}else{
			 /**DO SOMETHING***/
			alert('something mistake...problems');
		}
		
	 });
}

requête de type get :
 $.ajax({
                  type: 'get',
                  data : any2url('q',inputData),
                  dateType:'json',
                  url: "/admin/category/edit",
                   success: function(data) {
                	   console.log(data);
                       var parsed = JSON.parse(data);
                       window.location.href = parsed.datas.uri;
                  },
                  error: function(xhr, textStatus, thrownError) {
                      alert(thrownError);
                      alert('Something went to wrong.Please Try again later...');
                  }
                 
              });
    }

C’est très simple pas forcément besoin d’un framework Javascript pour certaines actions de la vie quotidienne l’inconvénient majeur c’est sur du long terme on a tendance à surcharger et cela peu devenir très vite compliquer à debugger mais cela reste une bonne librairie par sa simplicité d’utilisation.

https://jquery.com/

Tu es git ou pas git de choisir Gitlab ou Github?

Les 2 différences fondamentales entre Github et Gitlab
Github c’est soutenu par une entreprise Microsoft alors que Gitlab c’est opensource vous pouvez même installer un serveur Gitlab perso

Un des plus gros point important maintenant chose qui n etait pas le cas dans la version free la création des projets Github est illimité
et ca c’est un plus plus par contre limité à 3 collaborateurs alors qu’avant il fallait payé

Pour Gitlab l’offre free est très compléte pas de limitation de nombre de collaborateurs

Autre différence , la gestion des droits avec Gitlab se fait par rôle alors que Github on manipule des droits de type write read access

Une des principales features que gitlab propose gratuitement est l’intégration continue CI clairement Gitlab s’oriente
vers une communauté de Devops pas seulement de développeurs

Pour les autres services ils s’équivalent

Pour la sécurité de Gitlab je ne suis pas très fan de la double authentification ça m’a l’air compliqué et source de bloquer son compte..

Pour la partie résilience clairement Github est au top alors que Gitlab a connu quelques soucis auparavant mais ça s’est arrangé depuis!

Et la communauté ? Github est trés devant et continue de grimper dans sa popularité parmi la communauté de développeurs et dans les entreprises

Je ne saurais conseiller l’un ou l autre à vous de voir!

https://github.com/ Github

https://about.gitlab.com/ Gitlab

Framework Spring JAVA Comment faire des batchs performants quand on à beaucoup de données?

Besoin d’insérer des fichiers csv dans une base de données? les fichiers sont gros du coup vous allez vous heurter à des problèmes de lenteurs

Vous allez devoir :

  • Lire le fichier par morceaux
  • Insérer par lots dans la base (batch)
  • Faire un commit tous les n lignes
  • Faire des threads pour traiter en parallèle le même fichier et gérer le problème de concurrence d’accès pour ne pas insérer 2 fois la même ligne

Alors si il fallait tout développer from scratch vous voyez vite c’est du boulot!

Spring Frameworks propose toutes ces fonctionnalités et je dois dire pour l’avoir utilisé dans des projets sur de très gros volumes ca le fait! au moent ou j’écris ce post j’utilise :

  • spring-batch-core-4.0.1.release.jar
  • spring-batch-infrastructure-4.0.1-release.jar

vous aurez besoin de définir 3 fichiers configs

  • context.xml les informations de contexte type de base jdbc et repository classe
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="
	http://www.springframework.org/schema/beans 
	http://www.springframework.org/schema/beans/spring-beans-3.2.xsd">

  <!-- stored job-metadata in database -->
  <bean id="jobRepository"
	class="org.springframework.batch.core.repository.support.JobRepositoryFactoryBean">
	<property name="dataSource" ref="dataSource" />
	<property name="transactionManager" ref="transactionManager" />
	<property name="databaseType" value="mysql" />
  </bean>

  <!-- stored job-metadata in memory -->
  <!-- 
  <bean id="jobRepository"
	class="org.springframework.batch.core.repository.support.MapJobRepositoryFactoryBean">
	<property name="transactionManager" ref="transactionManager" />
  </bean>
   -->
 
  <bean id="jobLauncher"
	class="org.springframework.batch.core.launch.support.SimpleJobLauncher">
	<property name="jobRepository" ref="jobRepository" />
  </bean>

</beans>
  • database.xml les informations de connexions à la base
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:jdbc="http://www.springframework.org/schema/jdbc" 
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://www.springframework.org/schema/beans 
	http://www.springframework.org/schema/beans/spring-beans-3.2.xsd
	http://www.springframework.org/schema/jdbc 
	http://www.springframework.org/schema/jdbc/spring-jdbc-3.2.xsd">

  <!-- connect to database -->
  <bean id="dataSource"
	class="org.springframework.jdbc.datasource.DriverManagerDataSource">
	<property name="driverClassName" value="com.mysql.jdbc.Driver" />
	<property name="url" value="jdbc:mysql://" />
	<property name="username" value="" />
	<property name="password" value="" />
  </bean>

  <bean id="transactionManager"
	class="org.springframework.batch.support.transaction.ResourcelessTransactionManager" />
	
  <!-- create job-meta tables automatically -->
  <jdbc:initialize-database data-source="dataSource">
	<jdbc:script location="org/springframework/batch/core/schema-drop-mysql.sql" />
	<jdbc:script location="org/springframework/batch/core/schema-mysql.sql" />
  </jdbc:initialize-database>

</beans>

  • job-documents.xml les classes qui vont être appeler par spring pour parser les fichiers le reader, faire les transformations nécésssaires avant l’insertion en base (mapper) , et la classe qui insére en base le writer
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:batch="http://www.springframework.org/schema/batch" 
	xmlns:task="http://www.springframework.org/schema/task"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://www.springframework.org/schema/batch
	http://www.springframework.org/schema/batch/spring-batch-2.2.xsd
	http://www.springframework.org/schema/beans 
	http://www.springframework.org/schema/beans/spring-beans-3.2.xsd">

  <bean id="document" class="groovel.models.DocumentsToProcess" scope="prototype" />
    
    <!--parsed all input files and extract userid  -->
  <batch:job id="documentJob">
	<batch:step id="step1">
	  <batch:tasklet>
		<batch:chunk reader="itemReader" processor="itemProcessor"  writer="itemWriter" 
			commit-interval="10">
		</batch:chunk>
	  </batch:tasklet>
	</batch:step>
  </batch:job>
  
   <bean id="itemProcessor" class="groovel.processors.DocumentsProcessor">
			<property name="documentDao" ref="documentDao" />
	</bean>
	
	
	<bean id="documentDao" class="groovel.dao.DocumentsDao">
	 <property name="dataSource" ref="dataSource" />
	</bean>
	
	
	
	<bean id="itemWriter" class="groovel.writers.DocumentsWriter">
  	  	<property name="documentDao" ref="documentDao" />
	</bean>
	
  <bean id="itemReader" class="org.springframework.batch.item.file.ResourcesItemReader">

	<!-- Read a pdf file -->
	 <property name="resources" value="file:/inputs/*.PDF" />

  </bean>
  
  
  <!-- build json job for laravel queue -->
  
  <bean id="jobWriter" class="test.writers.JobjsonWriter">
  	  	<property name="documentDao" ref="documentDao" />
	</bean>
  
  
  <bean id="jobReader"
        class="org.springframework.batch.item.database.JdbcCursorItemReader">
        <property name="dataSource" ref="dataSource" />
       <property name="sql"
            value="SELECT id FROM documents where in_error!=1 and is_processed!=1" />
 
        <property name="rowMapper">
            <bean class="test.mapper.RowMapperJobs" />
        </property>
 
    </bean>
  
     <bean id="jobProcessor" class="test.processors.JobsProcessor"></bean>
	
	
  <batch:job id="buildJsonJob">
	<batch:step id="step2">
	  <batch:tasklet>
		<batch:chunk reader="jobReader" processor="jobProcessor"  writer="jobWriter" 
			commit-interval="2">
		</batch:chunk>
	  </batch:tasklet>
	</batch:step>
  </batch:job>
  </beans>

Vous pouvez configurer un workflow et enchainer la succession d’exécutions de différents batches! en définissant des steps et c’est la ou spring est puissant et ou cette fonctionnalité est évidemment un must have!

le lien du projet :

https://spring.io/projects/spring-batch