爱意满满的作品展示区。
LeeReamond

前两天看见有人用 react 写了个网页版 Ubuntu,迫于不会用 react,我用 vue 写了个网页版 Deepin

  LeeReamond · Apr 30, 2021 · 16686 views
This topic created in 2017 days ago, the information mentioned may be changed or developed.

项目地址: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 系统搞出了个怪异的英文版,如果各位有需要中文版应该改也不难。另外也是没有写博客习惯,想做网页了翻了翻只能翻出四五年前写的东西,也是醉了。

116 replies  •  2021-05-24 19:53:54 +08:00
1  2  
❮ ❯
Richard14
Richard14
Apr 30, 2021
1
666 大佬,昨天摸鱼的时候看见了,太强了
whcoding
whcoding
Apr 30, 2021
2
厉害 ~
LeeReamond
LeeReamond
OP
Apr 30, 2021 via Android
3
@Richard14
@whcoding 谢谢谢谢,做了点微小的工作
muzihuaner
muzihuaner
Apr 30, 2021 via Android
4
666 牛批
MzM2ODkx
MzM2ODkx
Apr 30, 2021
5
3 天做出来有点牛逼啊,我专业前端 3 周都不一定做出来,哈哈
hm20062006ok
hm20062006ok
Apr 30, 2021
6
厉害
LeeReamond
LeeReamond
OP
Apr 30, 2021 via Android
7
@iMusic 主要太忙了,看代码的话会发现赶工痕迹特别明显。里面比如页面按顺序堆叠这种需求,需要从中间提出来一个放到顶部,正常比如应该用 b 树,实际上实现的时候全是遍历,一边写一边自己都蛋疼,不过确实没时间做
Muniesa
Muniesa
Apr 30, 2021
8
太强了
christin
christin
Apr 30, 2021 via iPhone
9
卧槽 大佬
竟然还是非前端的 厉害厉害
jerry033
jerry033
Apr 30, 2021
10
五体投地,叹为观止!
kidult
kidult
Apr 30, 2021
11
大佬,要说三天用 VUE 能写出来,而不会 react,我是不太信的
x86
x86
Apr 30, 2021❤️18
12
大佬的标题就是这么朴实无华:XX 天、前几天看到、迫于、随手、无聊
PinkRabbit
PinkRabbit
Apr 30, 2021
13
只能说牛逼
LeeReamond
LeeReamond
OP
Apr 30, 2021 via Android
14
@LIvid 不好意思好像错区了,第一次发个人项目,刚才看了一下好像应该发在分享创造区,我以为分享发现跟这个是同一个。现在还有办法修改吗
QUC062IzY3M1Y6dg
QUC062IzY3M1Y6dg
Apr 30, 2021
15
太强了吧
LeeReamond
LeeReamond
OP
Apr 30, 2021 via Android
16
@kidult 确实不会用 react,似乎 react 逻辑与 vue 不太一样,vue 的数据流动更经过一些,所以方便像我这种非专业前端,哪怕写成面条逻辑,能跑就行了。不过做过这次项目以后,倒是对 vue 的设计哲学也有了同感,模型设计满足 99%的使用场景就行了,自动化监控降低程序员的心智负担,在大多数项目中是值得的
PerFectTime
PerFectTime
Apr 30, 2021
17
大佬的标题就是这么朴实无华:XX 天、前几天看到、迫于、随手、无聊
hflyf123
hflyf123
Apr 30, 2021
18
不卡,很溜
695975931
695975931
Apr 30, 2021
19
牛逼啊!!!
Livid
Livid
MOD
PRO
Apr 30, 2021❤️1
20
@LeeReamond 嗯,感谢你选择这里发布你的作品。

已经移动到 /go/create
kidult
kidult
Apr 30, 2021
21
@LeeReamond #16 哈哈,同感,后端学前端表示 react 玩不转,vue 写 admin 后台和小程序一把梭
yl20181003
yl20181003
Apr 30, 2021
22
tql 🙀
devtiange
devtiange
Apr 30, 2021
23
太强了吧
dushixiang
dushixiang
Apr 30, 2021
24
非常厉害
NeoChen
NeoChen
Apr 30, 2021
25
牛逼了
waltcow
waltcow
Apr 30, 2021
26
tailwindcss 用的炉火纯青的
WishMeLz
WishMeLz
Apr 30, 2021
27
强


嘿嘿😁

CallMeReznov
CallMeReznov
Apr 30, 2021
28
really28
really28
Apr 30, 2021
29
star 了
gps949
gps949
Apr 30, 2021
30
额,还以为是网页对接后端 deepin 系统实现全功能,原来指的是长得像 deep 的网页啊
Lemeng
Lemeng
Apr 30, 2021
31
6666 。star 奉上
xrr2016
xrr2016
Apr 30, 2021
32
666
akakidz
akakidz
Apr 30, 2021
33
666666666
275761919
275761919
Apr 30, 2021
34
大佬的标题就是这么朴实无华:XX 天、前几天看到、迫于、随手、无聊
275761919
275761919
Apr 30, 2021
35
顺便也求下网页版 ubuntu 地址
zhuang0718
zhuang0718
Apr 30, 2021
36
强 !
yEhwG10ZJa83067x
yEhwG10ZJa83067x
Apr 30, 2021
37
啥时候可以讲一下这项目如何从设计到完成开发一系列过程
BeautifulSoap
BeautifulSoap
Apr 30, 2021
38
提一下,firefox 下元素位置不对
hellodigua
hellodigua
Apr 30, 2021
39
牛
imilano
imilano
Apr 30, 2021
40
太强了
Desiree
Desiree
Apr 30, 2021
41
牛逼...
Maxbee
Maxbee
Apr 30, 2021
42
强的可怕
silencelixing
silencelixing
Apr 30, 2021
43
66666 秀啊
duanxianze
duanxianze
Apr 30, 2021
44
太强了
leelz
leelz
Apr 30, 2021
45
太强了
longgediyi999
longgediyi999
Apr 30, 2021
46
牛逼
leusion
leusion
Apr 30, 2021
47
强啊,大佬,发现个小问题,就是程序窗口缩放有点小问题,只有鼠标停留在窗口的右边框和下边框,窗口才能缩放
Vegetable
Vegetable
Apr 30, 2021
48
「不专业」
expy
expy
Apr 30, 2021❤️4
49
https://copy.sh/v86/
这有个真的模拟器跑系统。
LeeReamond
LeeReamond
OP
Apr 30, 2021 via Android
50
@275761919 在我的 readme 里面有相似项目的链接


@BeautifulSoap 能 issue 一下错误的浏览器版本和错误情况吗?
LeeReamond
LeeReamond
OP
Apr 30, 2021 via Android
51
@leusion 正常缩放有四个边加四个角可拉伸,我做的时候只实现了右边,下边,和右下角,因为按这些方向调整只用调整窗口大小而不用调整窗口位置,属于一种偷懒的做法。。不过还好按照习惯这几个边的实际使用频率应该也更高一些
LeeReamond
LeeReamond
OP
Apr 30, 2021 via Android
52
@expy 这个是真大佬,之前好像见过完全用 js 的 win2000,似乎是这个当中集成的一个。我这个只是个网页而已,差的远
pigll
pigll
Apr 30, 2021
53
厉害 膜拜
neilyoone
neilyoone
Apr 30, 2021
54
太强了
huweic
huweic
Apr 30, 2021
55
可以的
mozhizhu
mozhizhu
Apr 30, 2021❤️1
56
@WishMeLz 应该对这个来个彩蛋,直接整个页面全黑了,红红火火恍恍惚惚
reiji
reiji
Apr 30, 2021
57
这行动力太佩服了,我也要加油了
paopjian
paopjian
Apr 30, 2021
58
天哪,太强大了
Yien
Yien
Apr 30, 2021
59
666 大佬,昨天摸鱼的时候看见了,太强了
stimulate1797
stimulate1797
Apr 30, 2021
60
牛逼
LeeReamond
LeeReamond
OP
Apr 30, 2021 via Android
61
@mozhizhu 很有趣,已添加,欢迎测试
Marszm
Marszm
Apr 30, 2021
62
大佬大佬.....看来工作不够饱和啊
caixiaomao
caixiaomao
Apr 30, 2021
63
有点厉害 😃
xxdsox
xxdsox
Apr 30, 2021❤️1
64
捉个虫,Resume 里面的 Coming Soon 打成了 Comming Soon
h1104350235
h1104350235
Apr 30, 2021
65
大佬,那个 React 写的项目,可以扔个链接么
fish267
fish267
Apr 30, 2021
66
太厉害了
wpyfawkes
wpyfawkes
Apr 30, 2021
67
大佬 666
zzlatan
zzlatan
Apr 30, 2021
68
厉害
pcmid
pcmid
Apr 30, 2021
69
https://i.loli.net/2021/04/30/VKOw9R7Zi1YDahv.png

套娃失败 哈哈哈 第三层就打不开了
xshwy
xshwy
Apr 30, 2021
70
@WishMeLz 我也 rm -rf /了一下 跳黑屏了…

![ops]( https://i.loli.net/2021/04/30/oKp5D4zRyGPF8qr.png)
bigShrimp8577
bigShrimp8577
Apr 30, 2021
71
仰望大佬,大佬都说不懂前端,我这种是不是出门都不敢说自己是做前端的了
2I0Mto2kjm0c0B9i
2I0Mto2kjm0c0B9i
Apr 30, 2021
72
nb
nii
nii
Apr 30, 2021
73
大佬强无敌我擦
molvqingtai
molvqingtai
Apr 30, 2021
74
几天时间能整出来,是真的强
Fgoo9527
Fgoo9527
Apr 30, 2021
75
zhaofy
zhaofy
Apr 30, 2021
76
准备摸个鱼开启自己的假期,摸着摸着,感觉自己就是个弱智 = =
wl62613
wl62613
Apr 30, 2021
77
感觉自己弱小无助..
Nyarlath0tep
Nyarlath0tep
Apr 30, 2021
78
666666
yazoox
yazoox
Apr 30, 2021
79
虽不明但觉厉!
codehz
codehz
Apr 30, 2021
80
窗口管理有点小逻辑问题
简单说就是在多个窗口同时激活的时候,点击不在顶层窗口的图标会无条件隐藏窗口,而不是提升到顶层(然后还会播放动画,就很尴尬)
asche910
asche910
Apr 30, 2021
81
太强了!!!
NoString
NoString
Apr 30, 2021
82
大佬过于凶悍 牛逼!
LittleYangYang
LittleYangYang
Apr 30, 2021
83
强!
xuanli
xuanli
Apr 30, 2021
84
star
leaves7i
leaves7i
Apr 30, 2021❤️1
85
别拦我,我还能套🐶
(不知道这个算不算 bug )
RRRoger
RRRoger
Apr 30, 2021
86
太强了吧
supercaizehua
supercaizehua
Apr 30, 2021
87
惊呆了
davidjqq19
davidjqq19
Apr 30, 2021
88
大佬 666 !
LeeReamond
LeeReamond
OP
Apr 30, 2021 via Android
89
@codehz 确实有这个问题,这个是由于按钮是否执行最小化的逻辑仅判断当前是否处于显示状态,而不是处于显示且显示于最高层。暂时不准备改了(
tojonozomi
tojonozomi
Apr 30, 2021
90
nb,这是真的 nb,给跪了
lz 还是非专业前端,3 天做出来,太狠了
rekulas
rekulas
Apr 30, 2021
91
执行力真强
不过作为一个 git 患者 想吐槽下 commit msg
jokerai
jokerai
Apr 30, 2021❤️1
92
charlie21
charlie21
Apr 30, 2021
93
可以参考 ubuntu 版本的实现一个垃圾桶
Cbdy
Cbdy
May 1, 2021 via Android
94
顺便发个 react 的 macos
https://macos.vercel.app/
LeeReamond
LeeReamond
OP
May 1, 2021
95
@charlie21 考虑过实现,但是由于我观察垃圾桶功能似乎只作为彩蛋,用来表示自己曾使用又抛弃的技术栈,似乎与核心功能没有太大关系。而实现方面工作量则比较大,因为需要实现一套独立的大图标文件显示 UI,且考虑到代码复用,如果垃圾桶实现了这套 UI,那么理所当然应该整合到文件夹窗口,让文件夹变成可以切换图片大小的模式,整个工作量又变得太大。简单来说躺平等 PR 了
yangheng4922
yangheng4922
May 1, 2021
96
牛逼啊 3 天搞定 还是非前端 开发的 作为前端的我都有点惭愧了
wuqinghaha
wuqinghaha
May 1, 2021
97
牛啊
userff
userff
May 1, 2021
98
太厉害了
titivillage
titivillage
May 1, 2021
99
太好看了,搞得我都想尝试一下 deepin
LearningToCode
LearningToCode
May 1, 2021
100
NB 我直接进行一个 star 和 frok 的点
1  2  
❮ ❯
About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1486 Online   Highest 6679   ·     Select Language
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.8.5 · 207ms · UTC 01:10 · PVG 09:10 · LAX 17:10 · JFK 20:10
♥ Do have faith in what you're doing.