基于Ionic的外語學(xué)習(xí)平臺的設(shè)計與開發(fā)

孫 靜 鄭新超

1.引言

隨著移動互聯(lián)網(wǎng)技術(shù)的蓬勃發(fā)展，移動學(xué)習(xí)已經(jīng)融入了人們的日常生活，成為一種普遍的學(xué)習(xí)方式。移動學(xué)習(xí)以其學(xué)習(xí)便捷性、教學(xué)個性化、交互豐富性、情境相關(guān)性等特點備受學(xué)習(xí)者的青睞[1]。本團隊于2018年6月進行的問卷調(diào)查顯示，在線學(xué)習(xí)資源分布零散，使日語學(xué)習(xí)者和愛好者難以選擇；學(xué)習(xí)軟件、學(xué)習(xí)平臺魚目混雜、針對性不強；移動智能終端復(fù)雜多樣，運行的操作系統(tǒng)各有差異且互不兼容，移動學(xué)習(xí)平臺的開發(fā)難度大、維護成本高。凡此種種問題，使適用于日語學(xué)習(xí)的移動學(xué)習(xí)平臺的開發(fā)和研究勢在必行。因此，本團隊開發(fā)出了一款用于日語學(xué)習(xí)與交流的跨平臺APP，以幫助日語學(xué)習(xí)者和愛好者通過微課視頻、資源共享、互動社區(qū)、線上交流等方式共享優(yōu)質(zhì)資源，實現(xiàn)高效學(xué)習(xí)和交流，從而提升學(xué)習(xí)效率和興趣。

2.APP開發(fā)模式

Native APP位于平臺層上方具有較好的下行訪問能力，可以充分利用設(shè)備的資源，提供良好的交互體驗，還可以支持在線或離線、消息推送等功能，用戶體驗良好[2]。Web APP一般由“HTML5云網(wǎng)站+APP 應(yīng)用客戶端”兩部份構(gòu)成，客戶端只需安裝應(yīng)用的框架部份，應(yīng)用數(shù)據(jù)則是用戶每次打開APP時從云端獲取[3]。Web APP不存在Native APP的固有的缺點，具有開發(fā)難度低、功能豐富、部署應(yīng)用簡易，跨平臺訪問便捷的優(yōu)勢，并且HTML5功能強且全面，為開發(fā)者提供了豐富的移動應(yīng)用開發(fā)標(biāo)準(zhǔn)[4]，但是安全性較低，且用戶體驗與Native APP相比而言較差。而Hybrid APP介于兩者之間，兼具了Native APP良好的用戶體驗和Web APP上午跨平臺性的優(yōu)點。選用Hybrid APP模式進行開發(fā)，它的前端可以借助第三方跨平臺框架使用網(wǎng)頁語言來編寫的，編寫完成之后封裝到APP中，同時又可以充分地利用現(xiàn)代移動智能終端提供的功能，調(diào)用底層API，這些特點使得Hybrid APP具有跨平臺性強、開發(fā)成本較低、靈活性較高等優(yōu)點，本項目就采用Hybrid APP模式進行開發(fā)。

3.跨平臺APP開發(fā)方案

3.1 APP開發(fā)方案

基于上述分析，本文擬采用“Angular＋I(xiàn)onic＋Cordova”組合來進行前端開發(fā),采用“A-pache+PHP+MySQL”來進行后端及數(shù)據(jù)庫開發(fā)。Apache（Apache HTTP Server）是一個免費開源的網(wǎng)頁服務(wù)器，能夠在多種電腦操作系統(tǒng)下運行，安全性較高[5]。Apache作為Web應(yīng)用服務(wù)器解釋后端服務(wù)PHP，PHP則調(diào)用MySQL接口，這三者相結(jié)合進行開發(fā)具有絕佳的優(yōu)勢。

3.2 Ionic框架

Ionic是一款強大的輕量級移動應(yīng)用開發(fā)框架，基于AngularJS框架的，采用JavaScript進行編寫。使用Ionic框架開發(fā)的APP的界面是以HTML5和CSS3開發(fā)為主，開發(fā)者使用Web開發(fā)技術(shù)就可以開發(fā)出媲美原生應(yīng)用的移動應(yīng)用，還可使用Ionic官網(wǎng)上的UI框架和組件。Ionic框架是免費且開源的，開發(fā)者可以將其使用到任何項目中；強大的命令行Ionic CLI工具以及項目模板，使用方便；完美融合了AngularJS，易于開發(fā)和維護；為開發(fā)者提供了豐富的UI組件，具有較高的用戶體驗；專注原生，既可以作為Native APP運行，也可作為Web APP運行，方便靈活；簡單易學(xué)，只需懂得HTML5、CSS3和基本的AngularJS語法就可以利用Ionic進行跨平臺開發(fā)。

在使用Ionic框架進行開發(fā)前，首先要搭建Ionic框架的運行環(huán)境。(安裝Node.js和npm： Node.js中集成了npm，無需再單獨安裝npm（為了便于使用可以安裝cnpm代替npm）(安裝Ionic框架，命令：npm install -g ionic；(安 裝Cordova，命 令 ：npm install -g cordova；(Ionic框架的使用：運行‘ionic start 項目名 參數(shù)’命令創(chuàng)建項目，運行‘ionic serve項目名’命令運行項目，會在跳出的瀏覽器頁面中看到初始化的項目，參數(shù)為空時默認(rèn)使用tabs模板創(chuàng)建頁面。

4.數(shù)據(jù)庫的設(shè)計與實現(xiàn)

4.1 數(shù)據(jù)庫功能分析

數(shù)據(jù)庫的設(shè)計是非常重要的,設(shè)計是否合理規(guī)范將直接影響到整個APP的運行效果。根據(jù)調(diào)查以及對本APP的需求分析可知，數(shù)據(jù)庫的主要使用者為普通用戶和微課教師。普通用戶作為此APP的主要實體，擁有選擇在線課程、在社區(qū)進行發(fā)帖回復(fù)等操作的權(quán)限，發(fā)帖的內(nèi)容可以包含文字、圖片或視頻，完成這些操作可以獲取一定的積分，也可以通過在主頁搜索教師或者課程名的方式加入到課程的學(xué)習(xí)當(dāng)中，完成相應(yīng)的課時的學(xué)習(xí)后也可以獲得相應(yīng)的積分，根據(jù)用戶的累計積分之和劃分用戶的等級。用戶可以上傳相關(guān)證件來獲得成為微課教師的資格，審核通過后，便可成為微課教師。微課教師可以發(fā)布微課視頻與課后作業(yè)等教學(xué)相關(guān)內(nèi)容，查看參加本課程的學(xué)生的基本信息，與學(xué)生進行線上互動。管理員主要負(fù)責(zé)教師的資格的審核。此外，所有用戶發(fā)布的帖子都會被劃分到某一興趣板塊中，用戶也可以選擇只在社區(qū)中看到自己感興趣的興趣板塊。

4.2 數(shù)據(jù)庫的設(shè)計與實現(xiàn)

數(shù)據(jù)庫的設(shè)計主要分為概念結(jié)構(gòu)設(shè)計、邏輯結(jié)構(gòu)設(shè)計和物理設(shè)計三個階段，其中概念結(jié)構(gòu)設(shè)計又可具體分為定義實體、定義聯(lián)系、定義碼、定義屬性和定義其他對象和規(guī)則；而邏輯結(jié)構(gòu)設(shè)計主要是將概念模型轉(zhuǎn)變成一個可用的信息模型，并對性能加以優(yōu)化和改進；物理設(shè)計重點是將邏輯模型添加到物理結(jié)構(gòu)中，并設(shè)計索引[6]。數(shù)據(jù)庫選用MySQL軟件進行開發(fā)。數(shù)據(jù)庫主要包括普通用戶、微課教師和管理員這三個實體和用戶基本信息表、微課教師信息表、課程學(xué)習(xí)者表、課程信息表、主貼表、回復(fù)表、板塊表和主題表這八個表。

5.結(jié)束語

移動學(xué)習(xí)的系列優(yōu)點，使之成為未來教育的發(fā)展趨勢。一款針對日語學(xué)習(xí)的移動平臺的開發(fā)具有突出的理論和實踐意義。由于時間和財力物力所限，本APP系統(tǒng)維護和功能完備是今后努力的方向。