YanYueIO Final Version(in Chinese)

其实已经讲过了说,不再对外开辟数据中心。然而计划赶不上变化,毕竟云服务器还有这么长的有效期呢。其他的话不讲太多,多说无益,来看看我的设计风格?

  • 因为我的数据中心其实也是根据(长期)居住地以及生活(姿态)进行调整的
  • 比如租的房子,就算你买了UPS和NAS,也难以放置吧? (随机的原因就会导致你搬家)

重构风格

嗯,设计感?用户体验?OK,看看苹果(apple.com)怎么做的吧。

  • 感觉不错,我仿照着来吧

移动端

icloud 移动端效果

桌面端

icloud桌面端

Nice. (体验一下 iCloud,OnePage 应用,确实是高工的细活)

比之我之前的主站页面,大致相似,但是要优雅很多。(优雅 VS 杂乱)

  • 其实不需要解释那么多,根本不需要;界面信息太多反而显得杂乱

旧主站


设计思路

前端系统

前端界面,凡是不登录就可查询到的信息,一律走动态API,即随机 Restful API 路径。

  • 还是以 后端为主 的开发模式,但数据交换主要用 json
  • API 的方式,后端有能力随机调整API路径,限制访问,权限控制
    • Javascript 调用,然后做好 同源策略 即可(防小人,不防君子)
  • 主要照顾移动端 ,(旧版的系统不是没有考虑移动端,而是选择性忽略)
old site mobile

主要是当时对前端多种媒体的适配比较反感,UI适配,不仅是电脑端,还要适配多个移动端,比如 8Plus, X, SE 这些手机到底怎么显示等,需要慢工,但我这只是个个人网站啊。。。

multi-device adjust

忘了说了,以往都是用的 4K 以及 iMac27 调试。结果 windows 上的体验并不好,这一回用 windows 同时适配。

windows10_match

后端系统

后端界面,即必须登录之后才能管理的(input),一律走模板渲染路线。

  • 各种 dash board 太多了,懒得说,随便选一个轻量级的吧 (后面再说)
  • 选择不依赖 jQuery,同时又是我熟悉的

同时适配移动端。

但是后端这里涉及到的子系统比较多,但由于是单机部署,感觉微服务也不适合。

  • 可以跑微服务,总觉得是不是有点多此一举呢

缓存嘛,够呛能跑起一个 redis,就用本地文件缓存吧(或者内存hashmap也行,只不过要自己做宕机的序列化与反序列化工作,麻烦;文件又不是很慢)。

图呢(各类 dash board, admin模板太多了,很多都有坑,我考虑一下)

哎呀,我超赶时间的。


技术选型

前端栈

嗯,前端系统,其实可以不用框架,javascript api 已经足够用于(ajax)请求和展示界面了。

不过为了方便,我还是用一下框架,毕竟有很多简化的了 API。

  • vue3.0 吧,react 吧

稍微想了一下,如果要配合后端系统的话,还是选,貌似俩都可以。

根据不熟悉,不投的原则

市面上,行业内动不动就是 vue.js 的各种暴风式的选择,从大众从大流可能比较好。

好,我选择 react,无他,不小心点到的。

image-20200911133425952

后端栈

这还用看,无脑的 SpringBoot, Mybatis 啊。

  • 比起 python 的框架,比如 django 而言,这里很多子系统还是要自己设计

Wait,要不要后端数据库呢?

我的云服务器大概还能跑一个 MySQL/MyriaDB/ProgreSQL吧。

  • 我其实想用 python 的 django,也很快,也很全,关键是 开发效率更快
  • 但为了接轨企业的实际技术栈,用 java 吧

至于 MessageQueue啊,Cache啊,配置中心吧,抱歉我就一个单机云服务器。

  • 只不过不想花更多的钱,时间而已 (一台机器兼顾多方面用途…感觉要类似它了)

image-20200911134124875

我真的没有觉得 Google 云便宜,用用流量您就知道了(往中国大陆)。

最终效果

尽管还有很多没有进行细致调整,目前先这样了,请访问 yanyueio.com