admin dashboard starter

银河系中最简单的管理仪表板套件！

我们的目的是简化水疗开发 - 立即运送您的管理仪表板。重点是堆栈/体系结构/设计模式，而不是美学。为了保持简单，并使实施自己的设计易于保持最小。

我们还涵盖了设计部分 - 将主要管理框架移植到我们的管理仪表板入门技术中。这是一个完整列表（星星越多，我们投入的工作越多）：

• 表格
• 管理员
• 管理员
• 材料仪表板

用苗条和搭档建造。滚动构建项目。现在使用Firebase托管部署，现在，直接向您的服务器涌现。

总而言之，您今天可以部署实时管理仪表板。

特征

• 易于使用的组件系统。组件是普通的HTML，CSS，JS。
• 基于文件夹的路由。
• 强大的身份验证系统。轻松地插入Firebase，Passport.js或Auth0。
• 基于组件的测试和开发。渲染单个组件 - 更快地工作和迭代。设置可靠的单元测试/组件测试系统。
• 数据源。从数据库，文件或远程服务器轻松插入您自己的数据。
• 与柏树进行集成测试。
• 从命令行之间切换开发环境和产品环境。
• 从命令行部署到流行服务。

运行项目

但是，您可以获得代码，可以安装依赖项并以开发模式运行项目：

 cd admin-dashboard-starter
npm install # or yarn
npm run dev

打开Local主机：3000，然后开始单击。

请咨询Sapper.svelte.dev以获取帮助。

结构

Sapper希望在您的项目的根源中找到两个目录src和static 。

src

SRC目录包含您的应用程序的输入点client.js ， server.js和（可选） service-worker.js ，以及template.html文件和routes目录。

SRC/路线

这是您的Sapper应用程序的核心。有两种路由：页面和服务器路由。

页面是用.svelte文件编写的Svelte组件。当用户首次访问应用程序时，将为他们提供有关该路由的服务器渲染版本，再加上一些“水合”页面并初始化客户端路由器的JavaScript。从那时起，通往其他页面的导航完全可以在客户端上处理，具有快速，类似应用程序的感觉。 （Sapper将预加载并缓存这些后续页面的代码，因此导航是瞬时的。）

服务器路由是用.js文件编写的模块，其导出功能与HTTP方法相对应。每个功能都将明确的request和response对象作为参数，以及next功能。例如，这对于创建JSON API很有用。

有三个简单的规则用于命名定义您的路线的文件：

• 一个称为src/routes/about.svelte的文件对应于/about路由。一个称为src/routes/blog/[slug].svelte对应于/blog/:slug路由，在这种情况下， params.slug可用于路由。
• 文件src/routes/index.svelte （或src/routes/index.js ）对应于应用程序的根。 src/routes/about/index.svelte的处理与src/routes/about.svelte相同。
• 带有领先下划线的文件和目录不会创建路由。这使您可以将辅助模块和组件与取决于它们的路由分配 - 例如，您可以拥有一个称为src/routes/_helpers/datetime.js的文件，并且不会创建A /_helpers/datetime路由

静止的

静态目录包含任何应可用的静态资产。这些是使用SIRV服务的。

在您的service-worker.js文件中，您可以从生成的清单中导入这些files ...

 import { files } from '@sapper/service-worker' ;

...以便您可以缓存它们（尽管您可以选择不选择，例如，如果您不想缓存非常大的文件）。

Bundler配置

Sapper使用crolup或webpack提供代码分解和动态导入，并编译您的亮组件。使用WebPack，它还提供热模块重新加载。只要您不做任何愚蠢的事情，就可以编辑配置文件以添加您想要的任何插件。

生产模式和部署

要启动应用程序的生产版本，请运行npm run build && npm start 。这将禁用实时重装，并激活适当的Bundler插件。

您可以将应用程序部署到支持节点8或更高的任何环境中。例如，要部署到现在，请运行以下命令：

npm install -g now
now

使用外部组件

当使用从NPM安装的Svelte组件（例如 @sveltejs/svelte-virtual-list）时，Svelte需要原始组件源（而不是任何与组件一起寄出的预编译JavaScript）。这允许将组件渲染为服务器端，还可以使您的客户端应用程序更小。

因此，捆绑器不将软件包视为外部依赖性，这一点至关重要。您可以在rolup.config.js中的server下修改external选项，也可以在webpack.config.js中修改externals选项，或者简单地将软件包安装到devDependencies而不是dependencies中，这将导致其与其捆绑（并因此将其编译为）您的应用程序：

npm install -D @sveltejs/svelte-virtual-list

错误和反馈

请在DBH问题跟踪器上发声。