Your Name b1eab32c75 初始提交: FLNXI电商素材系统官方网站

- Next.js 项目框架
- 完整的认证系统集成
- 数据库配置和部署脚本
- 产品价格体系和文档
- Docker 部署配置

2025-12-13 21:38:32 +08:00

3.9 KiB

Raw Blame History

FLNXI电商素材系统 - 官方网站

企业级素材管理解决方案

在线演示 • 功能特性 • 技术栈 • 快速开始

📖 项目简介

FLNXI电商素材系统官方网站，采用苹果官方UI设计规范，展示系统功能特性、技术规格和定价方案。

核心特点

🎨 苹果风格设计 - 遵循Apple Design Guidelines
⚡ 性能优化 - Next.js 14 + React 18
📱 响应式布局 - 完美适配各种设备
🎭 流畅动画 - Framer Motion动画效果
🔍 SEO优化 - 完整的Meta标签和结构化数据

✨ 功能特性

页面模块

Hero区域 - 醒目的标题和CTA按钮
功能展示 - 8大核心功能介绍
技术规格 - 详细的系统要求和技术架构
定价方案 - 标准版和定制版选择
联系方式 - 多种沟通渠道
响应式导航 - 桌面端和移动端适配

UI特点

玻璃态效果（Glassmorphism）
流畅的滚动动画
悬停交互效果
渐变色彩搭配
阴影和模糊效果

🛠️ 技术栈

框架: Next.js 14 (App Router)
UI库: React 18
样式: Tailwind CSS 3
动画: Framer Motion
图标: Lucide React
语言: TypeScript
部署: Docker

🚀 快速开始

环境要求

Node.js 18+
npm 或 yarn 或 pnpm

安装依赖

npm install
# 或
yarn install
# 或
pnpm install

开发模式

npm run dev
# 或
yarn dev
# 或
pnpm dev

访问 http://localhost:3000 查看网站

构建生产版本

npm run build
npm start

🐳 Docker部署

构建镜像

docker build -t flnxi-website .

运行容器

docker run -p 3000:3000 flnxi-website

Docker Compose

docker-compose up -d

📁 项目结构

xiaso/
├── app/
│   ├── globals.css          # 全局样式
│   ├── layout.tsx            # 根布局
│   └── page.tsx              # 主页
├── components/
│   ├── Header.tsx            # 页头导航
│   ├── Hero.tsx              # 英雄区
│   ├── Features.tsx          # 功能特性
│   ├── TechSpecs.tsx         # 技术规格
│   ├── Pricing.tsx           # 定价方案
│   ├── Contact.tsx           # 联系方式
│   └── Footer.tsx            # 页脚
├── public/                   # 静态资源
├── package.json
├── tailwind.config.ts
├── tsconfig.json
└── next.config.js

🎨 设计规范

本网站严格遵循苹果官方UI设计规范：

颜色系统

主色调：Apple Blue (#0071e3)
灰度：Apple Gray系列
渐变：蓝色到紫色

字体

SF Pro Display / SF Pro Text
-apple-system字体栈

间距

使用4px基准网格
大量留白空间

动画

缓动曲线：ease-out
时长：300-600ms
微交互反馈

🔧 自定义配置

修改品牌信息

编辑 app/layout.tsx 中的metadata：

export const metadata: Metadata = {
  title: '你的网站标题',
  description: '你的网站描述',
  // ...
}

修改Logo

替换 next.config.js 中的图片URL，或将Logo放入 public/ 目录

修改配色

编辑 tailwind.config.ts 中的颜色配置

📝 许可证

📞 联系我们

📧 Email: contact@flnxi.com
🌐 演示站: http://sc.flnxi.com
💬 微信: 扫码添加企业微信

使用 ❤️ 和 Next.js 构建

3.9 KiB Raw Blame History Unescape Escape