给下一届学员的魔改大赛参赛手册(内含彩蛋)
五月是我工作以来最最繁忙的一个月,因此比赛过程中一直没有时间去认真的写攻略贴。现在得以清闲一阵子,我很认真的写了这个参赛指南,从开始构思、收集资料、到写作完成,本文花费了我约15个小时,希望它可以为你节省更多的时间。
其实Xdite老师的参赛手册已经是很全面的了,我这里以参赛者的角度,增添了一些心得,大神请一笑之。
一、开始之前,明确目标
我的目标:
- 我设计这份参赛手册,是为了助你达成这个最低目标:上传作品,参加比赛!(相信我,看完本指南,你一定可以做出足够参赛的作品。)
- 根据全栈营的统计,参赛就意味着你已经成为前40%的人!
你的目标:
比赛之前,我希望你也能认真思考,搞清楚你想通过全栈营得到什么。
一是,明确方向。
- 问问自己:参加比赛是为了对学到知识的迁移练习,还是仅仅为了赢得奖品?我个人认为魔改大赛的意义就在于对2个月的课程学习进行迁移练习。
- 如果仅仅是为了赢得奖品,很可能陷入二期学员的疯狂拉票大坑之中,从而降低了比赛带给你的成长速度,甚至因为自己得票较低而放弃比赛,进而放弃自己的成长。
二是,目标具体。
- 既然是比赛,在大方向明确了之后,还要根据队伍的实际水平,确定一个具体可达到的目标。
- 经过了Joblisting魔改大赛之后,你应该对自己的水平有一个比较准确的了解。真实评估自己(与队友)的能力之后,确定你们的具体目标,比如前八名。
- 然后根据比赛规则将这个目标转换为可衡量的目标,比如作品得到800票。
- 找到可衡量目标的的解决办法,比如宣传你的作品、分享你的攻略贴、帮助他人解决比赛中的困难等等。
三是,明确魔改大赛比的是什么:
- 大赛比的是“如何将大功能拆分成可执行的小任务,并达成它们”(我认为这也是我在全栈营最大的收获)。大赛比的不是CSS、HTML、JS等前端技巧。
二、参赛指南篇
- 完成JDstore基础教程
- 找到队友,组队成功
- 确定网站主题
- 完成MVP的开发,并发布作品
- 持续更新,作品宣传
1. 完成JDstore基础教程
跟着全栈营“购物网站”教程,完成JDstore demo的开发。
Checklist:
- 后台管理员可以管理产品的CRUD
- 后台管理员可以针对产品上传图片
- 顾客可以将产品加入购物车
- 顾客可以显示购物车明细
- 顾客可以计算购物车内总价
- 顾客可以删减购物车的物品数量
- 顾客可以针对订单结账
- 顾客可以在下单之后收到一张订单确认信
- 顾客可以看到自己所有的订单
- 顾客可以付款(暂时利用is_paid)
- 后台管理员可以将订单进行不同的操作(如:已下单、已结账、已出货、已退货、退货)
为了帮助你更好的理解“购物网站”教程,我为你准备了:全栈营「豆知识」合集,详解下面彩蛋篇。
2. 找到队友,组队成功
(1)关于组队
JDstore魔改大赛要求必须两名Vip学员组队,才可以上传作品参与比赛,因此建议尽早寻找合适的队友。关于找队友我建议按照以下几点原则进行:
做好自我介绍,方便队友了解你
如果你希望和不是特别熟悉的人组队,第一步就是向对方清楚的介绍你自己。自我介绍要包含你的优势(前端、后端、文案、人缘等),你的作品,你的性格,你能用于比赛的时间段,你对队友的要求,你的联系方式等等。比如:(1)我是 xdite,家住北京朝阳,一个礼拜有三天晚上可以编程,周末一天可以参加面对面组队。擅长:编程推进、文案写作。征求美术、运营、前端擅长者(三选二)同学一起组队。有意者 slack 私聊。
(2)或者参考潘鹏同学的自我推荐:就近原则,配合方便
如果你所在的城市有全栈营的Meetup,我建议优先在Meetup中寻找队友,,这样配合起来会很方便。如果本地没有合适的队友,可以考虑远程组队(但注意同时区)。队友之间要有互补性
这里不仅仅是指技能或热情上的互补性,比如你喜欢做前端(CSS/文案等)、队友喜欢做后端(写功能)等。还包括性格上的互补,比如你有领导气质,可以主导比赛进程,适合作为主程,而队友比较善解人意,能很好的配合你,可以作为副程等。对队友有一定的了解
这里主要是指对队友的性格、审美等有一定的了解,尤其是审美。全栈营学员年龄和区域跨度大,每个人审美各不相同,选择审美基本一致的队友,才能设计出双方都满意的作品。如果希望获奖可以适当选择已有一定影响力的队友
魔改大赛最基本的规则还是看投票,因此你的目标是想获奖。那么选择有一定影响力或者实力较强的队友,是个不错选择。这里的有一定影响力,主要指 Joblisting魔改大赛获奖作者、各微信群主动积极者、各地及线上Meetup组织者等。尽早组队,尽快磨合
尽早组队不仅可以让双方尽快磨合,而且也有充足的比赛时间,可以让你们获得早期红利。我和我的队友@胡颖同学就是在Joblisting魔改大赛结束的第二天完成组队的。
组队成功后的几点建议:
- 组队合作过程中一定要坦诚沟通、信任对方、保持谦虚、换位思考、必要时妥协。经常问问自己,这样做能解决你们当前的主要问题吗?
- 与队友之间多鼓励,不抱怨。
- 开始协助之前,先熟悉协作开发技巧(见下文)。这会为你们省去大量的后期磨合时间。
- 每人每天至少确保2小时以上比赛专用时间。
- 固定时间,每天召开15分钟组会(可以使用Zoom视频),主要介绍各自做了哪些事情,遇到了什么困难,下一步将如何行动等等。组会的主要目的在于跟进项目进展,确保不偏离方向。
- 做好分内的事。主程和副程以及各自的分工确立之后,双方要各自负起责任,按照分配发任务,确保自己手上的任务按时完成。此外主程要负起项目leader的责任,在项目滞后时,主动分析原因,尽快解决。
- 小功能2小时没有完成,先放弃!重要功能2天没有完成,先放弃!
- 写代码时,尽量做到代码整洁美观,做好必要的注释。经常git commit,且描述清楚改动的原因。
- 每天写ORID开发日志。方便队友了解、方便发布功能更新、方便后期复盘。
(2)学习协作技巧
Github协同开发
关于Github协同开发网上有很多教程,为了防止你迷失,建议队友间提前确定一种你们喜欢的合作方案,我和我的队友是选择如下合作方案。
- 主程建立该项目Github库,然后邀请 副程 作为该项目的协同开发者。
- 副程每天开始写代码之前,
git pull
拉取远程最新代码 - 副程新建分支
git checkout -b 你的名字缩写_功能名称
- 副程完成开发,将该分支
git push origin 分支名称
到远程库中 - 副程通知主程发起
pull request
将该分支合并进master中 - 主程针对该分支发起
pull request
,审核完毕后,将其合并进master中 - 主程、副程定期
git pull
主干master
- 确定好你们的合作方式之后,我建议在你们比赛作品的README.md中,清楚的将你们的Github协同开发约定写下来。
利用Tower协同开发
Tower使用比较简单,非常方便。网址:https://tower.im/。具体使用请参考教材:[利用 Tower 进行项目管理](https://fullstack.xinshengdaxue.com/posts/1237)。
3. 确定网站主题
组队完成后,接下来就是确定网站主题和风格了。
关于如何选择网站主题和风格,我的建议如下:
(1) 尽量利用自己的特长,选择真实项目。
知道自己擅长解决什么问题,然后利用自己的专业特长,建立真实的项目。比如:
- 现实生活中你和朋友组织了一个旅游定制的工作室,那么你可以做一个“高端旅游定制”的网站,这样可以从你专业的角度来优化你的网站,因为你自己就是真实的使用者。
- 本次参赛作品”潜在世界“的作者就是一个潜水教练,根据自己真实体验、自己拍摄的视频等来制作这个网站的。
(2) 考虑到目标群体的喜好和接受度
参加魔改大赛,你的网站最直接的使用对象就是全栈营学员。因此可以考虑全栈营会员的喜好与接受度。比如:
- 本次比赛很多作品的主题都是知识平台,但是投票人数都比较多,获得了大家的好评。
- 此外,一些科技感很强的作品,也深受大家喜欢,比如作品“米家”,该作品每个页面风格也都很统一。
(3) 必要的稀缺性
作品既要被大家喜好,有不能太过普通。比如:
- 本次比赛卖美食的网站很多,如果作品不是特别出彩,相对来说就很难吸引别人的注意力。
(4) 要考虑到项目实现的难度
你的设想要结合你们队伍当前的真实能力水平。比如:
- 我和队友在比赛开始一个月前就完成了组队,并确定了最初的主题,最开始我们想做一个美术作品的竞拍网站,我们觉得这个功能很炫,也按照User story对网站的功能进行了拆分,也参考了类似的网站和源代码,但是在开发了2周之后,不仅作品BUG不断,且越做越发现我们的网站很难达到真实拍卖网站的水平。为了不影响后续的比赛,我们按照Xdite老师的建议,将注意力放在我们可以实现的功能上,及时的停止竞拍功能的开发,更改了网站主题。
(5) 参考类似网站,确定自己的网站风格
选择好主题之后,你可以看看目前与你的网站较为类似的真实网站,他们的风格是怎样的。比如:
- 本次参赛作品“米家”,科技酷玩主题,就是参考锤子手机官网的风格制作的,网站色系不多,简洁清爽,而且每个页面都科技感十足。
- 又如作品“南山先生”,风格统一、古韵十足,连Xdite老师都留言,声称自己被惊呆了。
- 还可以参考@韵儿爸爸的一篇文章:三个妙招,做出接近90分的网站页面!
4. 完成MVP,并发布作品
确定完成主题之后,在Tower上按照Must Have、 Should Have、 Could Have、 Nice to Have写下你们的User Story(差分至最小可执行的程度), MVP作品功能无需过多吗,最好不超过30条。并按照下表排开发优先级:
- 一定要做 + 简单
- 一定要做 + 难
- 可以做 + 简单
- 可以做 + 难
- 不一定要做
可以按照Xdite老师的参赛指南中“前两周如何快速推进开发进度?”来快速开发,如下所示:
然后,主程按照按照User Story和相应发开发优先级,开发相应的基础功能,MVP开发时无需考虑后期优化的事情,先造出滑板车,然后再考虑制造小汽车。
- 副程继续设计网站手稿,收集图片等素材。
- 每天召开组会,主程及时把握队伍方向。
- 记住,不要追求完美!完美有毒!比赛开始后,第一时间发布作品,争取上推荐榜!此举有战略意义,参考Xdite老师的Hackthon比赛经验谈。
- 关于快速开发landingpage的小套路:由于比赛已经进行了2期,各种landingpage均已出现,因此建议从模仿开始,可以参考全栈营往期比赛的同学的源码进行修改,快速制作自己的landingpage。
- 当然,如果你们时间很紧急了,可以参考后面彩蛋中:「我的JDstore魔改大赛作品复盘」一节,在我的网站功能上进行修改。但是这样做可能会降低你的开发体验。
5. 持续更新,作品宣传
完成MVP只是个开始,只有不断的更新迭代才能让大家看到你的努力。
后续给作品增加哪些功能或如何迭代?
- 参考往期和同期学员作品具有哪些可以借鉴的功能?
- 去论坛寻找他人分享的功能帖子。
- 红包开路,请朋友帮忙测评?得到最真实的反馈。
- 参考同类型真实产品具有哪些非常棒的功能?
- 等等
如何让别人更喜欢你的作品?
- 问问你自己对自己的作品满意吗?你自己喜欢它吗?
- 在slack、微信群等主动帮助同学debug。
- 到别人的作品页面留言鼓励,传递正能量,通常大家会礼尚往来。
- 不过分打扰他人。比如,不要使用微信、slack强行拉票,很容易引起他人反感。
- 等等
如何推荐自己的作品?提高曝光率?
- 参加当地Meetup,介绍自己的网站。
- 在论坛分享你的攻略帖子或参赛心得,帮助更多的人。
- 由于全栈营的比赛页面不能展示全部作品,但是一旦你更新了作品后,你的作品就会进入第一页。因此,在完成MVP并上传后,每天至少要更新一次作品(即使是更新首页大图等),并在作品的更新日志和留言中做说明,以便同学们注意到你的更新。
- 主动发朋友圈、微博等宣传自己的作品。
- 等等
二、参赛工具篇
下面推荐一些我们队伍在比赛中用到的工具、知识或网站,这些都是很简单的工具或知识,但是可以帮你节省大量时间。
素材网站推荐:
三大军火库
icon/logo网站
设计师网站(丰富的前端资源)
后期宣传作品时可以用到的网站
图片素材网站(找图是个坑,切勿耗费太多时间)
- 淘宝!淘宝!淘宝! — 商品展示图片,建议直接找成品。
- 京东!京东!京东! — 商品展示图片,建议直接找成品。
- Unsplash — www.unsplash.com
- Picjumbo — www.picjumbo.com
- Gratisography — www.gratisography.com
- Superfamous — www.superfamous.com
- Little Visuals — www.littlevisuals.co
- Split Shire — www.splitshire.com
- Pixabay — www.pixabay.com
- I’m Free — www.imcreator.com/free
- New Old Stock — www.nos.twnsnd.co
- Function Free Photos — http://wefunction.com/category/free-photos/
- Paul Jarvis Free Photos — http://pjrvs.com/a/photos
- Zoomy Images — http://zoomyimages.com/
- Dollar Photo Club — http://www.dollarphotoclub.com
- Compfight — www.compfight.com
- Stocksy — www.stocksy.com
- Placeit Product Shots — www.placeit.net
- iStockphoto — http://istockphoto.com
- offset — http://www.offset.com
- Corbis — http://www.corbisimages.com
- Facebox — http://facebox.io
- 3D PSD图片 — https://www.pixelsquid.com/
实用工具推荐:
- Github基础知识补充
- Zoom — 线上会议工具,可共享屏幕,增加讨论效率
- TeamViewer — 远程桌面控制软件,可以用于队友间debug
- 实用 Chrome 插件推荐 — http://kerzzi.logdown.com/posts/1803586
- 图片压缩、格式转换、尺寸一件调整 — http://www.tuhaokuai.com/
- 美图秀秀网页版(长图片拼接) — http://xiuxiu.web.meitu.com/puzzle/
- 在线颜色选择器 — http://www.atool.org/colorpicker.php
- 标准颜色码 — https://www.materialui.co/colors
- 助你提升魔改效率的Atom插件 — https://forum.qzy.camp/t/atom/1338
- 如何更专业的使用Chrome开发者工具 — http://kerzzi.logdown.com/posts/1744242
- snip —— 全屏截图工具
- ipic —— 图床工具
- 小白用的P图神器,基础功能“秒杀” PS
- 背景视频资源网站:pixabay —https://pixabay.com/
- 背景视频资源网站:cover — http://www.coverr.co/
可以参考的建站网站(可参考风格,不建议直接copy,这是个坑)
三、心态篇
全栈营学习与参加比赛的过程中,难免会惰怠,或者看到他人闪闪发光的作品而灰心气馁。我也有过这样的经历。这节心态篇,就是我在遇到这些情况时的应对措施,与你分享。
如何长时间保持比赛前期的能量爆棚状态?
- 作品上线之前,不关注他人作品。避免因对比而造成情绪波动,影响正常开发进度。
- 参加Meetup,互相鼓励。
- 参加在线直播,让鸡血教主Xdite老师帮你打气。
我很努力但是得票很低我不开心,怎么破?
- 请放心,全栈营的评委们是真正不在单一维度做比较的人,二期的比赛结果,就是在多维指标下进行比较而产生的。因此如果你真的很努力,即使得票不高,你的其他维度的努力肯定会被大家看到的。
产品上线后,发现自己的作品和他人差距很大,因此产生放弃的念头,不想继续迭代,怎么破?
- 不要中断产品迭代。每次大赛都有黑天鹅事件出现,而参赛作品总共才100+个,而且部分的作品是上线后就放弃迭代的,因此你很可能成为下一个黑天鹅,而且大赛是有励志奖的!
- 不忘初心,经常问问自己参赛的目的是什么,仅仅为了赢得比赛,还是真正的获得成长,而我有没有成长呢?
“努力但不一定能获得奖品,但是不努力的确很舒服啊!O(∩_∩)O哈!”
- 我没有把握说不努力是个过错,但是我非常有把握的说,不努力你一定会错过!要知道过错是可以改的,但是错过的是不会再回来的。
四、经验反馈:请远离以下大坑
查理·芒格:“如果我知道我将在哪里死去,我将永远不去那里。”
因此,为了你更好的参加比赛,我收集了一些我和其他全栈营同学所遇到的坑,远离这些坑你就成功了一半:
- 开始的目标不要太高,不要将注意力放在炫酷的功能上,而是放在自己能力范围内的事情上,以项目上线为第一目标。
- 找队友要尽早。
- 每天的例会不要中断。
- commit要明确写出修改内容。
- 不要过于关注票数,忘了参赛的初心。附送@韵儿爸爸的一句话:成为真正大神后,再去接受更多鲜花和掌声吧。
- 保护注意力,比赛的同时,切忌学习其他大型技能。
- 切莫钻牛角尖,小功能2小时没有完成,先放弃!重要功能2天没有完成,先放弃!此外,及时求助很重要。
- 不要追求完美。
- 多多和其他同学交流,自己主动一点,会发现他人也希望能和你交流。
- 如果时间允许,尽量当天看直播。
- 多学习他人源码,尤其是一、二期比赛获奖作者的源码,代码干净,注释漂亮。
- 有想听的直播,主动在论坛的直播心愿池中许愿。
- 尽量带着问题,参加Meetup,并记录。
- 坚持写ORID。可以记录项目开发日志和自己的心路历程。或者把做过的功能,写为教程,不要觉得别人写过,自己就可以省略。
- 放弃傲慢,保持谦虚,听老师的话。你会发现每个作品都有值得借鉴的地方。
- 组队合作过程中,一定要坦诚沟通、信任对方、保持谦虚、换位思考、必要时妥协。
- 注意休息,感觉效率低下时,可以去运动或者睡觉。
- 由于全栈营的比赛的规则是有可能改变的,这个不是你能控制的。但是你的成长却是你可以控制的,将注意力关注在你能改变的事情上。
- 和队友一起,多看几遍本参赛手册。O(∩_∩)O哈!
五、彩蛋篇
彩蛋一:全栈营「豆知识」合集(持续更新)
为了更好的帮助你理解全栈营的JDstore等课程,我收集了全栈营各种「豆知识」(小而有趣的知识点),希望你学的开心。(如果链接失效,你可以在我的logdown分类:“ROR豆知识”中找到上述内容)
彩蛋二:「我的JDstore魔改大赛作品复盘」(持续更新)
为了助你更好的参加比赛,这里为你准备了 「从零开始做购物网站」的全部教程。这是我参加全栈营JDstore的全过程复盘。我的作品远远比不上那些大牛,功能也不够炫,而且这也是我第一次写复盘教程,所以代码、教程顺序、语言组织也很水。但是可以为准备不充分的同学提供参考,大神请一笑之,当然我也会持续更新这个教程,努力的去完善它。
网站效果演示:https://jfshop.herokuapp.com/
教程目录:
- 「从零开始做购物网站」第1-11章 全栈营课程 JDstore demo(付课程详细讲解)
- 「从零开始做购物网站」第12章 暂停一下
- 「从零开始做购物网站」第13章 增加弹窗登录登出效果
- 「从零开始做购物网站」第14章 建立服务、关于等静态页面
- 「从零开始做购物网站」第15章 实作商品多级分类功能(1)
- 「从零开始做购物网站」第16章 实现前后台分离
- 「从零开始做购物网站」第17章 完成商品分类功能开发(2)
- 「从零开始做购物网站」第18章 优化商品管理:增加部分属性,合并new和edit页面
- 「从零开始做购物网站」第19章 暂停使用carrierwave,选用paperclip进行多图上传
- 「从零开始做购物网站」第20章 分类和商品展示页面开发
- 「从零开始做购物网站」第21章 增加商品点赞功能
- 「从零开始做购物网站」第22章 增加商品评论功能
- 「从零开始做购物网站」第23章 开发个人中心和默认收货地址
- 「从零开始做购物网站」第24章 使用SendCloud服务发送邮件
- 「从零开始做购物网站」第25章 利用paperclip和qiniuyun在Heroku上显示图片
- 「从零开始做购物网站」第26章 实作商品社交分享功能
- 「从零开始做购物网站」第27章 增加客服功能
- 「从零开始做购物网站」第28章 给购物车增加加减按钮
- 「从零开始做购物网站」第29章 美化购物车界面
- 「从零开始做购物网站」第30章 美化商品展示页面,增加收藏商品功能
- 「从零开始做购物网站」第31章 新增商品多级搜索功能
- 「从零开始做购物网站」第32章 美化服务页面
- 「从零开始做购物网站」第33章 美化navbar、footer、商品首页
- 「从零开始做购物网站」第34章 实作landingpage页面
- 「从零开始做购物网站」第35章 美化关于页面
- 「从零开始做购物网站」第36章 实作支付宝真实支付功能
- 「从零开始做购物网站」第37章 实作微信真实支付功能
- 「从零开始做购物网站」第38章 大扫除:清理一系列小BUG
- 「从零开始做购物网站」第39章 正式上传Heroku
- 「从零开始做购物网站」第40章 超强彩蛋来袭!
彩蛋三:全网最全的购物网站功能教学贴合集
我知道我的网站功能还满足不了你的需求,不要着急。我为你推荐彭皓同学的功能教程帖子:【被编程比赛榨干后产生的大量学习资源,与你分享】–JD魔改总结,目前我见到的最全功能教学贴。
当然全栈营的论坛也是一个宝库:
彩蛋四:全栈营课程结束后的自学路线(持续更新)
我是一个上班族,我参加全栈营学习是为了转行,我很喜欢编程。但是坦白说,仅仅依靠全栈营的课程很难让我找到工作,而且需要Ruby程序员的公司在国内还是比较少的。因此,为了真正获得转行的资格,我制定了一个不太靠谱的7个月持续自学计划,我的计划偏向于前端,但很多内容可以通用,如果你感兴趣,可以参考。
我会在计划的执行过程中不断优化的该计划,期待惊喜的到来。
我的编程自学计划:https://github.com/Kerzzi/ruby_notes/tree/master/00_self-learning_plan
我也会持续将我的学习心得或笔记,记录在我的Github中ruby_notes库,如果你也感兴趣,欢迎关注。
彩蛋五:优秀ROR、Ruby学习资料收集(持续更新)
其实彩蛋四中已经包含了很多优秀的学习资料,这里再次集中将优秀ROR、Ruby学习资料进行收集,希望可以帮助到你。
- 《Rails 102》
- 《Ruby 程序员修炼之道》
- 《Ruby元编程》
- 《Ruby 原理剖析》
- Ruby中的元编程
- Ruby 风格指南
- Rails 风格指南
- Ruby on Rails 指南
- Ruby on Rails 實戰聖經
- Ruby on Rails Tutorial 原书第 3 版
- Rails 实践
- Rails 5 开发进阶(Beta)
- Ruby 源码解读
- Ruby on Rails Guides
- 编写Ruby的C拓展
- 书单:编程相关经典书籍
- Ruby China精华帖
- Rails 常用 Gem 列表 - Awesome Rails Gem 中文版
六、写在最后
- 以上就是根据我自己JDstore魔改大赛的心得制作的参赛指南,我的目标是助你能完成作品、参加比赛,但不保证能获得大奖。
- 编程让我感到愉悦,我很开心自己参加了全栈营课程,它让我成为更好的自己。感谢全栈营所有的老师和同学们,有幸与你们为伍,共同学习,一起进步!
- 如果你也想成为更好的自己,可以使用我的专属推荐码:5e5a-3b13-ce71,购买全栈营课程,可以为你省下2000元。当然,不是说参加了全栈营课程就一定能让你脱胎换骨,成为想要的自己。一切的决定权都在你的手中,想好了再来,祝好!
- 附送文章一篇:参与全栈学习这么久,你觉得自己和之前最大的不同是?
最后,如果你喜欢我的文章、想与我交流,欢迎你通过如下渠道联系我。
- 邮箱:kerzzi@outlook.com
- Github: https://github.com/Kerzzi
- 微信公众号:kerzzi
- logdown: http://kerzzi.logdown.com/