【零基础】学会微信小程序开发-序章

理解并能掌握本系列文章内容，要求读者具有基础的HTML、JS、CSS开发经验。

哈喽，大家好，我是微笑君，自从去年也就是2020年10月份，偶然接触了一个小程序，让我瞬间有种眼前一亮的感觉，内心生出了一个想法：我想做一个这样的小程序，但是要比它做的更好！

不过激动之余，仔细想了一下，对于小程序开发，真的就是完完全全的零基础，在这之前，对于小程序仅仅只是使用过，那么想要快速上手学习并能尽快投入到实际开发中确实还是有很大挑战的。

通过我深思熟虑的思考后，总结了当下所遇到的难点：

1、从未接触过小程序开发，所以小程序开发对于我来讲就是一个黑盒，那么如何找到突破口是非常关键的，正所谓苍蝇不叮无缝蛋，必须要找到一个突破点，先让我们“钻”进去。
2、前端开发的基础过于薄弱（因为我本身是做后端的，只会一些简单的CSS布局），如何能做出一个有设计感、交互体验高、好用、易用的UI这也是一个非常棘手的问题。

通过以上分析，可以看出来对于微信小程序开发，我真的是一个零基础、连门都没找到的人，但是你认为我会放弃吗？答案很明显，并不会！如果真的放弃了，也不会有今天这篇文章出现了（手动滑稽）。

那么我们如何能一路披荆斩棘、不畏艰难险阻最后顺利到达成功的彼岸呢？我给你的答案是，不要想太多，不要好高骛远，古语有云：“不积跬步无以至千里，不积小流无以成江海。”，你只有迈出第一步，才有后续的可能。

所以我们第一步要做的就是甩开膀子大胆干，不要害怕什么都不会，不会可以学，但是不学就真的什么都不会了。

一开始说实话我也不知道从何入手，于是网上搜了一些微信小程序开发基础教程，看了一些视频教程后，基本把微信开发者工具如何使用弄明白了，也搭建起来了一个简单的demo工程并在手机端运行了起来。

这个时候我尝试模仿之前看上的那个小程序做一下页面UI，但是由于并没有设计经验，导致明明脑子有想法，但是却感觉无从下手，不知道如何通过代码把它给实现出来，我相信非专业前端设计的朋友如果真的去做小程序开发一定也会遇到跟我同样的问题，不过别担心，这都是短暂的，通过我亲身实践，我已经掌握了战胜这个问题的诀窍，跟着我一起学便是！

下面我给大家展示一下，从我做这个项目开始，一直到上线再到版本迭代，前端UI的变化：
1、第一版页面首页原型，模仿

2、小程序实现原型设计

3、不断完善，添加各种样式
4、重新调整思路，讲将主业页风格调整，换了背景图片
5、首页菜单调整，这几个菜单按钮都是我用PS+AI制作的

6、还是在设计首页的布局

7、这个是第一个线上版本，虽然还是不那么美观，但是跟初稿相比，是不是已经有很大的进步了

8、这个是最新版本，重新设计了UI，感觉比之前的更加高大上了

由于篇幅原因，这里没办法把这几个月我所有的经历全部描述一遍，但是通过这几个月接触小程序开发，我确实做到了从一个零基础小白到现在可以得心应手的开发小程序的一个完美进阶。

知识要分享才有价值，我觉得很多朋友经历可能跟我一样，零基础想学，但是苦无一个能领进门的“老师”，而且市面上的教程很多，但是并不适合自己，所以我想通过一系列文章，把我这几个月的学习经历、经验分享给大家，正所谓实践出真知，我相信我的这些经验能够很快让你入门，并能在实际开发中提供足够多的参考价值，避免你在学习过程中踩坑。

那么废话不多说了，接下来，我会按每周1-2篇的速度更新这个系列的文章，若有幸看到的朋友有什么问题都可以给我留言，我看到后都会第一时间给你回复的，那么接下来让我们开始这段“冒险之旅”吧！