Reprise du message précédent :

 
Faut pas confondre un thème et un template

Ce que j'ai fait est tout à fait faisable sans flex. C'est juste tellement simple à utiliser que c'est du bonheur . Rien que le 'order'

yep
grunt prefixer est mon ami d'ailleurs

(mais supporter tous les navigateurs mobiles y compris les spéciaux pourris de samsung est aussi du bonheur)

Bonjour à tous!
 
Je viens demander votre avis sur l'architecture et les choix technologiques les plus appropriés sur un petit projet de site sur lequel je travail, car j'avoue que je me suis un peu "auto-perdu" en route
 
Le site en lui même est très simple:  
                 Une page principale de présentation avec 3-4 rubriques (style "one page" )
                 Une partie blog où l'utilisateur peut poster des articles à sa convenance.
 
Partit un peu bille en tête, le code, le thème et le code de la page de présentation est quasiment terminé, partit de zéro, de même pour la partie blog où j'ai choisi Pluxml comme moteur de blog .
 
Ce faisant je me pose maintenant quelques questions sur la pertinence de mes choix de départ:
Après avoir fait le point avec l'utilisateur principal du site, il aimerait pouvoir mettre à jour si c'est nécessaire, le contenu de sa page de présentation, sans trop toucher au code bien sûr, chose que je n'avais pas forcément prévu, du moins de cette manière là.
 
D'où mes interrogations suivantes:  
 
Vaut-il mieux rester sur l'architecture de départ, et utiliser TinyMCE par exemple pour mettre jour la page de présentation ou bien tout gérer à partir du moteur de blog en utilisant une "page".
 
Est-ce que je n'aurais pas du partir dès le départ sur un moteur de blog tels que Wordpress, pour des questions d'évolutivité du projet pour l’utilisateur, en plus des nombreuses extensions disponibles et de la grosse communauté (Au départ WordPress me paraissait un peu trop surdimensionné pour l'usage prévu).
 
J'espère que j'ai été clair dans mes questions,, merci en tout cas pour vos réponses    
 

 
Pour ma part j'utilise Wordpress souvent, bon c'est un CMS, donc y'a des avantages et des inconvénients certes. Il est quand meme adapté à n'importe quel petit projet de site one page+blog, ou une dizaine de pages voire une cinquantaines. Y'a quelques gros sites qui tournent sous WP, je me souviens plus des noms, mais il doit falloir bien customiser après je pense.
 
Bref tout ça pour te dire que t'as un Plugin "Advanced Custom Field" qui te permet de rendre n'importe quelle page de ton site administrable comme tu le souhaites, t'as même pas à toucher du code, tu crées tes champs (ex: Section 1 Titre, Section 1 Description, Section 1 Gallerie etc...), tu peux les classer par onglets, les positionner dans ton admin. Bref, ton client va être ravi.
 
ça ressemble à ça:

 
et après tu les affiches dans ta page avec un bête :

<?php the_field('field_name'); ?>

 
tu peux afficher un tas d'infos (Texte, Liste déroulantes, Dates, Galleries etc..) et personnaliser ton admin. Pour les petits projets c'est vraiment pas mal.
 
 

Si tu choisis d'utiliser un CMS et son interface d'admin :
Pour une unique page composée de blocs relativement longs et très différents, tu peux aussi afficher le contenu de plusieurs pages (vues dans l'admin) sur cette URL unique. Évidemment il y a plus de requêtes pour construire la page mais les CMS ont des plugins de cache (quand c'est pas déjà intégré)
Et je pense que c'est plus simple à éditer pour l'utilisateur qu'un unique textarea de 6 écrans de haut avec des parties auxquelles il ne faut surtout pas toucher parce que ça fait partie du gabarit...

<?php the_field('field_name'); ?>

 
Voilà, t'associes ça à un WP Bakery Visual Composer, et le mec peut construire son interface en Drag&Drop.
 
Bon sinon, ya Wix.com, et on est dans la merde.

Sinon y a Ghost qui a l'air pas mal, mais faut former ton user au MD.

Ghost.org -> OK  
 
Molette ->

 
Oh, Thanks.

 
Ouai j'ai vu ça sur CodeCanyon... le mec est millionaire avec son plugin wordpress  
t'as déjà testé ? après tu passes plus de temps à rendre administrable le site, qu'à le designer/intégrer  

 
Et donc ?

C'est pas mal foutu pour donner la main à un end-user pour modifier la structure et l'agencement des infos depuis le back-office, et aussi depuis le front-office, du moins c'est bien foutu quoi qu'un peu lourd.

J'ai test bootstrap, mais j'ai très vite déchanté en fait, trop de custom à faire. Pour faire des mises en page joliement alignée, j'ai souvent besoin de synchroniser marges verticales & line-height, ce qui du coup devient vite relou, parce qu'il faut tout remodifier dans ses CSS customs. Et j'aime pas trop mettre des classes genre col-xx sur l'HTML, c'est chiant pour faire des templates réutilisables.
 
J'utilise du coup surtout SASS + Compass (le module vertical_rhythm surtout) + Susy. Et là je suis tranquile.

 
T'es pas obligé, tu définis tes propres class et utilises les mixins.

Ouais ils ont rajouté ça dans la 3 je crois ? Mais bon, l'interêt était assez faible quand t'as des règles de base pour tous les éléments déjà. J'imagine que beaucoup de gens se sont fait une base de travail, après forcément la leur est mieux testée partout, mais j'avais pas l'impression d'être plus rapide, surtout pour du responsive, où il faut toujours gérer certains cas particuliers à la main.

FlorentG est vivant ?

I'm alive, bitches

Bonjour aux experts du WEB,
 
j'aurai besoin de vos avis, dans le cadre de mon boulot, je voudrais concevoir une appli web assez simple pour permettre la visualisation de données statistique (sous forme de csv ).
J'ai un peu regardé pour des framework comme par exemple D3.js pour les graph, pour le reste y aurais coffeescript ou backbone.js mais je suis perdu de ce côté, je voudrais un truc assez simple pour la gestion de la page.
Avis , conseils ????
merci d'avance

D3js c'est quand même un sacré gros morceau... Faut des notions de SVG et bien s'y plonger. Même si ça reste le top (et de loin) en dataviz, il faut prévoir du temps pour le comprendre.
 
Coffeescript c'est « juste » pour éviter d'écrire du JS directement (syntaxe beaucoup plus plaisante dans 80% des cas). Mais derrière c'est du JS
 
Backbone c'est un framework pour organiser son appli JS sur le modèle MVP.

Et pour répondre à ta question :
Ça dépend de tes besoins, single page app, est-ce que ça doit être dynamique (changer de représentation en cliquant sur un bouton etc) ?

Dès que c'est un peu dynamique, AngularJS ira bien

Ou Ember.js

 
J'étais sûr que tu allais sortir du bois

Merci pour vos réponses  
 
Oui je pensais partir sur une page unique pour plus de simplicité pour les utilisateurs finaux (mais si vous avez des conseils je suis tout ouïe).
Si j'ai bien compris D3.js pour la visualisation ( se serait néanmoins des graphiques relativement simple encore donc alternative possible ) et AngularJS pour la gestion de la page, j'ai bon ??

Il faut bien que quelqu'un défende le monde libre contre l'oppresseur.

En plus tu vois, ce n'est même pas suffisant

Si ce sont des graphiques simples, tu peux utiliser des « surcouches à d3js, comme nvd3 (cf http://nvd3.org/examples/index.html )

Ensuite, si tu veux un site uniquement statique, t'es ptetre pas obligé de partir sur un Angular/Ember.

Surtout que pour une "appli web assez simple", ca fait pas mal de techos à apprendre

mrc pour info

 
T'as mis une parehnthèse en trop à la fin de ton url, j'ai perdu au moins 20 min de ma VIE

edit : fixed!

Je ne vois pas en quoi un singleton serait mal. Ça comble un besoin de façon plutôt efficace.  Si c'était si mal que ça, Doctrine 2 ne l'aurait sans doute pas utilisé.

Sources ?
A ma connaissance c'est pas du tout le cas

 
Pareil que ratibus, je serais curieux de voir ça.

Pour ceux qui font du Angular et des directives, vous avez déjà entendu parler de directives qui ne fonctionnent pas lorsque d'autres directives sont appliquées sur un élément ?
 
Ca fait des jours que je galère avec ça : http://stackoverflow.com/questions [...] directives

Ben à cause du isolated scope ... tu n'as pas une erreur dans la console ?
(Hum non ici c'est pas ton cas...)

Sinon 3 semaines que je monte un projet sur Angular... c'est énorme

 
Mais encore ?
Parce que je ne manipule que du dom, pas réellement d'objets liés au scope.

 
Non là oublie ce que j'ai dit, je n'ai pas testé ton code, mais c'est bizarre effectivement ... Je jetterais un oeil si je peux ce soir, mais pas certain à 100% de pouvoir t'aider

ton scroll event n'est jamais déclenché quand il y a le ng-if, mais j'ai pas vraiment d'explication

edit : en fait si
eidt 2 : var $newTable = $('.table-copy'); est vide

Exemple trop peu minimaliste pour avoir l'envie de debugger

Finalement j'ai changé la façon de procéder. J'utilise la transclusion car il semblerait que ce soit comme ça qu'il faille procéder, mais ça me pose problème de réinsérer complètement mon tableau originel alors que je ne modifie pas son dom.

Version simplifiée : http://plnkr.co/edit/i5NWEjolX8JWQwjiqcwG?p=preview
Avec ngIf, ça ne marche pas, si vous l'enlevez du dom, ça fonctionne (la classe de coloration verte est appliquée car la div qui englobe le tableau est bien créée).

 
Le problème ne vient pas de là, j'avais juste mis la directive en entière en bricolant 4 versions différentes pour bien montrer le comportement.

Pour ce que ça interesse :
 

mightyApp.directive('cgFixedTableHeader', ['$compile', function($compile) {
    return {
        transclude: 'element',
        link: function(scope, iElt, tAttrs, ctrl, transclude) {
            var $originalTable;
            var $newTable;
            var offsetTop = 78;
 
            function cloneTableHeader($table) {
                var $header = $('thead.header', $table);
 
                return angular.element(document.createElement('table'))
                    .addClass($table.attr('class')+' table-copy').removeClass('fixed-table-header')
                    .html($header.clone().removeClass('header').addClass('header-copy header-fixed'))
                    .css({ 'position': 'fixed', 'top': offsetTop, 'width': $header.width(), 'display': 'none' });
            }
 
            function setColumnsWidth($table) {
                $table.find('.header-copy > tr > th').width(function(i) {
                    return $originalTable.find('.header tr > th:eq(' + i + ')').width();
                });
            }
 
            /**
             * No need to execute ngRepeat because the cloned table comes from an already compiled header.
             * @param $table
             */
            function removeNgRepeat($table) {
                $table.find('[ng-repeat]').each(function(i, elt) {
                    angular.element(elt).removeAttr('ng-repeat')
                });
            }
 
            function updateHeader() {
                $('thead', $newTable).html($('thead', $originalTable).html());
                setColumnsWidth($newTable);
                removeNgRepeat($newTable);
                $compile($newTable)(scope);
            }
 
            function fixHeader() {
                transclude(function(table) {
                    $originalTable = table;
                    iElt.after($originalTable);
 
                    table.addClass('fixed-table-header');
                    $('thead', table).addClass('header');
                    table.wrap('<div class="fixed-table"></div>');
 
                    $newTable = cloneTableHeader(table);
                    $newTable.appendTo(table.closest('.fixed-table'));
 
                    setColumnsWidth($newTable);
 
                    $compile($newTable)(scope);
                });
            }
 
            $(window).bind("scroll", function() {
                var offset = $(this).scrollTop();
                var eltOffset = $originalTable.offset().top - offsetTop;
                var $newTable = $('.table-copy');
 
                if (offset >= eltOffset && $newTable.is(":hidden" )) {
                    $newTable.show();
                } else if (offset < eltOffset) {
                    $newTable.hide();
                }
            });
 
            scope.$watch(function () {
                return $('thead', $originalTable).html();
            }, function () {
                updateHeader();
            });
 
            scope.$watch(function () {
                return $('thead th', $originalTable).width();
            }, function () {
                updateHeader();
            });
 
            fixHeader();
        }
    };
}]);

 
Si vous voyez des choses à améliorer, n'hésitez pas.
 
Je me posais la question du passage de variables. Celles qui m'intéressent se trouvent dans le transclude. Ma question est : dois-je passer les variables de fonctions en fonctions ou alors dois-je les setter en tant que variables globales, sur ma fonction

 
 
Pourquoi ne pas écrire