:::
顯示具有 程式寫作 標籤的文章。 顯示所有文章

修正NetBeans中SFTP出現的錯誤「Algorithm negotiation fail」:更新com-jcraft-jsch.jar / How to fix NetBenas’s SSH problem “Cannot connect to server … Algorithm negotiation fail”: Update com-jcraft-jsch.jar

修正NetBeans中SFTP出現的錯誤「Algorithm negotiation fail」:更新com-jcraft-jsch.jar / How to fix NetBenas’s SSH problem “Cannot connect to server … Algorithm negotiation fail”: Update com-jcraft-jsch.jar

image

今天使用NetBeans的時候,發現它內建的SFTP上傳檔案功能失效無法運作了。查了一下StackOverflow上的解答,赫然發現是NetBeans使用的JSch函式庫版本過舊,導致無法正常使用。這篇將說明如何更新NetBeans的JSch函式庫,讓NetBeans的SFTP功能能夠正常運作。

(more...)

擷取AJAX動態產生的網頁內容:PhantomJS指令列工具 / Crawling AJAX Webpages with PhantomJS Command Line Utility

擷取AJAX動態產生的網頁內容:PhantomJS指令列工具 / Crawling AJAX Webpages with PhantomJS Command Line Utility

image

現在很多網頁內容都是以動態的方式產生,例如Facebook會在開啟網頁之後再來讀取網頁內容,就連「布丁布丁吃什麼?」也是在網頁開啟之後再來慢慢載入旁邊的小工具。這種使用AJAX技巧來調整畫面的網頁,雖然便於一般使用者用瀏覽器查看,但是卻會造成伺服器端用程式抓取網頁的困難。

還好,現在我們可以用Node.js寫成的虛擬瀏覽器PhantomJS來幫我們載入完整的網頁內容。為此我寫了一些搭配PhantomJS使用的命令列腳本,讓我們可以在Linux 32位元環境下以指令端擷取指定網址,並配合jQuery選取器抽取出需要的網頁元素,最後直接回傳顯示在螢幕上。

(more...)

讓系統整合ORCID註冊、登入與信任託管授權:布丁式ORCID整合方案 / Integrate your system with ORCID’s registration, login and trusted parties: Pudding style solution

讓系統整合ORCID註冊、登入與信任託管授權:布丁式ORCID整合方案 / Integrate your system with ORCID’s registration, login and trusted parties: Pudding style solution

2015-07-25_012234

這篇是給想要整合ORCID的系統採用的方案。除了以ORCID建議的方式來設計OAuth登入功能,我還用bookmarklet來製作信任託管授權功能


功能簡介 / Introduction

現在很多系統都想要整合ORCID,但是大部分系統的整合方式都只是提供一個輸入框,要作者自行註冊再自己複製ORCID編號。可是現在已經是OAuth的時代,我們可以採用ORCID建議的三方登入來建置登入按鈕。

2015-07-25_003703

有注意到上面這張圖裡面顯示的「布丁布丁吃什麼?」要求取得登入訊息的資訊嗎?這個方法很簡單,不必動到任何伺服器端的程式碼,只要用JavaScript在前端執行就能夠搞定。

操作說明 / Usage Instruction

以下介紹如果在尚未登入ORCID,也沒有註冊ORCID的情況下使用此方案的過程。

登入與註冊 / Login or registration

image

這個方案是為了整合既有的系統。系統通常會有Email的輸入框,也會有ORCID ID的輸入框。

image

如果有加入布丁式ORCID整合方案,就會變成上面的樣子。

2015-07-25_003703

按下「建立或連接ORCID ID」會跳出要求ORCID登入畫面。你也可以在該畫面的「Don't have an ORCID iD? Register.」切換成註冊畫面。

2015-07-25_005901 - Copy

登入成功之後,該視窗會關閉,然後原本的視窗中會抓到登入之後的ORCID ID。

授權 / Add trusted party

接下來我們要加入信任託管的授權。

2015-07-25_005901 - Copy (2)

請照著下面的指示,把「授權政大」(這個按鈕的字可以自訂)拖曳到書籤列。

image

書籤多了一個「授權政大」了。

2015-07-25_005901 - Copy (3)

然後按下「開啟設定頁面」按鈕。

2015-07-25_010457

開啟了ORCID的帳號管理頁面。

orcid2

點下書籤列上的「授權政大」按鈕。

orcid3

接下來會跳出一個對話框,因為授權需要密碼,請輸入您ORCID的密碼。

2015-07-25_010704

授權成功,會跳出即將關閉視窗的訊息。

image

這樣就授權完成了。擁有授權的一方就可以用信任託管的方式幫忙建置ORCID的資料,做法請看我之前寫的「以機構身份管理其他研究者的著作:ORCID的信任託管功能」。


功能展示 / Demonstration


安裝教學 / Installation Instruction

接下來我要來說明如何安裝布丁式ORCID整合方案。這是給網頁工程師看得部分,如果你看不懂,那也別在意。

首先,我們會有一個系統表單網頁的網址,此例中的網址為「http://your-server/form.html」(會在後面用到),以及該網頁的原始HTML碼。例如:

<input type="text" name="email" value="" />
<input type="text" name="orcid_id" />

然後我們要底下加入以下程式碼:

<script type="text/javascript" src="https://googledrive.com/host/0B3_qgRmbvvZ1RmhGYmVFeTExblU"></script>
<script type="text/javascript">
ORCID_puli_utils.init({
    inputs: {
        email: "[name='email']",
        orcid_id: "[name='orcid_id']"
    },
    app: {
        client_id: "APP-xxxxxxxxxxxxxxxx",
        client_secret: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
        redirect_uri: "http://your-server/form.html",
    },
    employment: {
        orcid: "0000-0002-5496-8565",
        disambiguated_id: 32787,
        source_id: 34913,
        keyword: "National Chengchi University",
    },
    message: {
        connect_button: "建立或連接ORCID ID",
        bookmarklet: "授權政大",
        bookmarklet_usage: "請拖曳上面授權按鈕到書籤列<br /><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9IFr0Z9Qu-JIR3vi2UFkfW5mZdy9WgzKo1FIl7qU6nuoze36JOmBxutZ0eiOcjnzrSUduGXpWoAXiU5qoJvkDd56Abts2y91UFFcOjw5apmyUy4GwFskZ-LF4LY5oZPgu3npi_Q/' style='border:1px gray solid' />",
        open_account: "開啟設定頁面",
        open_bookmarket: "請點選授權按鈕。<br /><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLbMa53HgWhdm1Lq4mOD-SRzkMmF55D6SwTOiBKR3MPqq2L0pgxK9T6jtuiZgJxwas2tXY3Sj52HIXcxw5qvA5O58JhwBZ2gwzatVJ18iETssbgtYrvty7bZ6GlHAP9jFbS93wJg/' style='border:1px gray solid' />",
        input_password: "請輸入您的密碼 <br /><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtNZ37lCN_qWYT5TUjW8ul6VsiDJx5_cxv4yY7CNOqc_OLboP_TsSNiDgXbNR7EHYnq7QmtLlxOYLpW7no-JNQjfcHyfPz8UBmac1A_MWVFoUK-e511ryaXnd5uP_2lIDy5KtUww/' style='border:1px gray solid' />",
        prompt_hint: "請輸入您的密碼",
        prompt_error: "密碼錯誤,請再次輸入您的密碼",
        alert_success: "授權成功,視窗即將關閉。",
        delegated: "已經授權"
    }
});
</script>

這邊總共有3處參數需要設定,我用顏色標示,各別是綠色的信任託管對象藍色的Public API設定紅色的機構資訊紫色的授權按鈕。這些資料取得的方式不一,以下一一說明:

綠色的信任託管對象設定

2015-07-25_013934

首先,我們先要有一個代表機構的公用ORCID帳號。這個帳號就算不是ORCID的機構會員也無所謂,用一般的方式免費註冊一個ORCID的帳號就可以了。

2015-07-25_014533

註冊之後,你就會獲得一個ORCID ID。我註冊了一個測試用的ORCID帳號,ORCID ID就是「0000-0002-5496-8565」。

藍色的Public API設定

image

接下來我們要設定供網站登入用的Public API。這邊要設定三個參數: 1. client_id、2. client_secret、3. redirect_uri。這三個參數都必須在ORCID網站上的開發者工具裡面設定。

2015-07-25_015048

點下開發者工具頁面中間的「Register for the free ORCID public API」。

image

確認接受條款。

image

然後設定你的網站資訊,包括網站名稱(Name of your application)、網站網址(Your website URL)、網站介紹(Description of your application)、返回網址(Redirect URIs)。比較需要說明的是返回網址,請設定系統表單網頁的網址,此例就是「http://your-server/form.html」。然後按下右下角的磁片按鈕來儲存。

image

儲存之後會回到原本的開發者工具頁面,按下「Show Details」來顯示詳細訊息。

image

這邊可以找到Public API所需要的三項參數。在Redirect URIs裡面找到返回網址redirect_uri參數;在Client ID找到client_id參數,開頭會是「APP-」;在Client secret可以找到client_secret參數。(一般是不能公開這個參數)

這樣子Public API所需要的參數就設定完了。

紅色的機構資訊

image

接下來是機構資訊的設定。這邊有三個參數要設定,以政大為例:

1. disambiguated_id: 32787

2. source_id: 34913

3. keyword: “National Chengchi University”,這一項可以自行設定。

機構的disambiguated_id跟source_id是比較難以取得的參數,以下說明如何使用Google Chrome瀏覽器來取得機構的這兩種參數。

image

首先我們要進入到你自己的ORCID頁面,然後在Employment裡面進入「+ Add employment」裡面的「+ Add manually」。

image

同時開啟Google Chrome的偵錯面板,切換到Network分頁。

image

在Institution/employer中輸入資訊時,就會自動帶出機構的資料。找到我們目標的機構,例如國立政治大學就是「National Chengchi University」。

image

點下「National Chengchi University」的時候,注意Network分頁讀取資料的網址,有個「32787?_=1437762980098」,其中32787就是disambiguated_id

image

新增機構之後,Network分頁中會讀取一個叫做「affiliation.json」的檔案。點進去看該檔案的細節。

image

在Request Payload裡面找到disambiguatedAffiliationSourceId: “34913”,其中34913就是 source_id

雖然過程有點麻煩,但這樣子就設定完機構的參數了。

紫色的授權按鈕

image

最後是「授權政大」的按鈕。這個按鈕可以任意修改文字訊息。事實上,message裡面的資料都可以任意修改,不會影響布丁式ORCID整合方案的運作。但是修改時必須遵照JSON的格式就是了。


結論:暫時的方案 / Conclusion: A Temporary solution

布丁式ORCID整合方案終歸來說只是一種暫時使用的權宜之計,特別適合不想要花錢買一個系統來管理ORCID(因為ORCID網頁本身就很好操作了,實際上不太需要額外買一個系統來管理)、也不想要花錢加入機構會員(因為機構會員的Member API一樣要額外的系統才能運作)的機構。

ORCID是一個稱職的OAuth系統,可說是學術界的Google Account一樣。可是它作為著作目錄權威檔的角色來說,本身有很多問題在,詳細可以看我之前寫的「令人意外!ORCID目前並沒有自動跟資料庫同步」。對於ORCID,除了註冊帳號之外,目前似乎並沒有深入建置資料的必要性就是了。

(more...)

中華電信學院微課程演講:「從網頁開發到Android APP行動應用程式開發」 / Speech at CHT School: “From Web to APP: Developing Android APP”

中華電信學院微課程演講:「從網頁開發到Android APP行動應用程式開發」 / Speech at CHT School: “From Web to APP: Developing Android APP”

image

這個月受邀到中華電信學院演講一門微課程「從網頁開發到Android APP行動應用程式開發」。這是給有HTML5基礎的前端網頁設計師開發Android APP的教學,講述AppsGeyserPhoneGap (Apache Cordova)的開發方法。


課程簡介 / Introduction

本次微課程將介紹如何從前端網頁開發技術進入到行動應用程式(APP)開發的領域,特別適合具備前端網頁開發能力的工程師來聆聽。演講內容將概述各種行動應用程式開發的技術,再聚焦到以網頁技術來開發行動應用程式的兩種方法:AppsGeyser 與 PhoneGap。只要會製作行動版網頁,聽完這個演講,您就能夠製作可以上架的行動應用程式!

大綱 / Outline

  • 前言:我是前端網頁設計師
  • 概論:要如何製作行動應用程式APP?
  • 樣板型APP開發:AppsGeyser教學
  • 網頁型APP開發:PhoneGap簡介
  • 實作:PhoneGap開發

投影片 / Slide

投影片下載:Google DriveOneDriveBox.netSlideShare

備註:由於當天演講時間太短,所以投影片有所刪減,這一份則是完整的版本。


演講的重點 / Points of this speech

這次的演講跟以往大家講述APP開發的內容相比,有幾個比較值得一提的地方。

關於APP開發的分類 / About APP development classification

以往大家對APP開發方法的分類只有三種:「原生型APP」、「網頁型APP」、「混合型APP」。但其實這是從PhoneGap的觀點來看APP開發方式,並不能夠含括所有的APP開發方法。

imageimage

Wikipedia的Mobile Application development給我們一個比較完整的分類:前端型、後端型以及系統型。而前述的三種分類則是隸屬於前端型開發中。而我又進一步將前端型開發方式分類成四種開發方法:

  1. 原生型APP:以該平臺開發方式開發,例如Android用Java搭配Android Studio開發。
  2. 網頁型APP:以製作網頁的思維建立APP,例如PhoneGap
  3. 其他型APP:以獨特的程式語言與IDE來進行開發,強調跨平臺或能夠支援複雜應用的開發方式。我將NativeScript歸類於其他型APP而不是網頁型APP,儘管它使用的是JavaScript,但建制的思維並不是寫網頁,而是一種獨立的開發方式。
  4. 樣板型APP:強調超簡單工具就能製作APP,像是APP Inventor。但是限制也很多。

我試著用這個分類來讓學員瞭解自己適合的開發方式,讓大家知道原來除了原生型開發方法之外,還有很多其他的途徑可以開發APP。

以PhoneGap Build的封裝方式 / Create APP by PhoneGap Build

image

市面上已經有很多書籍在講PhoneGap開發了,那我講這個PhoneGap開發豈不是再次老調重彈?實際上我這次講得內容並不是單純的PhoneGap開發,而是使用Adobe PhoneGap Build來封裝APP。

如果你仔細比較一下PhoneGap的開發方式,會發現他要做的前置作業就跟開發原生型APP一樣複雜。實際上也是如此,因為PhoneGap就是基於原生型APP之上在添加的功能。如果要開發Android的APP,就要先佈置Android的開發環境;如果要開發iOS (iPhone或iPad)的APP,就要先佈置iOS的開發環境。教過MIT APP Inventor之後,我覺得這種要花很多時間才能進行開發的方式並不利於教學。

而這個Adobe PhoneGap Build則是一種雲端服務的開發環境。我們只要把PhoneGap專案準備好、上傳,就能夠封裝成各種平臺的APP。這大幅度地降低了開發環境的配置需求,只要瀏覽器、能夠撰寫HTML的工具(像是ATOM),我們就能夠開始開發了。

然而,PhoneGap專案跟上傳到PhoneGap Build的專案內容其實有很多的差異,但是卻很少人在介紹如何製作PhoneGap Build的專案。尤其是加入簽署檔案(.keystore)讓APP可以上架的這些細節更是很少人提及,這也是我這份演講比較獨特的地方。

行動網頁框架的佈景主題 / Mobile web framework’s theme

image

這篇演講介紹了jQuery MobileDojo MobileSencha Touch這三種行動網頁框架。但我想要強調的是「佈景主題」(theme)的問題,也就是如何能在該平臺上呈現該平臺的使用介面的能力。我讚賞Sencha Touch對於佈景主題的自動偵測與切換,在Android上他是Holo Dark的風格,在iOS上則能夠維持iOS的風格。

這種能夠相應於該系統而自動切換佈景主題的功能,對於使用者體驗(User Experience, UX)來說至關重要。這表示使用者可以在自己的系統上操作熟悉的UI,而不是APP特立獨行的佈景主題。

Dojo Mobile跟Sencha Touch都有不同的主題可以套用。雖然jQuery Mobile也可以找到一些第三方主題使用,但比較麻煩。至於其他的BootstrapSemantic UIIonicAngular Mobile等行動網頁框架就更是如此。

不過實際開發時,應該還要考慮到這些框架跟後端資料庫做交換的方式、是否能夠整合其他JavaScript函式庫、或是語法是否容易理解等問題才是。也許隨著經驗越多,這個看法也會隨之改變吧。


結論:更專業的教學內容 / Conclusion: An advanced speech

在準備這個演講的同時,我也一併在進行MIT APP Inventor的家教。我本來以為這兩件事情可以合併在一起做,但仔細想想之後還是放棄這個念頭。APP Inventor是給不會寫程式的人來學習的,做完的成果難以到實際應用的層次。這次的演講是給擁有網頁基礎的人來聽的,主要要講網頁技術跟APP之間的關聯。所以最後我是分開來做這兩件事情。

image

這個微課程只是一個先導性的簡介,之後會在安排一整天的工作坊,讓學員能夠一步一步地製作行動版網頁、以PhoneGap Build封裝,然後到Google Play上架。

儘管這次的教學跟我的專業有很密切的關係,而學員的程度也都很高,講的內容也可以深入不少。但我自己也擔心起實務經驗上是否有所不足,畢竟我跟專門開發APP的工程師相比,還是有很大的差距(這就是學界與業界的差別啦)。雖然是這樣說,懂得如何做一個非常複雜APP的知識,跟如何讓學員瞭解製作APP的教學方法,這兩件事情仍然是不太一樣。

接下來要努力準備工作坊的內容,加油!

(more...)

以MIT APP Inventor教程式的感想 / Thoughts about teaching APP

以MIT APP Inventor教程式的感想 / Thoughts about teaching APP

圖片1

最近因為因緣際會,我接了一個教國中生寫程式的任務,而我選擇的教學內容是以MIT App Inventor 2來教APP。雖然因為時間的關係,這門家教課程只有上短短三次就結束了。不過這次的教學卻讓我有不少值得反思的地方。


選擇以APP來教學的理由 / Why I select to teach make APP as programing

C++或Java是程式語言課程的基本教學內容,但老實說,我覺得學習程式的過程是乏味的。先別說光是佈置環境、編譯、執行等枯燥的動作會讓人覺得疲憊(實際上現在寫程式也一樣會盡力縮短這種編譯與執行的時間,而想辦法讓整個過程自動化),以傳統語言寫出來的入門內容也只有在命令列中單純的訊息輸入與輸出。相較於命令列,我還是覺得能夠看到具體的介面、能夠互動,才讓人有種「創造」程式的感覺。

minecraft-xboxoneedition

(Minecraft Will Be Used To Teach Kids To Code, http://www.ubergizmo.com/2015/06/minecraft-teach-kids-coding/)

「創造」是寫程式最大也是最終的樂趣。不管是寫一個能夠協助日常事務繁複工作的程式,還是寫一個能夠刺激感官的遊戲,它們都是程式。

而且更重要的是,相較於一般被認為是「創造」的藝術技藝來說,以程式來進行創造的成本極低:我們不用買畫具,不用擔心耗材,只需要一台普通的電腦,就能夠開始寫程式。
(備註:其實寫程式不用買很昂貴的電腦。就算電腦上插了一張萬把塊的顯示卡,對小程式來說也沒有什麼差別,所以買便宜電腦就好,貴的電腦很多時候是玩遊戲要用的而已。)

4659468857_7e06dc4fdb

但是傳統的程式語言課程很難讓人體會到「創造」的實體感,入門課程的內容也很難讓人有實用的感覺。舉例來說,能夠迴圈印出各種形狀的「*」,其實是表示程式邏輯有一定基礎的成果。但對很多學生來說,這很難被視為是平常會有用的技能。這跟目標用程式來解決各種問題的思維其實有很大的偏差。

因此,面對上面交待要教程式的任務,我不是教傳統的C++或Java,也不是教網頁(那也很不錯,可是要做到互動性很難),而是教APP。而且不是按照官方規定的原生型APP,是MIT麻省理工學院為了程式教學開發的MIT APP Inventor 2。

教材的選擇 / Select Teaching Material

學習寫程式或是學習APP,他們都是一種應用型的技能。比起了解程式所有的功能,我認為了解如何「做出目標程式」所需要的功能還來的重要。這不僅是我們教課的時間並不多,也是遵循了我之前的說法,能創造出結果才是最令人興奮的事情。

getImage

因此我在選擇教科書的時候也是用這個想法在挑選。最後選擇的是蔡宜坦老師在2014年撰寫的「超圖解! App Inventor 2手機程式設計教本」。

值得一提的是,隨著MIT APP Inventor 推出中文介面,這本書也有中文版的教學。但是我認為學程式本身也是一種英文學習(甚至可能是程式設計師唯一會的英文),這也當作課堂內容之一來教比較好。

這本書的組成包括了17個章節,除了序言之外,大部分章節都會實際作一個APP出來,這部分的確是我想要的。然而開始教了之後,才發現各章節內容都是先講解功能、再來說明APP的製作,這就跟我想要的有點落差。所以雖然最後我還是拿這本來教,但是教學內容則是再做調整就是。

課程與成果 / Lesson and result

由於教課的時間並不長。原本預定四堂課,因為種種原因最後只剩下三堂課。我原本就不覺得能夠教完所有章節,實際上也沒那個必要,因為我的重點在於教程式的相關概念,像是變數、迴圈、事件,至於GPS、相機等只會用在手機上的功能就不是很重要。

Lesson 1. 貓叫 / Cat meows

第一堂課教的是事件與聲音播放的應用。

image

第一個範例就是貓叫聲啦,點下畫面的貓就會叫一聲「喵」。這個簡單的程式是APP Inventor的範例,在Google Play上也可以下載。

unnamed

基於對停車場的守護神:薑黃喵的敬仰,我也做了另一個薑黃喵的變體版本:換一張薑黃喵的照片上去。

image

之後我們做了小鋼琴的APP,點下指定的琴鍵發出聲音,而琴鍵在點下去時會更換圖片,這也是課本的教學內容。

Lesson 2-1. 溫度轉換 / Temperature Convert

這堂課是要教基本的運算式與邏輯判斷的應用。

image

這是一個攝氏轉華氏的應用,最後我們還加入了Slider (拉條)來輸入攝氏溫度。

Lesson 2-2. 畫圖 / Drawing

這堂課則是教Drawing and Animation中的Canvas應用。

image

可以選擇顏色、擦拭、繪畫的種類、清除版面,並將畫圖存檔後利用Share的功能傳到其他APP上,例如在Facebook上發言。

Lesson 3. 擲骰子 / Dice

這次的課程是教陣列與從陣列中取出隨機變數。

image

我們先做一個陣列,決定晚餐要吃什麼,然後隨機取出結果來抽籤。抽籤時用到了加速感應器(AccelerometerSensor),讓抽籤感覺比較有趣。

image

這個則是用骰子來抽籤,再應用之前教的邏輯判斷數字大小,搭配聲音播放結果。因為是最後一堂課,所以我加入了之前教的功能,可惜實際上沒能教到這裡就下課了。


APP Inventor的優點與侷限 / Advantages and Limitation of APP Inventor

在這幾堂課的教下來,第一個感覺是驚訝於APP Inventor的容易上手。

image

這並不只是在講APP Inventor是用拖拉元件跟拼圖就能組成一個APP的製作方法,而他的環境部屬也一樣地簡單。

要開始使用APP Inventor,我們要做的事情只有:

  1. 開啟Google Chome瀏覽器,用Google帳號登入APP Inventor:http://ai2.appinventor.mit.edu/
  2. 手機上安裝MIT AI2 Compainon:https://play.google.com/store/apps/details?id=edu.mit.appinventor.aicompanion3
  3. 開始製作APP,並用Connect中的AI Companion跟手機上的AI2 Companion配對,就可以看到成果。

照正規製作Android的方法,大概要下載超過2GB的檔案,然後要花上1個小時左右來安裝、設定,非常麻煩。APP Inventor將這些繁雜的環境部屬工作降到最低,實在是令人讚歎。

功能限制 / Limitation of Functions

image

但是APP Inventor的限制也很明顯,就是我們除了APP Inventor提供的功能之外,幾乎很難使用其他的功能。

舉例來說,本來我想要用APP Inventor來開發複雜的網路應用程式。一般而言我們都會需要用關聯式資料庫在背後儲存複雜的資料,但是APP Inventor的網路資料庫TinyWebDB只能做到儲存值、取出值兩種動作,而不能像執行SQL一樣的複雜指令。這就會讓實際應用有很多限制。

11753290_10204702104220221_219577884213920244_n

另一個限制就是APP Inventor的解析度是固定的。就算是在尺寸比較大的平板電腦上,他的解析度也會拉大到跟手機一樣。這就很難做到類似RWD的設計。

雖然APP Inventor很容易上手,但是要拿來開發正式的APP,還是要先三思啊。


結論:教程式果然很難 / Conclusion: It is difficult to teach programming

我在這短短的三次課程中以MIT APP Inventor教了程式的概念。但實際上我覺得成果並不是很理想。這最大的原因在於我仍然沒有把握程式教學的精髓,因此很難有效率地把程式的概念教給學生。

我們在寫程式時,大部分的概念都已經是固定成熟了,就像是騎腳踏車、游泳一樣地自然,通常不會去深入思考自己到底怎麼去理解這件事情的。

image

以「迴圈」為例,for的概念在限定條件下重複固定的步驟,對懂得人來說很簡單,但是對不懂的人來說,這種非線性的敘述是很難理解的事情。我一時間也沒能好好地把這個概念講得很清楚。

儘管很多細節沒能帶好,但是APP Inventor透過簡單的步驟就有成果展現,符合我對程式學習的目標。看到學生玩著自己做的APP,然後再加上我教的功能,讓APP變得更多功能,而從中找到寫程式的樂趣,這就是我覺得寫程式最令人開心的地方。

未來如果又要教寫程式,我想我會繼續使用MIT APP Inventor,然後再把概念的部分講得更清楚吧。

(more...)