opsone
Contactez-nous contactcontact
  • 20 mars 2019
  • Tech

Technologies Open Source 2019 [Back-end / Front-end] chez Opsone.

Dans cet article, petit tour des technologies back-end & front-end que nous utilisons chez Opsone, Agence web, pour la création de:

  • Sites e-commerce
  • Applications métiers
  • Applications mobiles
  • Sites évènementiels
  • Sites vitrine
  • Portails web
  • Jeux marketing
  • etc…

Nous vous avons fait une sélection de nos indispensables !

 

TECHNOLOGIES BACK-END

 


Résultat de recherche d'images pour "ruby on rails"

 RUBY ON RAILS

Airbnb – Shopify – Groupon – GitHub ont été réalisés sous Rails. 

 

Ruby on Rails (souvent appelé Rails) est un framework MVC pour le développement web libre en langage Ruby.

«  Pour l’histoire de Rails chez Opsone, nous l’avons utilisé dans ses premières années lorsque cette technologie avait encore beaucoup à prouver en France. Elle répondait à une grande partie de nos « problèmes » au niveau du développement sur mesure. Dès 2006, j’étais déjà persuadé de la pertinence de ce framework. Nous avons même réalisé notre tout premier outil de facturation sous Rails ! Au fil des années, Opsone a développé sa maîtrise et exploite désormais pleinement les performances de l’outil. Aujourd’hui, Rails est une technologie mature qui a gagné en notoriété aux yeux des développeurs pour devenir notre outil de référence dans le développement sur mesure qui répond particulièrement aux contraintes de budget et de temps.« 

Ses fondements principaux comme le Convention Over Configuration alliés à ses puissantes mécaniques telles que son Active Record (pont avec la base de données), son Active Storage (gestionnaire de fichier), ses intégrations avec Webpack mais aussi ses systèmes de tests fonctionnels/continus, sont autant d’éléments permettant d’obtenir une remarquable fiabilité et performance pour nos développements. L’ensemble ayant su nous séduire, notamment dans le cadre de nos prestations en contexte RAD (Rapid Application Development).

Kevyn LEBOUILLE – Directeur Technique

 

«  Toutes ses qualités résident dans sa maniabilité, sa productivité, et surtout dans les divers outils complets qui sont mis à disposition au travers une très grande collection de “gems” (extensions modulaires). Ce framework dispose d’une importante communauté très active. Grâce à sa souplesse, il est très efficace pour le développement de sites complexes (tels que les sites métiers), et s’allie très bien dans un cadre de développement Agile.« 

Laura BALK – Développeuse web


Avantages en résumé :  Cadre idéal pour le développement sur-mesure, langage accessible et flexible, pertinence et qualité de la communauté, approuvé par le milieu start-up.

 

      Kevyn LEBOUILLE – Directeur Technique

 

         Laura BALK – Développeuse web

 

NOS RÉALISATIONS RUBY ON RAILS:

 



Résultat de recherche d'images pour "spree logo"

SPREE

 

Spree est une solution E-commerce Open Source qui s’appuie sur le framework Ruby on Rails.

«  En tant qu’engine de Rails, Spree s’adapte parfaitement avec un accès à la globalité du framework. Lorsque nous utilisons des extensions existantes ou sur mesure, il y a toujours possibilité de l’associer au développement Rails. Cette complémentarité entre la solution E-commerce et le framework évite toute interférences entre eux, ce qui rend l’approche idéale !

Étant donné que cette solution est développée sous Rails, les tâches répétitives sont alors simplifiées et ont pour effets d’accélérer considérablement le développement. Sans parler de la liberté de développement et sa capacité élevée de personnalisation. En termes de fonctionnalités, sa richesse demeure dans son architecture réalisée sous forme de module qui fait de Spree une plateforme souple, résistante, offrant une facilité d’exécution.« 

Pour finir, cette solution couvre un large spectre de besoins qui rend l’outil intéressant:

  • Ventes nationales ou internationales
  • BtoC – BtoB
  • Maintenance régulière des extensions
  • Communauté active
  • Divers processeurs de paiements

« Pour l’anecdote, pour le premier projet Rails E-commerce que nous avons réalisé pour un Startupper, nous avons utilisé la solution SPREE »


Avantages en résumé : Tous les avantages de Ruby on Rails, plateforme e-commerce prête à l’emploi et fiable sur le marché, extensions & plug-in à disposition.

 

Kevyn LEBOUILLE – Directeur Technique

 

NOS RÉALISATIONS SPREE:

 



Résultat de recherche d'images pour "drupal"

DRUPAL

Tesla – NASA – Taboola sont des sites réalisés sous Drupal.

 

«  Drupal est un des systèmes de gestion de contenu les plus populaires (aussi appelé CMS en anglais, pour Content Management System), représentant 5% des CMS utilisés sur le web (classé en troisième position derrière WordPress représentant 60% des CMS et Joomla! qui lui en représente 6%). Il est arrivé en dernier parmi les CMS les plus connus mais est très vite devenu populaire, notamment depuis la version 8, dont les composants s’appuient sur le framework Symfony.
Il est surtout utilisé par des agences web pour des projets d’envergure sur-mesure. Cela est dû à sa grande flexibilité ainsi qu’à sa communauté, mais il reste plus difficile à maîtriser dans les règles de l’art à cause de sa relative complexité. En effet ses approches et sa structuration robuste permettront l’approfondissement des fonctionnalités les plus spécifiques tout en maintenant un contrôle qualitatif sur le développement réalisé. Sa grande bibliothèque de modules mise à disposition ainsi que sa gestion des mises à jour de sécurité ont su participer grandement à son succès et à son adoption croissante.

Au sein d’Opsone, j’ai eu l’occasion de travailler sur un grand nombre de projets CMS, mais Drupal reste mon grand favori. Avec lui, il est toujours possible d’arriver au bout des défis techniques que le web nous impose, et permet de mettre en place des fonctionnalités complexes plus rapidement et plus facilement.
En quelques mots, ce qui rend Drupal aussi génial, c’est qu’il est puissant, populaire, modulable, sécurisé, et surtout illimité en terme de possibilités de développements.« 

 

Avantages en résumé : Toutes la richesse d’un CMS prêt à l’emploi, orienté vers les réalisations complexes et adaptable à façon, robustesse qui n’est plus à prouver.

 

Noémie KERROUX – Développeuse web et mobile

 

NOS RÉALISATIONS DRUPAL :



Image associée

 WORDPRESS

LVMH – Vivendi – Opsone… Sont des sites réalisés sous WordPress.

 

«  WordPress est le système de gestion de contenu (CMS) le plus utilisé dans le monde et s’il est aussi populaire, ce n’est pas pour rien. En effet, il permet de créer tout type de site internet, du site vitrine au site e-commerce, et de rendre tout le contenu des sites administrable. Mais ce qui fait sa force avant tout sont sa rapidité de déploiement ainsi que son interface d’administration simple et intuitive. En résulte alors un système très souple et rapide à mettre en place afin de nous permettre de répondre au quotidien à nos défis clients (budget et temps de réalisation).

Grâce à son système de thèmes et de plugins, est aussi extensible à volonté, et nous pouvons nous appuyer sur sa grande communauté lors de nos développements, notamment avec des plugins populaires comme Meta Box ou WPML pour la gestion des traductions pour ne citer qu’eux.« 

Pour info, le site de notre Agence web Opsone, ainsi que le blog que vous êtes en train de lire, ont été réalisés sous wordpress !

Avantages en résumé : Grande possibilités de développement, grande communauté, CMS en constante évolution, souplesse de mise en oeuvre, interface pour les utilisateurs du backoffice simple d’accès.

 

Robert SAYTHATHONGSAK – Développeur web

 

NOS RÉALISATIONS WORDPRESS:



Image associéeWOOCOMMERCE

«  WooCommerce est le plugin de référence sur WordPress qui permet de transformer le CMS natif en un puissant CMS e-commerce.

Il est simple d’installation et son interface l’est aussi bien dans le cadre de nos développements, que pour l’utilisateur final. De multiples plugins supplémentaires permettent de gérer tous les aspects d’un e-commerce, par exemple le paiement avec le plugin Stripe, l’expédition avec les transporteurs comme Chronopost, la gestion des factures… Son aspect facilement personnalisable et sa facilité de mise à jour sont des éléments qui jouent en sa faveur.

C’est pour cette raison que nous conseillons et utilisons ce plugin dans le cadre d’un site e-commerce aux besoins standards.« 

Avantages en résumé : Tous les avantages de WordPress, plateforme e-commerce prête à l’emploi, extensions & plug-in à disposition.

Robert SAYTHATHONGSAK – Développeur web

 

NOS RÉALISATIONS WOOCOMMERCE:



Résultat de recherche d'images pour "symfony png"
SYMFONY (PHP)

BlaBlaCar – Spotify  Dailymotion ont été réalisés sous Symfony.

 

Symfony est un Framework formé d’un ensemble de composant (PHP) et reposant sur une architecture Modèle-Vue-Contrôleur (MVC).

«  Sachant que PHP est utilisé par plus de 80% des sites (article de « développez.com »), inutile de dire que la communauté n’a cessé de s’agrandir depuis la version 1 (2005) jusqu’à la version 4 (aujourd’hui) avec d’importantes ressources, d’aides et tutos à disposition des développeurs. Symfony offre une structure commune pour une meilleure maintenabilité, évolutivité et d’une manière générale, une meilleure productivité ! « 

Parmis les principales mécaniques ayant contribuées à son succès nous pouvons par exemple citer sa couche d’abstraction de modèles de donnée Doctrine ou encore son outils de debuggage très performant : le Profiler. Symfony possède aussi son système d’extensions au travers ses Bundle. Ses principes clés : flexibilité, standardisation et stabilité.

Tous ces éléments font de ce framework une boîte à outils redoutable à mettre à disposition de nos clients ayant fait le choix d’orienter leur SI sur le monde PHP. »

Avantages en résumé : approche Framework (structuration, normes, etc..), développement sur-mesure, force de la communauté, maturité prouvée, cela au sein de la technologie web la plus répandue.

Alban LE GAL – Développeur web

 

NOS RÉALISATIONS SYMFONY:



TECHNOLOGIES FRONT-END

 

Résultat de recherche d'images pour "sass png"

SASS

Sass est un préprocesseur CSS. Autrement dit, c’est un langage de description compilé en CSS.

«  Mettre en forme un site internet se révèle souvent être une tâche longue et répétitive. En effet, le manque de flexibilité du langage CSS rend difficile l’optimisation de son process d’écriture. Pour palier à cette problématique, il existe des outils que l’on appelle des préprocesseurs CSS qui deviennent vite indispensables pour un résultat de meilleure qualité avec un temps de développement plus court. Ils enrichissent l’écriture des fichiers style par l’implémentation de différentes fonctionnalités dont ne dispose pas le langage CSS. Cependant, il faut tout de même noter que pour être interprété par le navigateur internet ils doivent être compilés en CSS.
A Opsone, nous avons opté pour le langage SASS. L’utilisation de cet outil nous permet d’améliorer la productivité et la maintenabilité de part l’utilisation de variables, mixins et fonctions qui permettent de mieux organiser le code car il y a moins de répétition. De plus, le système d’imbrication des classes rend le code beaucoup plus léger et lisible. Il n’est plus nécessaire d’écrire plusieurs fois la même classe.« 


Avantages en résumé : Gain de temps, structuration et lisibilité du code, maintenabilité assurée, le tout afin de fluidifier au maximum les processus de production.

 

Maxime GUIONEAU – Développeur Front-End et Intégrateur web

 

NOS RÉALISATIONS SASS: 



Résultat de recherche d'images pour "webpack png"

WEBPACK

 

Webpack est un outil qui permet de modulariser notre code, c’est à dire séparer notre code JS ou CSS en plusieurs fichiers. Il analyse les dépendances de nos modules et génère les fichiers statiques correspondants.
Il permet entre autres de :

  1. Utiliser les derniers standards JavaScript sur tous les navigateurs en convertissant du code écrit dans une version ECMAScript 2015+ en une version plus ancienne à l’aide de l’outil Babel
  2. Compiler du SCSS en CSS
  3. Installer un serveur de développement avec rechargement automatique des pages (Hot Module Reload)
  4. Minifier les fichiers Javascript et CSS
  5. Mettre en place des environnements de production et de développement

Mais alors quelle est la différence avec des outils comme Grunt ou Gulp ?

Ces outils sont des automatiseurs de tâche qui, comme leur nom l’indique, permettent de rendre automatiques certaines tâches chronophages et répétitives. Ils décrivent le contenu de ces tâches et la façon dont elles doivent s’enchainer. Si Webpack intègre bien ces processus dans ses mécaniques, sa philosophie va plus loin car elle a pour but d’organiser le code en modules. Chaque module est unique, indépendant, portant sur un usage spécifique et embarque ses propres ressources statiques (CSS, images, fonts).
Webpack est particulièrement utilisé conjointement avec des frameworks comme React, VueJS ou Angular qui reposent sur cette notion de composant autonome, cohérent et complet.


Avantages en résumé : portabilité avec d’autres initiatives technologiques très répandues, structuration, maintenabilité et lisibilité du code, le tout toujours afin de fluidifier et rationaliser la production.

 

DSC_5109

Katia MOREIRA – Développeuse Front-End et Intégratrice web

 

NOS RÉALISATIONS WEBPACK:



Résultat de recherche d'images pour "react js png"

REACT JS

Facebook – Netflix – Instagram – Dropbox ont été réalisés sous REACT JS.

 

React JS est une librairie Javascript réalisée par Facebook qui permet de créer des « single page applications (application web monopage) et construire des interfaces utilisateurs.

«  L’objectif est de garantir l’expérience utilisateur en évitant le chargement de nouvelles pages à chaque action effectuée.  On retrouve généralement cette technologie pour la création d’applications et de back-offices qui se traduit par une interface nettement plus applicative contrairement aux sites web, ou l’utilisation de React est plus rarement sollicité.

Concrètement, React permet de créer des squelettes d’applications alimentées par des API/Websocket (données provenant de systèmes tiers).

Niveau technique, React possède un « Shadow DOM » qui favorise la mise à jour des informations. Plutôt que de faire des modifications directement dans le DOM avec Javascript, une simple mise à jour d’une variable permet d’indiquer au Shadow DOM d’aller mettre à niveau le DOM. On arrive finalement à une structuration de code de qualité avec une application organisée et maintenable.  »


Avantages en résumé : structuration, maintenabilité et lisibilité du code, ainsi qu’offrir à l’utilisateur un confort d’utilisation/navigation en orchestrant par son biais un ensemble de processus complexes.

 

Jérémy CHAUFOURIER – Directeur Technique Application/Mobile

Nos principales réalisations React JS ont été à destination de nos outils interne (outil calendrier, etc).

 



 

Pour finir :

Chez Opsone, nous travaillons avec les dernières technologies qui selon nous, sont les plus performantes et adaptées pour créer des sites internet, applications mobiles et applications métiers. Notre but est d’atteindre, mais aussi de faire conserver, un niveau de qualité et de stabilité à tous nos projets et cela pour tous nos clients. Nous adaptons constamment nos méthodes de travail aux dernières technologies pour rester alignés à l’évolution des normes et des outils Internet. Toutefois nous veillons en parallèle à ne pas non plus céder aux derniers effets de mode technologiques sans être certain de pouvoir les inscrire dans l’intérêt des projets et de leur pérennité.

Le web ne cesse de se développer et cette liste a donc de grandes chances d’évoluer dans les années, mois, semaines… à venir !

 

Si vous avez la moindre question, n’hésitez pas à prendre contact.

Par mail:
contact@opsone.net

ou

Par téléphone:
01 85 42 00 10

Opsone

Digital by Humans

Les derniers articles

10 bonnes raisons de passer de Photoshop à Sketch !


4 février 2019

Tuto. [OpenStreetMap] OpenLayers et Animated Cluster


30 janvier 2019