bluff

Bluffer

Avis de non-responsabilité : j'ai construit ceci pour mes propres besoins, alors ne vous attendez pas à ce qu'il soit complet. Il s'agit d'un hack de week-end, à utiliser à vos propres risques !

Bluff est un générateur de sites Web statiques écrit en Dart et inspiré des widgets Flutter.

Pourquoi ?

J'ai commencé ce projet parce que j'en avais marre de passer à un environnement js à chaque fois que j'avais besoin d'écrire un petit site Web statique. Je voulais que le concept soit le plus proche possible de Flutter, encore une fois, pour garder la même manière de développer les interfaces utilisateur et ne pas perdre de temps à réapprendre encore et encore les paradigmes.

Pourquoi ne pas utiliser Flutter pour le web ?

Tout simplement parce que je voulais un site Web vraiment léger avec un bon référencement. La migration vers Flutter pour le Web devrait cependant être assez simple.

Usage

Un exemple d'utilisation simple :

 import 'package:bluff/bluff.dart' ;

Future main () async {
  final app = Application (
    availableSizes : [
      MediaSize .small,
      MediaSize .medium,
    ],
    supportedLocales : [
      Locale ( 'fr' , 'FR' ),
      Locale ( 'en' , 'US' ),
    ],
    routes : [
      homeRoute,
    ],
  );
  ;

  await publish (app);
}

final homeRoute = Route (
  title : (context) {
    final locale = Localizations . localeOf (context);
    if (locale.languageCode == 'fr' ) return 'Accueil' ;
    return 'Home' ;
  },
  relativeUrl : 'index' ,
  builder : (context) => Home (),
);

class Home extends StatelessWidget {
  @override
  Widget build ( BuildContext context) {
    final mediaQuery = MediaQuery . of (context);
    final theme = Theme . of (context);
    return Column (
      crossAxisAlignment : CrossAxisAlignment .stretch,
      children : < Widget > [
        Flex (
          direction : mediaQuery.size == MediaSize .small
              ? Axis .vertical
              : Axis .horizontal,
          children : < Widget > [
            Expanded (
              child : Container (
                height : 300 ,
                decoration : BoxDecoration (
                  image : DecorationImage (
                    image : ImageProvider . asset ( 'images/logo_dart_192px.svg' ),
                  ),
                ),
              ),
            ),
            Padding (
              padding : EdgeInsets . all ( 20 ),
              child : Text ( 'Hello world!' ),
            ),
            Container (
              width : 200 ,
              height : 200 ,
              decoration : BoxDecoration (
                color : const Color ( 0xFF0000FF ),
                borderRadius : BorderRadius . circular ( 5 ),
                boxShadow : [
                  BoxShadow (
                    color : const Color ( 0xAA0000FF ),
                    blurRadius : 10 ,
                    offset : Offset ( 10 , 10 ),
                  ),
                ],
              ),
            ),
            Image . asset (
              'images/logo_dart_192px.svg' ,
              fit : BoxFit .cover,
            ),
            Click (
              newTab : true ,
              url : 'https://www.google.com' ,
              builder : (context, state) {
                return Container (
                  child : Text (
                    'Button' ,
                    style : theme.text.paragraph. merge (
                      TextStyle (
                        color : state == ClickState .hover
                            ? const Color ( 0xFFFFFFFF )
                            : const Color ( 0xFF0000FF ),
                      ),
                    ),
                  ),
                  padding : EdgeInsets . all ( 20 ),
                  decoration : BoxDecoration (
                    color : state == ClickState .hover
                        ? const Color ( 0xFF0000FF )
                        : const Color ( 0x440000FF ),
                    borderRadius : BorderRadius . circular ( 5 ),
                  ),
                );
              },
            )
          ],
        )
      ],
    );
  }
}