纯自嗨：从零开始写一个小程序

mato

开个贴子，记录这件有意思的事情！

背景：
( H" H5 n1 e# l  T% S1 F冲突一：想学习，却找不到好工具
* h0 v3 n' k, x今年春节遇上了疫情，我宅在家里，处于“失业”状态，作为有志青年，不想每天刷剧、刷抖音，想着装一下B，提高一下英语水平。

, X% ~5 Y% o9 C2 Z" a- w* q. b于是，在朋友圈疯狂的广告洗脑下，我下载了几个当时很火的App，很认真地投入学习。
然并卵，使用了一段时间之后，发现效果不太理想：首先，这些App记单词过程太过于复杂，很多都提供了多种助记的方法，除了常规的词根词缀、联想记忆以外，还有图片记忆、电影情节记忆、思维导图记忆等，这样的好处是当时很容易记住单词，坏处就是忘得也很容易，大量的助记材料无形中增加了记忆的工作量，增加了记忆的负担，从而偏离了记单词的初衷；其次，练听力的功能普遍都是提供新概念英语或者VOA、BBC、TED等听力材料，对于基础不好的我，感觉在听天书；
难道就没有一款适合我这种菜鸟的App吗？
一个大胆的想法出现在我脑海里：自己开发一个App。
% o$ q) N( H1 o2 ?& ?" v$ L) B4 r
$ W6 Q' _# M. L* M# k冲突二：计划自己开发，却不是专业人士
为什么说这个想法大胆呢？因为我虽然是一名搞技术的工程师，但仅限于机械行业的。我所接受的完整编程教育仅是在大学期间的《C语言程序设计》。所以对事情一无所知，严重缺乏相关知识储备，除了大胆，我也不知道怎么来形容这个想法了。
但有句古话叫无知者无畏，而且作为理工男，我始终相信任何问题都有办法解决，只要你能够把问题描述得足够清楚。
因此这个想法一出现，我立马觉得应该去试试，结果怎样不重要，起码先行动起来。

行动：
7 B. b3 p5 y! N% W, Z先把问题描述清楚，我的目标是开发一个学英语的App，这款App应该功能简单，不能太过复杂。把它分解成两个问题：
- a0 E0 Q6 U7 P8 `, L. _1-怎样开发一个App？
2-应该具备什么功能才能用来学英语？
. p( l1 D- ]+ g
先来思考第一个问题：怎么开发一个App？
: N* C' I/ U6 y. _我把问题进行细分：
1- 什么是App?
2- 需要哪些知识储备？
3- 如何做？需要什么工具？
, a3 N) t* a. U1 V; N9 u4- 有没有简单的方法实现？
经过一番搜索、学习、请教、记录和总结，这些问题渐渐有了答案。
; q. ^4 {( v+ m) w; ^% f  N
. L$ [1 [! H1 e( ^. k# G5 p+ r* p1-what：什么是App？
App是应用application的简称，我这里说的App是指手机端的App。
8 o% l4 U2 _  ~* N根据开发模式，目前的手机App可分为3种类型：原生、H5、Hybrid。它们有各自的优劣势：
% x5 w5 v; n- W/ r" M" p            

类别 " u7 S% j! c: |' w0 K  x	概述	优势	劣势
原生应用 (Native   App)	原生App就是利用Andriod、ios平台官方的开发语言、开发类库、工具进行开发。比如安卓的java语言，ios的Swift语言。在应用性能上和交互体验上应该是最好的.	1-可以访问手机所有功能、可实现功能最齐全； ' S4 [: I  x0 v( X2-运行速度快、性能高，绝佳的用户体验； & C8 p; o# u# ~; }  |( a3-支持大量图形和动画。不卡，反应快； 4-比较快捷的使用设备端提供的接口，处理速度上有优势；	1-开发成本高、周期长，Android和ios都需要单独的开发； 1 s2 ?" q8 i$ I% ~/ |2-更新版本需要重新下载安装包； 3 L7 N3 ^8 r% H' H, s& g
H5应用 (Web App)	用普通web开发语言开发的，通过浏览器运行。 / w0 v) {* `# v& a; A8 [+ n	1-使用web语言，开发门槛低、周期短； 2-支持多种浏览器，兼容性好； ) S# Z2 J! P; T6 m* L3-免安装，使用浏览器打开，更新无需用户参与； : J3 H: K4 a$ H. H7 N1 M2 I	1-对联网要求高，离线不能承载太多东西； 2-功能有限； 3-运行速度慢，页面不能承载太多东西； 2 _9 R3 ?+ N. R$ n. A; T4-图片和动画支持性不高； 5-体验感不如原生和混合App；
混合版应用 (Hybrid % c( w. }* S: `  App) / g) Q5 R2 g$ [9 o- f7 v# [, ~& p! ~	既利用了原生APP开发技术还利用了HTML5开发技术，是原生和HTML5技术的混合应用。混合比例不限。目前市面上流行的小程序和快应用就是采用Hybrid技术。 , `$ d  ~' H4 J	1-运行速度比Web  App快，可调用部分设备端口； 2-开发周期比原生App短； 8 {( M( }  ?% s* E$ p3-可以跨平台，Android和ios不需要单独的开发； 5 b5 H0 O; Y8 Q! m# A# Q% Q4-免安装，打开就能用，更新无需用户参与； 1 _) v/ g# w" b* J/ _	1-功能接口受限于原生App的支持程度； 5 X  \% T) ~& y. l% _- W% O  i2-体验感优于Web App，但差于原生App； 2 d/ ~0 m6 `9 b4 v. Y

/ S: W9 O. J: H& w! @        

2-why：需要哪些知识储备？
App开发的流程大概分为几个阶段：需求分析-->架构设计-->后端开发-->前端开发-->测试。每个阶段都需要相应的知识。

  a* _# H. [' q7 U3 m. g
2 o9 G$ }' q( C* V) S需求分析：
$ Q  ^4 S# P" I( n需求分析也称为软件需求分析，是开发人员经过深入细致的调研和分析，准确理解用户和项目的功能、性能、可靠性等具体要求，将用户非形式的需求表述转化为完整的需求定义，从而确定系统必须做什么的过程。这是软件工程专业的相关知识。

) O# Q2 T( x" q8 b2 w& d9 o

/ }5 X; t: u1 {) a0 f* n1 k架构设计：
需要架构设计是将客户的需求转换为规范的开发计划及文本，并制定这个项目的总体架构，指导整个开发团队完成这个计划。架构设计是软件设计过程的早期阶段，它把需求分析和设计流程连接在一起。需要对开发技术（包括前端和后端）有深入的了解。

8 d9 T- R8 z( j6 w5 q! S

后端开发：
7 [9 n) h1 h! a& D# T3 D后端是指服务器相关的统称，包含服务器、数据库。
服务器搭建与开发，常用语言和工具：Nginx、Java、Shell、Python、PHP、node.js等；
数据库开发，常用知识：关系型数据库mySQL，非关系型数据库MongoDB；
0 {2 G# f. a& \6 `8 o% ~


6 A& V& h, `2 E; z6 G2 e前端开发：
前端是手机端的开发，包括UI界面、响应逻辑、数据的请求。
* P4 L$ ]5 k4 z8 J% \前端三大基础技术：HTML5、CSS、JavaScript；
流行的前端框架：Angular、vue.js、React；
原生App开发语言：Swift(iOS平台)；Java(Android平台)；
9 u6 E2 \" w, p

& b6 P8 [2 `# U: Q$ h  T' e; z

测试：
( H! I) e/ O9 W' z- j( ^) N包括功能测试、性能测试、压力测试等。
/ T' i1 P  Q9 F  l
7 k4 C' a0 L, Q, E( k

) W8 ]& W9 y2 |& Y2 |' k) K) K3-how：怎么做？需要用到什么工具？
看书、看视频教程、看开发文档、模仿实践；
+ C$ g  p' ?2 y" A基本上各种语言都有各自的开发工具(IDE)，学到哪个就用哪个。
  ?) ?$ ?4 F: L1 U/ F
4-how good：有没有简单的方法实现？
随着了解的越深入，越发现这个事情没有想象中那么简单。这是一个系统工程，涉及太多的知识，需要不同岗位的人配合，就好比开发一台设备，需要机械工程师、电气工程师、工艺工程师、采购工程师等一起合作才能完成。
难道一个人就真的不可能完成？我开始动摇，直到后来看到了“全栈开发”这个名词，眼前一亮，信心立马恢复。全栈开发是指一个人搞掂前端和后端。随着技术的发展，市面上有很多现成的框架，借助这些框架来实现一个小项目这个可能还是有的。

' A: T! |" V9 g- H2 u那么接下来就是确定开发的模式：
首先排除开发原生应用，难度实在太大，不符合我的情况。只能在H5和Hybrid之间选择，H5是门槛最低的，但我预计后期会用到手机摄像头和话筒这些硬件，这些是H5的劣势。那么目前看来Hybrid是最合适的选择，而且此时微信小程序开始火起来，各种开发教程和案例都丰富起来。于是，我最终确定做微信小程序。后来，微信小程序推出了云开发，妈呀，我感动得快要哭了，腾讯真的太照顾我了，这样又帮我解决了后端开发的问题。
关于开发的问题，确定开发模式后，剩下的就是恶补微信小程序的相关知识。
& q$ z! s$ _2 [4 ]# L
+ p& B+ i! E* t3 K( U0 j第二个问题是APP应该具备什么功能才能用来学英语？后面继续记录。。。。
* _- G) e  A8 g) h$ b

机械自动化学者

楼主牛批，期待更新

科技的疯狂

等更新

无锡旭峰门业

牛批，点个赞

江苏阿虎wyh

此事意义重大！给楼主点赞！

m2006410

good  用心

嘻哈屠龙

给楼主点赞！

军师大大

想法不错，可以看看比邻国APP，可以学习很多语种

mato

确定开发微信小程序后，那后面所有的工作就以这个展开。

我把这事分成三个步骤：
1-先学习前端三大基础知识：HTML5、CSS、JavaScript，了解vue.js；
2-学习小程序的开发教材及案例：官方的开发文档和教程、优秀大咖的课程；
0 d- W/ V. `1 [/ r5 |) y( m2 v3-以实际需求为驱动，开始写程序，边写边学；
' X- V4 E9 N+ b+ V3 V. H

学习过程中找了很多学习资料，经过学习和筛选，我认为最有用的有以下几个，如果各位社友感兴趣可以去了解：
7 s3 M& @3 L4 o0 X* E; H1-菜鸟教程：
此网站有详细的教程资料，包括前端三大技术、服务器、数据库等，非常详细。

" E8 b: E% G: r4 ^  S
6 e3 X' b' g- z# e) t" p3 O9 o* p2 ]2-官方文档：
小程序的官方开发文档，可以先粗略阅读一遍，在写代码时再查找具体的组件或者API。
2 m3 i* W; I- o  c( y  a% ]# N

3-官方视频教程：
3 c; e1 b% D- }2 f2 u/ }分类三个阶段，包括小程序开发、小程序云开发、小程序项目，可以反复观看。

8 H4 F, W3 Z- J1 h7 t
- ]+ Z' z* z% h0 R' [8 P, o4-CSDN：
; t. U4 O6 ?9 ^. I! o/ K% z& p一个程序员的社区，只要遇到疑问，90%可以在这个地方找到答案。
( R: |, U( c1 V6 R- P

5-B站：
一个包罗万有的社区，有大量的视频教程，包括HTML5、CSS、JavaScript、小程序开发。

备注：由于我没有权限发表包含URL地址的信息，所以无法贴上链接。以上的资料都可以百度找到。如果实在找不到，有兴趣的可以私信我。
) ^5 s& }( A; a, ]6 N! w学习过程中，也走过一些弯路：
1- APICloud，一个低代码开发平台，需要购买他的资源，私房钱不多，放弃；
( ?9 a! N4 M* ^0 C: `: y2- DCloud，一个可以一次开发，多端覆盖的开发框架，就自己一个人使用，就一个平台，不需要多端覆盖，放弃；

mato

机械自动化学者 发表于 2021-1-6 08:05
楼主牛批，期待更新

谢谢！不牛批，本人普通技术一枚，就是兴趣广一点，有一点点动手能力。