[Feelings & Sharing] 【转载自v2ex】用vue写了个网页版Deepin
Tofloor
poster avatar
fhy
deepin
2021-05-01 18:25
Author

项目地址:https://GoodManWEN.github.io

 

仓库地址:https://github.com/GoodManWEN/GoodManWEN.github.io

 

这个项目产生的契机挺巧和的,因为最近需要一个项目展示页,海外企业招聘比国内更看重这个,正好在研究 Github Pages,就在论坛看到了之前一个朋友发帖的最近 github 挺火的一个网页版的 ubuntu 。凭借好奇点开以后,效果确实挺惊艳的,我感觉我做项目展示也可以搞个类似的界面,因为我完全不是前端方向,只是希望表示自己有前端能力的话,类似的页面应该足够酷了。

只是比较可惜,那个仓库完全是由 react 写的,我完全不会用 react 。再加上那个页面的作者大概设计上只是拿来当做一个展示自己技能的 demo 平台,其实页面并没有什么实质内容。而我则希望最好这个东西能在自我介绍的基础上再用来展示一些以前写过的技术博客,或者做过的项目之类的,所以想了想还是重写了,于是就有了现在这个项目。

目前的成品简单来说,这是一个 Github pages 托管的静态页面,它的设计风格是模拟一个运行在网页中的 deepin 系统的 GUI,它的功能是可以展示 markdown 文件,所以可以用来展示博客或者项目文档。至于为什么是 Deepin,实际上我没用过 deepin 系统,只是因为 Ubuntu 已经有人做过了,再做一遍感觉很 low,而剩下的发行版中,想来想去还是用这个国产系统,想法就是就相当于为国产做宣传了吧。。(不过咋说呢,具体做的过程中感觉 deepin 体验挺一般的)

特性

这个项目目前为止和同类项目的区别在于几点,

  • 一是它的设计目的是除了展示简历还要展示博客,所以它有一个完整的虚拟文件映射目录,放在其中的所有 markdown 文件会以同样的目录结构被映射到网页中,我觉得这种分类风格还是比较适合于博客的,比如新建一个目录叫项目,下面有 Python,go,node 三项,里面分别放置各个语言做过的项目,类似这种分类对于展示项目经历来说应该比较清晰。
  • 二是为了让页面更加接近真实桌面,我实现了一个更加完善的窗口管理系统。也就是说你可以像在正常系统中一样地打开任意多个窗口,并且自由地拉伸、放大、移动他们,他们会按照正确的顺序、正确的焦距显示出来。
  • 三当然就是这个项目是 vue 开发的,广大 vue 程序员可以更容易地利用资源。

如同上文所述的,由于本人是个严重不专业前端,在加上完全是挤出来时间做的项目,实际开发时间大概只做了三天,项目中有各种不优雅的地方,请各位前端轻喷,有意见或建议欢迎 PR 。网页是面向外企做的,所以照着 Deepin 系统搞出了个怪异的英文版,如果各位有需要中文版应该改也不难。另外也是没有写博客习惯,想做网页了翻了翻只能翻出四五年前写的东西,也是醉了。

Reply Favorite View the author
All Replies
2 / 2
To page
cjy2
deepin
2021-06-12 01:53
#21
cjy2

只能套两层

居然不能发图片

Reply View the author
cloudseasail
deepin
2021-06-12 04:32
#22

有没有办法弄个真的deepin在server,把桌面给share给user,作为系统DEMO,这种技术叫啥?

Reply View the author
辟邪
deepin
2024-01-13 20:10
#23
bsidb1

这个页面也太高仿了!和真的系统好像!

抱歉它只是部分功能不能用而已

总之这系统跟谭景元win12网页版类似.。。。

另一个浏览器系统桌面的体验地址:https://tjy-gitnub.github.io/win12/desktop.html

拿走,不谢!

「Can you hear me now? 我会从此成为你的骄傲 现在就要出发 一切刚刚好」

Reply View the author
2 / 2
To page