Griseous

An alternative frontend for Zhejiang University CC98 Forum.

Preview

特性

• 侧边 Drawer 打开帖子，避免浏览体验被切换标签页或后退操作打断
• 设计选择：新帖页面与搜索页面分页，帖子页面无限滚动
• 可屏蔽关键词、特定用户的帖子内容、特定用户的头像（Work In Progress）
• 另一种界面风格

Inspired & Influenced by

Mew Online

Mew 在社区形态与交互界面上做出的许多创新是引发我写这个项目的直接原因，比如：

• IM App 式样的“话题讨论”（在线聊天室）
• 点击“想法”（帖子）后打开侧边 Drawer 展示
• “话题”（标签）的切换和置顶帖的处理
• 桌面端非传统的多栏式布局，每栏均可独立滚动
• 每个“节点”（版块）和“话题”（标签）都有相对应的图片

目前来说我不是它的深度用户，只浮于表面稍微体验了几次。有些特性对我来说不那么方便，因此出于实用考虑，也由于这个项目的性质所限，没有选择做完全的仿制。

V2EX

参考了首页的新帖界面等经典的设计。

LeetCode

借鉴了题库页面的布局。

Tail-Kit

学习了基于 Tailwind CSS 设计原语的典型界面风格。

技术栈

• React 及相关生态
  • React Router
  • React Query
  • zustand
  • react-use
  • react-oidc-context
  • react-infinite-scroll-hook
  • React Hook Form
  • react-markdown
  • classnames
• 杂项
  • ky
  • BBob
  • Immer
• 样式
  • Tailwind CSS
  • Material-UI
  • Headless UI
  • heroicons
• 工具与规范
  • Vite
    • vite-plugin-pwa
    • Rollup Plugin Visualizer
  • pnpm
  • ESLint
    • eslint-config-airbnb
    • eslint-plugin-simple-import-sort
  • Prettier
  • husky
  • lint-staged
  • Conventional Commits
• TypeScript
• Cloudflare Pages

TODO

见 Projects。

LICENSE

MIT