Binder 框架

Binder 是一个可用于创建 Web 应用和 API 的 Web 框架。

它就像 React + Express 或前端框架 (Vue, Angular 等) 和后端框架 (Laravel, Django 等) 的任何组合。以一种非常简单而强大的方式集成在一起。Binder？。

开始

首先，我们需要下载 Binder SDK 框架。如果您使用的是 Windows，请 在此处 直接下载。将其 (路径指向 binder-sdk/bin ) 添加到您的环境变量路径中。如果一切正常，在 CMD 中键入 binder 应该可以正常工作，尽情享用吧。

下载 Binder SDK

–Windows

-MacOS (即将推出)

-Linux (即将推出)

替代方案 (sdk/binder-bin)，适用于其他平台 (Linux 和 macOS 用户),

您可以通过以下方式使用它

从 dart 官方网站 下载 Dart SDK 以便用于您的平台，并将 binder-bin 从 binder GitHub 文件夹添加到 Dart SDK 中。然后，在根目录执行 dart pub global activate --source path binder-bin 来激活它。它适用于所有平台。

注意

如果您已在环境变量中安装了旧版 Dart SDK，请在添加 Binder SDK 之前将其移除，否则会产生冲突。Binder 的 SDK 已包含 Dart SDK。

安装完成后，您就可以使用它了

要创建一个新项目，请使用

binder create <project_name>

要运行项目，请使用

binder run

项目示例 :

import 'package:binder/bootstrap.dart';

void main() {
  runApp(MyApp());
 
}

class MyApp extends Widget {
  @override
  Element toElement() {
    return BootstrapContainer(
      child: BootstrapCenter(
        child: BootstrapText('Hello World'),
      ),
    ).toElement();
  }
}

对于 Flutter 开发者

前端 :

如果您已经使用过 Flutter，您应该知道 Flutter 主要使用两种设计风格：Material Design (例如：Center, TextStyle, Color, Icon) 和 Cupertino (例如：CupertinoTextStyle, CupertinoIcons 等)。

  • 对于 Flutter Material (最常用)，我们首先导入 package:flutter/material.dart，然后就可以使用如 AlertDialog, AppBar, Center, Color, TextStyle, DatePicker 等小部件。

  • 对于 Flutter Cupertino (较少使用)，我们首先导入 package:flutter/cupertino.dart，然后就可以使用如 CupertinoAlertDialog, CupertinoButton,CupertinoApp, CupertinoColors, CupertinoTextStyle, CupertinoDatePicker 等小部件。

Binder 框架就是基于这个原理创建的。使用 Binder，您可以获得超过 4 种方法：Material, Materialize, Bootstrap, MBootstrap (MaterialBootstrap)。

  • 对于 Binder Material，我们将首先导入 package:binder/material.dart，然后就可以使用如 Text, Center, Color, TextStyle 等小部件。

  • 对于 Binder Bootstrap，我们将首先导入 package:binder/bootsrap.dart，然后就可以使用如 BootsrapText,BootsrapCenter, BootsrapColor, BootsrapTextStyle 等小部件。

对于 Materialize 和 MBootstrap 也是如此，但它们还不稳定。

作者寄语

目前只有 Binder Bootstrap 还没有完全开发好，所以对于 Beta 测试者，我建议暂时使用它，即使 Materialize 也不错。Bootstrap 将在未来几周内完成。感谢。

Binder 与全栈方法

Binder 不仅可以管理您网站的前端，还可以管理后端。

  • 前端代码位于 lib/main.dart。
  • 后端代码位于 bin/server.dart。

在此版本中，还无法通过服务器创建 API 和管理路由，但这将在下一个版本中实现。

完整的文档即将发布

您可以使用 WebApp (类似于 MaterialApp 或 CupertinoApp)、Divider, BoostrapColumn, BoostrapRow, BoostrapImage, BoostrapCenter, Center, Text, BoostrapText 等小部件。

目前已添加或正在添加 100 多个小部件。

在文档中，您将了解如何部署您的网站，如何操作路由，如何添加您自己的 HTML、CSS 或 JavaScript 代码，如何添加 Firebase、MongoDB 或任何其他数据库。

如果您想贡献，很快就可以从 Alpha 版本开始，并且一旦官方文档可用。

感谢您未来的贡献。

GitHub

查看 Github