跳到主要內容

臺灣博碩士論文加值系統

(44.192.247.184) 您好!臺灣時間:2023/02/07 13:08
字體大小: 字級放大   字級縮小   預設字形  
回查詢結果 :::

詳目顯示

我願授權國圖
: 
twitterline
研究生:黃怡瑄
研究生(外文):Yi-Hsuan Huang
論文名稱:網頁應用程式自動化系統:運用HTML5以及JavaScript的網頁應用程式於嵌入式裝置
論文名稱(外文):A Web Application Generator for Embedded Devices with HTML5 and JavaScript
指導教授:王勝德王勝德引用關係
指導教授(外文):Sheng-De Wang
口試委員:于天立鄧惟中
口試委員(外文):Tian-Li YuWei-Chung Teng
口試日期:2015-07-23
學位類別:碩士
校院名稱:國立臺灣大學
系所名稱:電機工程學研究所
學門:工程學門
學類:電資工程學類
論文種類:學術論文
論文出版年:2015
畢業學年度:103
語文別:英文
論文頁數:35
中文關鍵詞:程式碼生成網頁應用程式嵌入式裝置
外文關鍵詞:HTML5JavaScriptNode.jscode generation
相關次數:
  • 被引用被引用:4
  • 點閱點閱:537
  • 評分評分:
  • 下載下載:0
  • 收藏至我的研究室書目清單書目收藏:0
隨著各式各樣的電子化裝置日趨普及,如何讓應用程式開發者快速開發程式並移植程式到不同裝置的需求也日益攀升。開發者通常希望程式可以重複使用、更希望提升程式的可用性並且能移植到硬體裝置們上執行,而網頁應用程式是相對較簡單、低成本的程式開發方式。多虧了HTML5以及 JavaScript的發展,強化了網頁應用程式跨平台、硬體支援等特性,藉由網頁應用程式來操控終端硬體裝置不再遙不可及。
本篇論文實作了圖形化網頁應用程式自動化系統,讓開發者可以設計基於Node.js平台的可遠端存取服務網頁應用程式以及單機版應用程式,並融入HTML5以及響應式網頁設計(Responsive Web Design)的特性。本系統應用軟體開發的代碼生成技術,系統會自動生成應用程式原始碼,此程式不只可以佈署在一般電腦,也可以移植到具有Node.js平台的嵌入式系統上運作。


The portability of applications in embedded devices has become complex for application designers because of the diversity of embedded devices. Simplifying programming models becomes an important issue in recent years. Web applications, instead of traditional embedded software, have attracted attentions in embedded systems community because hardware can be controlled more flexibility thanks to new features of HTML5 and JavaScript. In this work, we implement a programming aided system, called WAGED (Web Application Generator for Embedded Devices), which can generate web applications for embedded devices. We combine visual programming concepts, HTML5 features and RWD (Responsive Web Design) and code generation techniques to design the system. The WAGED system uses template-based code generation techniques to generate web applications code (including HTML, CSS and JavaScript). The application can be deployed on embedded devices over the Node.js environment. Using the system, application designers can create web applications that can interact with users and control hardware and focus on their design without spending too much time to consider how to build the web server. The WAGED system provides an interactive graphic user interface (GUI) for the customizing structure of web applications accessing end devices.

中文摘要 i
ABSTRACT ii
CONTENTS iii
LIST OF FIGURES iv
LIST OF TABLES vi
Chapter 1 Introduction 1
Chapter 2 Background 5
2.1 Visual programming 5
2.2 Access hardware by web technology 6
2.3 Template-based code generation 6
Chapter 3 Methodology and Implementation 9
3.1 System overview 9
3.2 From application designers’ view 11
3.2.1 User interface 11
3.3 From system developers’ view 14
3.3.1 Description of user-defined web application 14
3.3.2 Code generation 22
Chapter 4 Result 26
4.1 Client-server user-defined program architecture 26
4.2 Local desktop web application 28
Chapter 5 Conclusions and future work 33
Chapter 6 Reference 34


[1]Myers, Brad A. "Taxonomies of visual programming and program visualization." Journal of Visual Languages & Computing 1.1 (1990): 97-123.
[2]Wolber, David. "App inventor and real-world motivation." Proceedings of the 42nd ACM technical symposium on Computer science education. ACM, 2011.
[3]Fraser, Neil. "Google blockly-a visual programming editor." URL: http://code.google.com/p/blockly, accessed Aug (2012).
[4]I Hickson, Ian, and David Hyatt. "HTML5: A vocabulary and associated APIs for HTML and XHTML." W3C Working Draft edition (2011).
[5]HTML5 [Online]. http://en.wikipedia.org/wiki/HTML5
[6]Embedded HTML5 development [Online]. http://www.bsquare.com/services/application-development/html5-development
[7]Express framework [Online]. http://expressjs.com/
[8]Node-Red [Online]. http://nodered.org/
[9]Wikipedia Flow-Based Programming [Online]. http://en.wikipedia.org/wiki/Flow-based_programming
[10]Morrison, J. Paul. Flow-Based Programming: A new approach to application development. CreateSpace, 2010.
[11]Node.js [Online]. https://nodejs.org/
[12]Wikipedia-Responsive web design [Online]. http://en.wikipedia.org/wiki/Responsive_web_design
[13]Media query [Online]. http://www.w3.org/TR/css3-mediaqueries/
[14]Responsive web design [Online]. http://www.w3schools.com/html/html_responsive.asp
[15]Mohorovicic, S. "Implementing responsive web design for enhanced web presence." Information & Communication Technology Electronics & Microelectronics (MIPRO), 2013 36th International Convention on. IEEE, 2013.
[16]Chared, Zeev, and Shmuel S. Tyszberowicz. "Projective Template-Based Code Generation." CAiSE Forum. 2013.
[17]Henthorne, Cody, and Eli Tilevich. "Code generation on steroids: Enhancing COTS code generators via generative aspects." Incorporating COTS Software into Software Systems: Tools and Techniques, 2007. IWICSS''07. Second International Workshop on. IEEE, 2007.
[18]Weigert, Thomas, et al. "Automated code generation for industrial-strength systems." Computer Software and Applications, 2008. COMPSAC''08. 32nd Annual IEEE International. IEEE, 2008.
[19]Arduino [Online]. http://www.arduino.cc/en/Main/HomePage
[20]Chrome Application [Online]. https://chrome.google.com/webstore/launcher
[21]RecordRTC [Online]. https://github.com/muaz-khan/RecordRTC


QRCODE
 
 
 
 
 
                                                                                                                                                                                                                                                                                                                                                                                                               
第一頁 上一頁 下一頁 最後一頁 top
無相關期刊