[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
1 / 2
To page
fhy
deepin
2021-05-01 18:30
#1
Reply View the author
把一切操作变成GUI
deepin
Backbone of ecological co-construction group
2021-05-01 18:30
#2

进不去     

Reply View the author
fhy
deepin
2021-05-01 18:33
#3
把一切操作变成GUI

进不去     

github 打不开么

Reply View the author
bsidb1
deepin
2021-05-01 18:44
#4

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

Reply View the author
lcw0268
deepin
2021-05-01 18:49
#5
It has been deleted!
lcw0268
deepin
2021-05-01 18:51
#6
It has been deleted!
MeowVing
deepin
2021-05-01 19:08
#7

厉害啊膜拜大佬~

达成成就:在 deepin 里用 deepin,在浏览器里看浏览器:

 

Reply View the author
Fredoong
deepin
2021-05-01 19:31
#8

去看了一下,页面做的不错,很棒。

 

小尾巴~~~专属于Deepin平台开发者的QQ群 792593947

Reply View the author
fhy
deepin
2021-05-01 19:32
#9
MeowVing

厉害啊膜拜大佬~

达成成就:在 deepin 里用 deepin,在浏览器里看浏览器:

 

禁止套娃 哈哈

Reply View the author
186******75
deepin
2021-05-01 20:00
#10

相当的不错!牛!

Reply View the author
蔡EEPIN
deepin
2021-05-01 21:35
#11

卧槽  牛逼! 体验甚至比官方系统还好😂

Reply View the author
深圳市耀影科技有限公司
deepin
2021-05-02 02:34
#12

牛逼

Reply View the author
剥壳白煮蛋
deepin
2021-05-02 03:44
#13

这也太nb了!

Reply View the author
waittingsummer
deepin
2021-05-02 06:54
#14

无限转圈圈

Reply View the author
o0******[email protected]
deepin
2021-05-02 07:00
#15

牛人,真多。

Reply View the author
o0******[email protected]
deepin
2021-05-02 07:02
#16

这个可以直接,让新手试用。免安装,都。

Reply View the author
把一切操作变成GUI
deepin
Backbone of ecological co-construction group
2021-05-02 19:33
#17
把一切操作变成GUI

进不去     

事例页面进不去

Reply View the author
guaguale
deepin
2021-05-06 16:28
#18

https://vivek9patel.github.io/  可以看看这个

Reply View the author
cjy2
deepin
2021-06-12 01:51
#19

只能套两层

Reply View the author
cjy2
deepin
2021-06-12 01:52
#20
It has been deleted!
1 / 2
To page