tm nuxtjs starter
1.0.0
截至2018年8月，这是我最小而功能的VUE入门套件和演示应用程序。
如果您对JavaScript疲劳感到厌倦，并且想快速而轻松地开始，请窥视一下。开发现代VUE应用程序并没有比这简单得多。
演示应用程序是一个静态站点，这是一个基本的单页应用程序，其中包含一些可寻址页面，这些页面懒洋洋地加载了按需加载。它演示了基本的CRUD操作：1）列出电影，2）查看电影详细信息，3）创建/编辑和4）删除电影。
该演示使用浏览器LocalStorage进行数据存储，这意味着它在没有后端的情况下运行。这些源确实包含一个真正的Ajax呼叫休息后端的模块 - 您只需要启用模块并编写服务器即可，并且您可以很好地拥有一个真正的Web应用程序。我已经开发了Restpie3 Python REST API服务器，该服务器以这一简单的电影API为例。
演示应用程序由一个简单但功能强大的技术堆栈组成，该堆栈为创建现代Web应用程序提供了基本功能。它站在一些很棒的图书馆的肩膀上：
├── /assets/ # assets to be processed by Nuxt
│ └── /layout.sass # main layout of site
├── /components/ # vue components used by pages
│ └── /myheader.vue # site header component
├── /layouts/ # page top-level layouts
│ └── /default.vue # main site layout
├── /pages/ # pages
│ ├── /about.vue # about page
│ ├── /index.vue # home page, lists movies
│ ├── /moviedetails.vue # details page, views a movie
│ └── /movieedit.vue # edit page, edits a movie
├── /static/ # static assets, accessed/exported as is
│ ├── /favicon.ico # favicon
│ └── /exampledata/
│ └── /movies.json # sample list of 4 movies - loaded initially
├── /store/ # data stores managed by Vuex
│ └── /index.js # the single store for this app
├── config.js # app config, select ajax or localstorage
├── nuxt.config.js # nuxtjs config
├── package-lock.json # npm something
├── package.json # list of npm packages required
├── README.md # this doc
├── serverapi_ajax.js # API, talks AJAX to a real backend
└── serverapi_localstorage.js # API, talks to localStorage
这是在本地机器中运行起动器的方法：
$ git clone https://github.com/tomimick/tm-nuxtjs-starter
$ cd tm-nuxtjs-starter
$ npm install
$ npm run dev然后将浏览器指向http：// localhost：3000。
修改任何因文件时，更改将被热加载并立即可见。享受开发人员！
NUXTJS是一个很棒的小框架，将结构和核心水疗功能带到基于VUE的应用程序中。它使启动应用程序开发变得容易，让您专注于核心应用程序，但也提供了指导您创建更复杂应用程序的实践。
简而
NUXT.JS利用Vue的单个文件组件，这是将VUE组件的模板，逻辑和样式封装在一起的绝佳实用解决方案。
NUXT.JS的灵感来自NextJS，这是React生态系统的相同框架。 NUXT.JS引入了更多的层次结构，具有用于布局，插件和中间件的文件夹。
由于NUXTJS具有支持具有大量数据和代码的应用程序的工具，因此通常需要某种状态管理解决方案来共享页面和组件的数据。
NUXTJ与VUEX状态管理库本地集成。这是一个精心制作的图书馆，由埃文（Evan You）撰写，埃文（Evan You）是创建Vue的才华横溢的人。 Vuex足够简单，可以快速学习。您可以从状态数据以及突变和操作功能构建商店。
要激活Vuex，您只需将商店组件放在商店/文件夹中，Nuxt从那里摘下它并将其作为this.$store仅此而已，不需要进一步的配置。
也可以使用其他状态库（例如MOBX），但是由于内置集成，Vuex是NUXTJ的自然选择。
使用NUXTJS生成静态站点的能力是一个重要的工具，它使得可以在没有后端服务器的情况下运行应用程序。您可以将网站导出到GitHub页面，NetLify或Amazon S3。 （但是，请检查一些带有site+link前缀的gotchas带有github页面。）
静态一代的另一个胜利是能够将应用程序与任何休息后端连接起来，无论后端的语言是什么。清洁前端和后端的分离还可以在技术级别且可能在团队级别上进行模块化。
要生成静态站点，只需运行
$ npm run export并且静态文件将在dist -Folder中生成。
要通过本地www -server在本地测试静态站点，我迅速运行了一个python脚本：（ Python3 -M http.server）
$ npm run pyserve然后在http：// localhost：8000上测试站点。
NUXTJ的表现良好，生成了一个主页，其大小仅为69kb缩小和GZZB 。这是开箱即用的好结果。
浏览器总共加载了主页4个请求，并且按需加载的每个新页面都会发出一次JS请求。
Page Size Inspector Report
URL: https://nuxtjs.tomicloud.com/
REQUEST REQ BYTES
TOTAL___________________________________________4____68,802
Document________________________________________1_______960
-nuxtjs.tomicloud.com/ 960
Script__________________________________________3____67,842
-nuxtjs.tomicloud.com/_.../0b088016842f5f4f735 53,552
-nuxtjs.tomicloud.com/_.../1c78d24f170a4f6d1ea 13,680
-nuxtjs.tomicloud.com/_.../f17a22e19f8ece7f59c 610（由我的Chrome扩展页面大小检查器报告。）
Vue和React都是现代Web开发人员的真正不错的选择：它们基于现代反应性/虚拟DOM概念，它们轻巧，在大生态系统中非常受欢迎。开发人员不能总是在这两个之间进行选择，但是如果可以的话，最终可能是一个味道，即开发人员认为更好的问题。品味决定通常归结为您是喜欢JSX还是模板的理念。
如果我可以为前端项目选择武器，我会选择VUE。我的主要原因是代码可读性和个人生产力。与JSX相比，我可以更轻松地读取并编写带有JavaScript的HTML模板。长时间的JSX运行可能令人眼花and乱，有些嘈杂。一个只有几个指令装饰的模板对我来说更可读。我喜欢在行中首先看到HTML构建块，而不是JSX Map（） - 功能或三元运算符或短路。我想模板对我来说更自然，因为我与Web，HTML，JS和CSS的3个基本构建块合作，早在JavaScript Overlord占领了世界之前。
我非常感谢VUE单文件组件中实践的3个问题的分离。我想我代表着老式的思想，它说，观点，逻辑和样式应该在它们之间有一定的分离，并且不应将其混合在一起。他们确实在它们之间有耦合，这是很自然的事情，并且应该彼此靠近，最好是在同一源文件中，但不要混合。太紧的耦合可能最终会在意大利面条中。
但是，我也理解了哪种反应状态在VUE上更好的观点，而哪种反应更好，并且认为另一个模板DSL是较弱的方法。如果您来自JavaScript背景，React对您来说可能会更自然。我可以选择这两种选择（我什至做了这2个起动套件！），但也许Vue对我有略有优势。
如果您想阅读有关最近的Vue vs React辩论之一，请检查此Reddit线程。
继续前进，乘坐Vue启动器，也许还有我的Restpie3 Python REST API服务器，并构建您的出色服务。
您也可以与我联系，询问我是否可以从事自由职业工作。
如果您更喜欢反应，而不是VUE，我还使用React NextJ编码了相同的启动器。
麻省理工学院许可证
