后台快速开发脚手架

后台快速开发脚手架FASTERTHANFASTER1.目标更快的满足后台需求快速开发或易于开发1.1目标拆解怎么更快地进行开发？减少写的成本使用框架减少代码量使用工具创建样板代码复用更多的代码减少读的成本代码文档或者代码示例方便的代码查阅与导航1.1.1项目快速启动两种方式SeedprojectvsScaffoldAngularReactSeedprojectMoreMoreScaffoldAngular-cliantd-init&ant-toolAngluar-cli官方出品支持模板代码生成broccoliantd-init&ant-tool阿里出品项目生成Webpack+定制化结论Angluar-cli在减少代码量方面更胜一筹此外，两者半斤八两1.1.2快速编码良好的代码提示方便的文档查询代码导航CodeSnippet工具乃至编程语言上的支持VSCode相较与Atom有更好的性能以及更好的代码提示开箱可用类型标注与检查FlowTypescript1.1.3界面快速构建CssframeworkBootstrapMaterialize…ComponentlibraryAnt-DesignPrimeFaces…1.1.4数据的快速编辑表单的自动生成表单验证数据的绑定1.1.5通用流程的复用文件上传用户管理权限验证…1.2技术选型ModuleComponentTemplateMetadataDataBindingDirectiveServiceDependencyInjectionAngular2ViewComponentVirtualDOMOne-wayDataflowJSXFlowReactNativeReact1.2.1Angular2与React对比TypescriptvsBabelFrameworkvsChooseByYourFavoriteTemplatevsVDOMComponentServerRenderDataBindingStudyCost1.2.2为什么选择Angular2Angular2与React在组件化上的成本相差不大现有代码的利用做后台就要大而全外部库与依赖尽可能的少与一致开发流程与代码一致更易于维护1.2.3可复用代码对比React-antdesignAngular2-PrimeFacesAntDesign（44个）Button按钮Icon图标Layout布局Cascader级联选择Checkbox多选框DatePicker日期选择框Form表单InputNumber数字输入框Radio单选框Rate评分Select选择器Slider滑动输入条Switch开关TimePicker时间选择框Transfer穿梭框TreeSelect树选择Upload上传Alert警告提示Badge徽标数Carousel走马灯Collapse折叠面板Calendar日历Card卡片Dropdown下拉菜单Modal对话框Message全局提示Notification通知提醒框Progress进度条Popconfirm气泡确认框Popover气泡卡片Timeline时间轴Tooltip文字提示Tree树形控件Table表格Tag标签Breadcrumb面包屑Menu导航菜单Pagination分页Steps步骤条Tabs标签页Affix固钉LocaleProvider国际化QueueAnim进出场动画Spin加载中PrimeFaces（66个）AutoCompleteCalendarCheckboxDropdownEditorInputSwitchInputTextInputTextAreaListboxMultiSelectPasswordRadioButtonRatingSliderSpinnerSelectButtonToggleButtonButtonSplitButtonCarouselDataGridDataListDataScrollerDataTableOrderListGMapPaginatorPickListScheduleTreeTreeTableAccordionFieldsetPanelGridTabViewToolbarDialogLightboxOverlayPanelTooltipMenuModelBreadcrumbContextMenuMegaMenuMenuMenubarPanelMenuSlideMenuTabMenuTieredMenuBarDoughnutLinePolarAreaPieRadarMessagesGrowlGalleriaDrag&DropResponsiveThemingProgressBarCodeHighlighterTerminalPrimeFaces的优劣优更多的数据展示组件图表的组件劣样式不够美观缺少动画效果组件1.2.4Angular2现有代码复用优课后台使用的表单生成通用权限相关业务代码1.3方案与产出一个seedproject搭配Angluar-cli脚手架搭配fis3部署上传打通现在的上线发布流程配置好通用组件表单生成组件JSONScheme配置数据绑定文档与示例代码2.工作量seedproject搭配Angluar-cli脚手架与自动化脚本1day搭配fis3部署上传0.5day打通现在的上线发布流程0.5day配置好通用组件1day说明文档1day表单生成组件对JSONScheme的适配1day数据验证与自定义验证服务3day文档与示例代码3dayJSONScheme生成3day