samtecspg/articulate-ui

镜像概述

samtecspg/articulate-ui是基于React Boilerplate构建的前端项目基础镜像，旨在帮助开发者快速启动React应用。它提供了高可扩展性、离线优先的开发环境，注重开发体验（DX）、性能优化和行业最佳实践，是构建企业级React应用的可靠基础。

核心功能

• 快速脚手架：通过CLI快速创建组件、容器、路由、选择器和Sagas及其测试用例。
• 即时反馈：支持CSS和JS的热重载，保存后无需刷新页面即可看到变更，且保留应用状态。
• 可预测状态管理：采用单向数据流，支持变更日志和时间旅行调试。
• 下一代技术栈：支持ESNext语法（模板字符串、箭头函数等）和模块化CSS（styled-components）。
• 完善的路由与国际化：集成react-router实现路由管理，支持react-intl进行多语言国际化。
• 离线优先：通过ServiceWorker实现离线可用，提升用户体验。
• 静态代码分析：自动格式化和 lint 代码，确保代码质量。
• SEO支持：管理文档头部标签，适配支持JavaScript内容索引的搜索引擎（如Google）。

使用场景

• 快速启动企业级React应用开发。
• 构建需要离线功能的Web应用（如PWA）。
• 开发注重性能、可维护性和扩展性的前端项目。
• 学习React Boilerplate最佳实践的参考环境。

配置说明

本地开发快速启动

1. 确保安装Node.js v8及以上版本。
2. 克隆仓库：git clone --depth=1 https://github.com/react-boilerplate/react-boilerplate.git
3. 进入目录：cd react-boilerplate
4. 安装依赖：npm run setup（若需强制使用npm而非yarn，执行USE_YARN=false npm run setup）
5. 启动开发服务器：npm start，访问http://localhost:3000查看示例应用。
6. 清除示例应用：npm run clean

Docker部署示例

Docker Run命令

bash
docker run -d -p 3000:3000 --name articulate-ui samtecspg/articulate-ui

部署后访问http://localhost:3000即可使用应用。

Docker Compose示例（docker-compose.yml）

yaml
version: '3'
services:
  articulate-ui:
    image: samtecspg/articulate-ui
    ports:
      - "3000:3000"
    restart: always

执行docker-compose up -d启动服务。