前端方向

本文是逸夫408实验室本科生同学的入门培训资料，受委托发表至本网站。如果有任何错误信息，欢迎反馈至：794358907@qq.com。

一、前言

大家好，这一部分内容写给选择前端方向的同学。我们对大家每一部分内容的学习有基本的要求，但这也是大家达到看懂demo、进行简单编写的需要的掌握的基本知识点。如果大家想要进一步学习，做出更加完美的页面、更加完善的功能，那么希望大家进行深入学习这些功能。望大家充分利用好官方提供的文档以及其他所有可以学习到的途径。

二、微信小程序

微信小程序的学习包括基础学习与设计实践，其中基本学习包括WXML、WXSS、WXS的基本功能，在学习demo和设计实践的过程中会将这些知识结合在一起，了解他们之间的互动。学习完基础内容后，开始学习前后端组合的一个demo，这是包含了前端、后端与数据库的简化的一个案例。
我们在下面给大家推荐了一个视频课程，和一些有关前端开发的文章和技术文档。此外我们会给大家描述所需要的最基本学习内容和学习步骤。大家可以以此来检测自己是否掌握完全。

小程序的视频教程：
https://www.bilibili.com/video/BV1WQ4y1T7D8?from=search&seid=8840839384230125738&spm_id_from=333.337.0.0

参考文档：
1）认识微信小程序：https://www.ruanyifeng.com/blog/2020/10/wechat-miniprogram-tutorial-part-one.html
2）CSS flex布局语法：
https://www.runoob.com/w3cnote/flex-grammar.html
3）微信小程序官方文档：
https://developers.weixin.qq.com/miniprogram/dev/framework/
4）图标库：
https://www.iconfont.cn/

在大家学习完之后，我们需要看看自己是否以及完全掌握：
第一步：学会使用微信开发者工具，知道项目目录下每一个文件的作用；
第二步：学会基本的组件：<view>、<image>、<text>、<navigator>、表单组件（<form>、<button>、<input>），学习基本的css样式的配置；能够绘制出一个基本的页面，了解文字，图片如何放在想要的位置；
第三步，函数和api ，理解刷新函数setData
第四步：小项目demo：（demo我们会单独发一个套学习资料给大家。）
以上的基础要求是不完全的，我们希望大家预先了解基本的知识，这样在看demo的时候就不会那么地困难。
在拥有以上基础之后，我们就可以开始看实验室祖传demo了。大家在实际操作中会遇到很多奇奇怪怪的问题，但是没关系，遇到问题学会搜索，主动找学长学姐问问题。还有，什么问题都可以问的哦。 看demo时候的要求和注意：
- 把小项目运行起来
- 看懂前端部分（小程序的）每一句代码，知道这些代码的意义
- 大家看一下已有的注释，发现注释错误即反馈给学长（包括错别字哦，因为这是以后还要使用的）

扩展：希望大家学习http协议相关的知识。（不强求大家学习，仅希望大家了解一下）
https://www.bilibili.com/video/BV1KV411o7u5?spm_id_from=333.337.search-card.all.click

三、结语

不管在哪个阶段的学习，希望大家积极的探索自己喜欢的东西，用自己学到的知识去实践、去创造。遇到任何问题都可以来询问学长学姐。