background preloader

9 frameworks front end en CSS, SASS et LESS

9 frameworks front end en CSS, SASS et LESS
Aujourd'hui sur le Blog Du Webdesign, découvrez une sélection de 9 frameworks front-end. Sass Foundation Foundation est sans aucun doute le plus gros Framework front end Sass. Il est important de noter la possibilité de faire un HTML sémantique, grâces a des mixins qui vont promouvoir vos classes aux rangs des rows et columns que l'on a l'habitude de voir. Cool kitten Cool kitten est un framework responsive pour faire du parallaxe. Inuit Inuit est un framework Sass basé sur la philosophie OOCSS, c'est a dire Object-Oriented CSS. Blueprint Blueprint, peut être le premier "vrais" framework CSS. Stitch Stitch est une bibliothèque de mixins et classes pour Compass géré par la communauté. Less Bootstrap Bootstrap est peut-être le plus connu des frameworks front-end. Less framework Un framework très simple, qui fournit les bases (grille, ... ) sans crouler sous les fonctions inutiles. CSS uniquement grumby Un framework CSS léger contruit sur une grille modulable. Maxmertkit Related:  Frameworks FrontendVeille technologique

Les frameworks CSS responsive design Dans un article précédent, je vous indiquais pourquoi le responsive design est indispensable au succès de votre projet Web. Aujourd’hui, nous voyons les frameworks CSS libres et gratuits permettant de mettre en oeuvre un design adaptatif ! La liste ci-dessous n’est pas exhaustive mais recense les principales librairies open-source que vous pourrez utiliser pour faire des responsives. L’autre solution est de faire du responsive à la main en utilisant les media queries, introduites par CSS3, mais c’est une autre histoire que nous verrons plus tard… Pour l’heure, place aux frameworks CSS ! 1. Cascade framework propose, comme son nom l’indique, d’utiliser au maximum les propriétés en cascade afin de construire ses design templates. Vous voilà désormais armé pour créer les templates de votre projet en design responsive !

» Sass v Less v Stylus: The pros and cons - Web Designer - Defining the internet through beautiful design Which CSS preprocessor will offer the best solution for your project? LESS – lesscss.org LESS was inspired by Sass, and arrived a couple of years later in 2009. It’s considered mature and stable, but it still gets regular updates. LESS includes variables, which enable you to set a value in one place and use it by reference everywhere: mixins, which are variables that drop all the content of a class into another with a single line; rule nesting, which clarifies inheritance; functions, which enable you to process numbers and strings; and plenty of colour management features. LESS has good foreign language support, so it’s worth considering if English CSS isn’t your main interest. As it is used to define styles in the Bootstrap framework, you’ll have to use LESS if you use Bootstrap. Sass – sass-lang.com Sass (Stylistically Awesome Stylesheets) is a step up from LESS, with less (huh…) simple expansion and replacement, and more ‘Let’s pretend to be a developer’ language features.

Oxide Interactive Frameworks CSS: Les aternatives à Bootstrap Une présentation de 10 alternatives possibles à Bootstrap et Zurb Foundation à prendre en considération. Dans le monde des frameworks CSS, il y Bootstrap et Zurb Foundation bien sûr, tous deux excellents, mais il y a aussi plus légers, différents. Cela mérite bien un coup de projecteurs sur 10 frameworks CSS que vous pourriez considérer en lieu et place des deux autres précités. Tendances CSS Aujourd’hui, les frameworks CSS se revendiquent Bem, OOCss, Smacss, Atomic design. Ce qui est certain, c’est que tous les frameworks CSS s’organisent petit à petit autour d’objets quasi prêts à l’emploi pour construire une interface web la plus flexible, comprendre responsive le plus rapidement possible. C’est parti pour une découverte de 10 frameworks qui peuvent vous aider à trouver chaussure à votre pied. Materialize CSS Materialize simplifie la vie des développeurs et de leurs utilisateurs. Topcoat CSS pour des applications web propre et rapide. Semantic UI Concise CSS Abandonnez l’indigestion. Skeleton

Sam Newman - Backends For Frontends Introduction With the advent and success of the web, the de facto way of delivering user interfaces has shifted from thick-client applications to interfaces delivered via the web, a trend that has also enabled the growth of SAAS-based solutions in general. The benefits of delivering a user interface over the web were huge - primarily as the cost of releasing new functionality was significantly reduced as the cost of client-side installs was (in most cases) eliminated altogether. This simpler world didn't last long though, as the age of the mobile followed shortly afterwards. The General-Purpose API Backend A first step in accommodating more than one type of UI is normally to provide a single, server-side API, and add more functionality as required over time to support new types of mobile interaction: If these different UIs want to make the same or very similar sorts of calls, then it can be easy for this sort of general-purpose API to be successful. Introducing The Backend For Frontend

FRAMEWORKS CSS vs bootstrap - AntheDesign Il n'y a pas que Bootstrap dans la vie ! Connu de tous, le framework CSS créé par deux petits gars de chez twitter, bootstrap, a su, en seulement quelques mois après son apparition en Aout 2011, s’imposer comme la référence du genre. Bien qu’il reste à ce jour le plus utilisé et souvent le plus conseillé lorsque l’on débute dans le domaine du web, il est loin d’être le seul et unique framework front-end présentant de sérieux atouts pour simplifier nos mises en pages css. Trois catégories de frameworks css La quantité impressionnante de frameworks aujourd’hui disponibles sur la toile étant, j’ai décidé de vous présenter une sélection personnelle répartie en 3 catégories: Les concurrents directs à bootstrapLes “material design”Les minimalistes Je vous inviterai également à proposer ceux que vous utilisez ou tout simplement que vous souhaiteriez conseiller. Parmi ces concurrents directs à bootstrap nous retrouvons essentiellement deux grands noms : Gumby Foundation Material Design Light Materialize

Que signifie DevOps? - Définition par WhatIs.com Le terme DevOps correspond au mélange des tâches qu'effectuent les équipes d'une entreprise chargées du développement des applications (Dev) et de l'exploitation des systèmes (Ops, pour opérations). Le terme DevOps s'utilise de différentes manières. Dans son sens le plus large, DevOps désigne une philosophie ou une approche culturelle qui favorise une meilleure communication entre les deux équipes, à mesure qu'un nombre croissant d'éléments de leur fonctionnement deviennent programmables. Dans son sens le plus restreint, DevOps décrit le poste qu'occupe un employé doté des compétences nécessaires pour travailler à la fois en tant que développeur et ingénieur système. Dans certains secteurs industriels, le terme sert également à décrire un modérateur entre deux groupes, qui opérerait comme un orchestrateur Scrum afin d'aider les équipes de développement et d'exploitation à se focaliser prioritairement sur la gestion du cycle de vie des applications, l'ALM (Application Lifecycle Management).

Apprendre à utiliser Font Awesome Il existe une extension à BOOTSTRAP Twitter qui permet d'ajouter d'autres glyphicons. Font Awesome Font awseome propose d'intégrer à votre blibliothèque plus de 369 icones. Pour télécharger cette extension: Cliquez ici Icones dynamiques Avec Font awesome vous pouvez rendre vos icones dynamiques: Exemple: Code: Rotation et inversion des icones Pour inverser une icone ou executer une rotation utilisez la classe fa-rotate-* et fa-flip-* : normal fa-rotate-90 fa-rotate-180 fa-rotate-270 fa-flip-horizontal icon-flip-vertical Encadrement icones Il est possible d'ajouter divers encadrements aux icones: Architecting iOS Apps with VIPER · objc.io It’s well known in the field of architecture that we shape our buildings, and afterward our buildings shape us. As all programmers eventually learn, this applies just as well to building software. It’s important to design our code so that each piece is easily identifiable, has a specific and obvious purpose, and fits together with other pieces in a logical fashion. In this article, we will introduce an approach to iOS application architecture called VIPER. What is VIPER? Testing was not always a major part of building iOS apps. VIPER is an application of Clean Architecture to iOS apps. Most iOS apps are architected using MVC (model–view–controller). VIPER’s distinct layers help deal with this challenge by providing clear locations for application logic and navigation-related code. Application Design Based on Use Cases Apps are often implemented as a set of use cases. Building an app with VIPER involves implementing a set of components to fulfill each use case. Main Parts of VIPER Entity

Related: