[新手向]全栈开发聊天网站HouseTalk
发布于 2 个月前 作者 DoubleCG 1629 次浏览 来自 分享

一个暑假做的毕业设计,在这里分享一下,相互学习. Github: https://github.com/DoubleCG/stalk 网站:http://39.108.154.125 测试账号z00000, z00002,z00003,z00004. 密码都是123456789 还可以自己注册

接下来,我会逐步确认自己觉得写的不错或不好的地方,然后提出来…

13 回复

还未完善的地方: 1.没有聊天表情包 2.上传图片要有截图和压缩功能 3.ui还能更友好 4.没有mvvm

原因是没有时间了,或者时间超出预期范围.

打算整完这个就去面试一次,如果过了就实习,没过就回学校继续学习. 无论如何先会再看几本书,然后用Vue再做一个练手项目.如此反复,肯定有进步吧.VAR三巨头先挑一个顺眼的来实践,毕竟都没用过.自己用过才能有个印象和体会.

后台用的node吗

来自酷炫的 CNodeMD

这里确认一下用到的主要技术和框架: mongodb(Mongoose) node(Express) socket.io js(jquery) css(bootstrap) html(ejs)

个人认为,作为新手,先不要追求新东西,把旧的前人用的稳定的东西先学好,也能很有收获(之前学koa并没有太好的思路,之后用Express就直接上手了). 我写js的时候是在火狐浏览器,写到一半,main.js就已经有1100行了,之后为了方便和兼容才用jquery重写了一遍,写成700行,顺便又学习了jquery. http://jquery.cuishifeng.cn/ http://www.runoob.com/jquery/jquery-tutorial.html

在之后,发现css并不是很好管理,就用了less重写一遍,学习了less,把不够100行的css文件内容放在了对应的ejs里.所以现在dev里的css只剩下一个main.less了.这里要强调了一下:less真的很好用,仅仅是结构管理就能明显提高效率了. http://www.bootcss.com/p/lesscss/

最后才用gulp构建出dist,学习了gulp.但是现在我知道gulp和less在没开始写的时候就应该准备好了.有必要的话,jquery和bootstrap都是要这样. http://www.gulpjs.com.cn/docs/getting-started/ https://www.kancloud.cn/thinkphp/gulp-guide/43995

@DoubleCG 关于网站名字的来源:权力的游戏:House Stark => house Stalk => housetalk 读起来还很顺口,就用吧. 为了显得简洁一些: 就叫做 stalk 吧. 百度翻译: stalk 英 [stɔ:k] 美 [stɔk] n. [植] 茎,秆; 叶柄,花梗; 高视阔步; 偷偷接近,潜随; vt. 追踪,潜近; 高视阔步; vi. 高视阔步地走; 潜近,偷偷接近; [例句]A single pale blue flower grows up from each joint on a long stalk. 一条长长的茎秆的每个节上都会长出一朵浅蓝色的花。 [其他] 第三人称单数:stalks 复数:stalks 现在分词:stalking 过去式:stalked 过去分词:stalked

服务器还是很容易挂: 服务器是阿里云的ESC ubuntu 16.04 用的是nginx反向代理,也就是最最简单的操作. 关于服务器容易挂的临时解决方法是:(根本原因可能还是我后端代码没写好) supervisor 开启并监听服务  一旦服务器挂了,就重启. 另一个可能的方法是 forever start app.js. 二选一试试吧,还不是很确定. 可以我参考之前写的博客:http://39.108.154.125:70/chapters/work_talk/nginx.html

借楼分享下我的聊天室: https://fiora.suisuijiang.com 欢迎多多交流开发心得 web只能实现页面内截图, 比较蛋疼, 所以我只支持了粘贴发图, 截图交给系统或者其它软件 我也是阿里云ubuntu, 连续几个月稳定运行, 所以很可能是你代码中有什么异常情况没处理到

@yinxin630 你是用 forever start 吗?

@yinxin630 看了,很厉害啊,学习了

ejs 同名策略和传参调用:

ejs做为模板,调用的一个js脚本应该要是同样的名字,而这个js脚本应该有一个主函数,这个主函数应该也要是同样的名字.

为什么要这么做? 举一个例子:

有一个模板:something.ejs 其中这个模板有几行是这样的:

<script src=‘js/something.js’></script> <script> var data = ‘<%=data_from_node%>’ //传参调用: something(data); </script>

而这个something.js有一个主函数是这样的:

function something(data){ … }

所以无论是ejs,js还是js里面的主函数,都是同一个名字,这样在系统越来越复杂的时候,提高的效率是越来越明显的.

再者:有一个最大的好处:解决文件合并时的作用域问题,都知道每一次请求会产生额外开销,所以才需要gulp-concat模块. 只要你的ejs模板不重名,那么对应的主函数就不可能重名,那么就不存在作用域重名的问题了.

假如把dev/public/js中 的aa.js, bb.js , cc.js 都合并在dist/public/js/index.js

那么不论哪个ejs模板调用的都是index.js,且不会有任何问题.

所以同名策略的好处有: 1.提高效率 2.解决js文件合并的作用域重名问题

另外要说的是传参调用: 有时候会出现这种情况:后台传入数据比较复杂,需要经过复杂的渲染. 传参调用就是一个很好的解决方案了.

这是这个项目中main.ejs出现的几行:

var username = ‘<%=username%>’, user_info = ‘<%= user_info%>’, star = ‘<%=star%>’, stars = star.split(’,’), mess = ‘<%=mess%>’, tmess = ‘<%=tmess%>’; main(username,user_info,mess,stars,tmess);

main对这些数据进行DOM操作.

以上只是一点经验,还是多看书吧.

学习下 话说毕业设计不是做了就毕业了吗 怎么还会有暑假

@allen2001 提前做的,开学大四了.

回到顶部