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

mato

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

' q9 O' j4 R* Q# r( \背景：
冲突一：想学习，却找不到好工具
今年春节遇上了疫情，我宅在家里，处于“失业”状态，作为有志青年，不想每天刷剧、刷抖音，想着装一下B，提高一下英语水平。

: o/ r% l7 r8 W. z于是，在朋友圈疯狂的广告洗脑下，我下载了几个当时很火的App，很认真地投入学习。
然并卵，使用了一段时间之后，发现效果不太理想：首先，这些App记单词过程太过于复杂，很多都提供了多种助记的方法，除了常规的词根词缀、联想记忆以外，还有图片记忆、电影情节记忆、思维导图记忆等，这样的好处是当时很容易记住单词，坏处就是忘得也很容易，大量的助记材料无形中增加了记忆的工作量，增加了记忆的负担，从而偏离了记单词的初衷；其次，练听力的功能普遍都是提供新概念英语或者VOA、BBC、TED等听力材料，对于基础不好的我，感觉在听天书；
难道就没有一款适合我这种菜鸟的App吗？
一个大胆的想法出现在我脑海里：自己开发一个App。
* V/ U `4 \; b0 r- ]
冲突二：计划自己开发，却不是专业人士
3 {; ^% k) W! r为什么说这个想法大胆呢？因为我虽然是一名搞技术的工程师，但仅限于机械行业的。我所接受的完整编程教育仅是在大学期间的《C语言程序设计》。所以对事情一无所知，严重缺乏相关知识储备，除了大胆，我也不知道怎么来形容这个想法了。
: ]9 e' _; O0 [$ T! ?! x但有句古话叫无知者无畏，而且作为理工男，我始终相信任何问题都有办法解决，只要你能够把问题描述得足够清楚。
- s7 L. s. W% Y; U, A9 \1 d7 n9 S因此这个想法一出现，我立马觉得应该去试试，结果怎样不重要，起码先行动起来。
+ T" J- \7 ?' ?! d: u- h( ?% a
行动：
先把问题描述清楚，我的目标是开发一个学英语的App，这款App应该功能简单，不能太过复杂。把它分解成两个问题：
! d4 X4 c2 @9 i. Z6 f2 v1-怎样开发一个App？
2-应该具备什么功能才能用来学英语？
6 i5 \+ p" B1 n
先来思考第一个问题：怎么开发一个App？
我把问题进行细分：
5 s/ C8 K: m9 L7 L- p+ g, Q1- 什么是App?
0 m8 |- T2 s7 b6 @! V2- 需要哪些知识储备？
) g* f& n% @9 c3- 如何做？需要什么工具？
4- 有没有简单的方法实现？
5 Q" c) D' s' ^% k5 K* ~8 }; |经过一番搜索、学习、请教、记录和总结，这些问题渐渐有了答案。
- R c$ _6 k4 v: ?) k5 v
" R# [0 D! U' { G3 I1-what：什么是App？
) X' j3 ~+ L! `7 vApp是应用application的简称，我这里说的App是指手机端的App。
: n6 W9 q4 M& _( b. _9 I& B根据开发模式，目前的手机App可分为3种类型：原生、H5、Hybrid。它们有各自的优劣势：

类别	概述 # r& o+ S; F) m5 H# G! [- G+ ~# A	优势 + O" `* M" L$ X8 Y" b% [	劣势 6 A! j4 G3 D, |* S
原生应用 (Native App)	原生App就是利用Andriod、ios平台官方的开发语言、开发类库、工具进行开发。比如安卓的java语言，ios的Swift语言。在应用性能上和交互体验上应该是最好的. + q6 h$ U+ U& O# x/ U6 `" l4 f	1-可以访问手机所有功能、可实现功能最齐全； , J6 z4 j: {+ [) s+ ^# E2-运行速度快、性能高，绝佳的用户体验； 3-支持大量图形和动画。不卡，反应快； 4-比较快捷的使用设备端提供的接口，处理速度上有优势； 3 W0 Y7 ?$ L+ m( W j	1-开发成本高、周期长，Android和ios都需要单独的开发； 2-更新版本需要重新下载安装包；
H5应用 (Web App) ( Q" B0 B4 }- b/ i* j7 X4 x	用普通web开发语言开发的，通过浏览器运行。 ; l# k* _5 w+ G% E" r5 j4 r	1-使用web语言，开发门槛低、周期短； 2-支持多种浏览器，兼容性好； 3-免安装，使用浏览器打开，更新无需用户参与； ) t5 C+ _( P+ {! F& ^	1-对联网要求高，离线不能承载太多东西； + r: S9 g. D+ ^: R% v1 J3 A2-功能有限； & V4 f: _/ U0 O! a7 M* E9 E7 R& |7 C3-运行速度慢，页面不能承载太多东西； 8 b+ K1 |# p2 y6 P. W! {4-图片和动画支持性不高； 5-体验感不如原生和混合App； 7 M- |4 Z7 s. w( ]% @
混合版应用 (Hybrid # A; u7 Y7 G2 a# g) b5 [7 f* hApp) 7 O$ d6 u8 q# a z	既利用了原生APP开发技术还利用了HTML5开发技术，是原生和HTML5技术的混合应用。混合比例不限。目前市面上流行的小程序和快应用就是采用Hybrid技术。 3 b- a. S. y: q4 ?0 d# M9 T# ^	1-运行速度比Web App快，可调用部分设备端口； . S& X. z# |, s) R* k% o' j8 ^9 G2-开发周期比原生App短； 3-可以跨平台，Android和ios不需要单独的开发； 4-免安装，打开就能用，更新无需用户参与； " D5 }3 R6 }1 @; w	1-功能接口受限于原生App的支持程度； 1 j# y" F* e$ ^2-体验感优于Web App，但差于原生App；

; \' Y8 r- x$ ~% @4 J- l
2-why：需要哪些知识储备？
App开发的流程大概分为几个阶段：需求分析-->架构设计-->后端开发-->前端开发-->测试。每个阶段都需要相应的知识。

" g( w" j8 S; N" X5 z
+ H- ^* [. [! y需求分析：
) Q+ w8 Z* G$ U2 K$ n需求分析也称为软件需求分析，是开发人员经过深入细致的调研和分析，准确理解用户和项目的功能、性能、可靠性等具体要求，将用户非形式的需求表述转化为完整的需求定义，从而确定系统必须做什么的过程。这是软件工程专业的相关知识。
( U4 g$ Q, u5 `# `5 v* i: F3 m
4 s3 d$ o) s, A5 h

9 v8 v+ p0 `3 C" K" }5 r架构设计：
需要架构设计是将客户的需求转换为规范的开发计划及文本，并制定这个项目的总体架构，指导整个开发团队完成这个计划。架构设计是软件设计过程的早期阶段，它把需求分析和设计流程连接在一起。需要对开发技术（包括前端和后端）有深入的了解。
! a- g" _% i4 c* w; R+ d, x


后端开发：
后端是指服务器相关的统称，包含服务器、数据库。
服务器搭建与开发，常用语言和工具：Nginx、Java、Shell、Python、PHP、node.js等；
/ V+ ~# h$ o& X* d数据库开发，常用知识：关系型数据库mySQL，非关系型数据库MongoDB；
3 n8 {7 _, [/ z2 e" T& x7 \+ Z
( j- E% b0 x& L4 Q

8 I- b# Z1 F: T' r- J6 w8 c- `8 b% ]前端开发：
前端是手机端的开发，包括UI界面、响应逻辑、数据的请求。
4 ]4 |% z- E" a( Y* \2 {前端三大基础技术：HTML5、CSS、JavaScript；
流行的前端框架：Angular、vue.js、React；
原生App开发语言：Swift(iOS平台)；Java(Android平台)；

5 P- z5 L0 d' Z v% B


+ k8 F* W4 S6 g' F! Y% _5 x. S/ U测试：
包括功能测试、性能测试、压力测试等。


0 |% N8 ^. }; O. ^, `9 r
3-how：怎么做？需要用到什么工具？
- i% S6 |4 I4 P1 E' H0 \- p# L6 [看书、看视频教程、看开发文档、模仿实践；
基本上各种语言都有各自的开发工具(IDE)，学到哪个就用哪个。
; E" q3 _# c" m& P
6 y8 v0 n3 V9 S( h Z4-how good：有没有简单的方法实现？
随着了解的越深入，越发现这个事情没有想象中那么简单。这是一个系统工程，涉及太多的知识，需要不同岗位的人配合，就好比开发一台设备，需要机械工程师、电气工程师、工艺工程师、采购工程师等一起合作才能完成。
5 d, _8 \8 E+ l+ T: }/ r" v难道一个人就真的不可能完成？我开始动摇，直到后来看到了“全栈开发”这个名词，眼前一亮，信心立马恢复。全栈开发是指一个人搞掂前端和后端。随着技术的发展，市面上有很多现成的框架，借助这些框架来实现一个小项目这个可能还是有的。
4 p3 S/ e- w. b. b. J
那么接下来就是确定开发的模式：
首先排除开发原生应用，难度实在太大，不符合我的情况。只能在H5和Hybrid之间选择，H5是门槛最低的，但我预计后期会用到手机摄像头和话筒这些硬件，这些是H5的劣势。那么目前看来Hybrid是最合适的选择，而且此时微信小程序开始火起来，各种开发教程和案例都丰富起来。于是，我最终确定做微信小程序。后来，微信小程序推出了云开发，妈呀，我感动得快要哭了，腾讯真的太照顾我了，这样又帮我解决了后端开发的问题。
关于开发的问题，确定开发模式后，剩下的就是恶补微信小程序的相关知识。
) u* B1 q: i" h2 A( H
第二个问题是APP应该具备什么功能才能用来学英语？后面继续记录。。。。
$ m4 [) X6 c- G* Z8 J

机械自动化学者

楼主牛批，期待更新

科技的疯狂

等更新

无锡旭峰门业

牛批，点个赞

江苏阿虎wyh

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

m2006410

good 用心

嘻哈屠龙

给楼主点赞！

军师大大

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

mato

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

我把这事分成三个步骤：
2 Z J. R! @, S1-先学习前端三大基础知识：HTML5、CSS、JavaScript，了解vue.js；
3 H4 f( X, ?: i$ a- _$ t* \! K7 h2-学习小程序的开发教材及案例：官方的开发文档和教程、优秀大咖的课程；
3-以实际需求为驱动，开始写程序，边写边学；
$ y' q" o* M, P+ P/ F

学习过程中找了很多学习资料，经过学习和筛选，我认为最有用的有以下几个，如果各位社友感兴趣可以去了解：
6 D4 B+ d9 ?( I, b7 H, M* O, [1-菜鸟教程：
此网站有详细的教程资料，包括前端三大技术、服务器、数据库等，非常详细。


/ `7 E0 D' o$ ]6 k" P* X. D _/ h2-官方文档：
* {, P( u# v) y! K' v小程序的官方开发文档，可以先粗略阅读一遍，在写代码时再查找具体的组件或者API。


3-官方视频教程：
+ f. ]. q4 \- r4 d3 S$ ?2 G1 D分类三个阶段，包括小程序开发、小程序云开发、小程序项目，可以反复观看。
! c, W* s; w; k3 h

4-CSDN：
# e. c/ O7 q9 \/ @- D一个程序员的必威体育网址，只要遇到疑问，90%可以在这个地方找到答案。


5-B站：
9 G+ e n# `! `! }/ y) s一个包罗万有的必威体育网址，有大量的视频教程，包括HTML5、CSS、JavaScript、小程序开发。
1 U2 f# {+ q% Q3 f! {5 x! \& w
9 ~; y4 g* c: ]+ B2 w& f$ O7 ^备注：由于我没有权限发表包含URL地址的信息，所以无法贴上链接。以上的资料都可以百度找到。如果实在找不到，有兴趣的可以私信我。
学习过程中，也走过一些弯路：
" Q# ^' ^8 L4 \, o/ d$ W3 Q1- APICloud，一个低代码开发平台，需要购买他的资源，私房钱不多，放弃；
2- DCloud，一个可以一次开发，多端覆盖的开发框架，就自己一个人使用，就一个平台，不需要多端覆盖，放弃；
. t* h# r/ ]: w6 k$ x. M, V
: z1 K6 S$ Y& Z" @. E

mato

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

1 U0 b( f# ? g8 A' U0 x0 E谢谢！不牛批，本人普通技术一枚，就是兴趣广一点，有一点点动手能力。