智慧型手機的普遍,帶動學習手機APP程式設計風潮,是目前較紅的電腦學習課程,PC-followme如何在聯成電腦-楠梓分校在短短五堂課內,
教會學員快速上手,學習製作手機APP?

首先,利用Adobe Dreamweaver 軟體,利用mobile模組開發...
製作過程可以用微軟WebMatrix模擬手機介面

P1.png
WebMatrix 3 可以直接整合你的 Windows Azure 帳戶

第一次啟用 WebMatrix 3 時,會詢問你是否要登入 Windows Azure 的帳號以便整合,這不是必要的步驟,如果還沒有 Windows Azure 的帳號,可以按下右下角的 Not now 先略過

P2.png
WebMatrix 3 啟動畫面

而 WebMatrix 3 的啟動畫面有三個功能,分別是:

  • My Sites: 開啟在本機建立的網站專案。
  • New: 透過專案範本、WebApp 套件或是空白專案開始建立網站專案。
  • Open: 透過不同的方式 (My Sites、Windows Azure、資料夾、遠端資料夾或是版本控制服務) 開啟網站專案。

使用 New » Template Gallery 之後,可以看到有多種不同語言的專案可供選擇,Node.js 也可以選擇以 Express 框架為基礎的範本:

P3.png
WebMatrix 3 專案範本,支援多種語言

而若是選擇 New » App Gallery 則可以以知名的 WebApp 開始修改:

P4.png
WebMatrix 3 WebApp 範本,有多種知名套件

準備建立一個新的開發專案後,若有整合 Windows Azure,則會詢問你是否要在 Windows Azure 上建立一個網站服務,並且選擇你的 Windows Azure 訂閱帳戶以及資料中心的位置。當然,這也是非必要的步驟,你可以按下 Skip 跳過。
註: 依照不同的網站範本可能還需下載必要的檔案,如 node.js 的 express 範本就要下載 express 等套件,對話盒會幫助你完成這些準備工作。

P5.png
建立網站專案時,可直接整合 Windows Azure 帳號的建立

依照指示建好網站專案後,就可以開始開發網站了,由於支援了 ASP.NET、PHP 以及 node.js (JavaScript) 的緣故,在編輯器的部份也會有語法提示的功能:(HTML/CSS 當然不用說了)

P6.png
WebMatrix 連 jade 範本引擎的語法都支援喔

當然,WebMatrix 不僅能在本機上開發,也可以直接管理或修改已經部署在其它機器上的網站,只要切換上方的頁籤至 Remote 便有相關的操作按鈕:

P7.png
WebMatrix 3 可以直接遠端管理修改網站

即使是在開發時需要做版本控制,只要切到 Source Control 的頁籤,你可以自由選擇要使用 Git 或是 TFS 來做版本控制喔!

p8.png
WebMatrix 3 支援使用 Git 或 TFS 來做版本控制

以 Git 為例,當選擇使用 Git 做版本控制後,上方的工具列就會切換成相關的操作按鈕,而左側的檔案總管也會有圖案提示檔案是否有修改,真的是相當方便!

p9.png
WebMatrix 3 開啟 git 版本控制後的畫面

網站開發完成後,最重要的就是測試或是發佈到上線環境中,只要直接按下 Run 或是 Publish 按鈕就可以在本機測試或是發佈到上線環境,按下 Publish 後,WebMatrix 會根據你的設定,先檢查一下上線環境的相容性,確定上線環境都有安裝好必須的軟體,以下圖為例,WebMatrix 檢查了是否能在 Windows Azure 上佈署 node.js 的 express 專案:

p10.png
WebMatrix 發佈網站

確定沒有問題之後,就可以繼續完成發佈網站,不用幾分鐘的時間,我就成功將 node.js express 的網站發佈到 Windows Azure 上,立即有一個上線的網站,是不是很簡單呢!

p11.png
成功發佈 node.js express 網站到 Windows Azure

WebMatrix 3 加強了許多網站開發的功能,是一套在 Windows 上功能豐富又完全免費的開發工具,在開發網站的朋友不妨試試看,瞭解 WebMatrix 3 是不是符合你的開發需求呢?現在就免費下載 WebMatrix 3來體驗一下吧!
《以上資料來自於微軟網站》
聯成電腦-楠梓分校學員的證照目標

Adobe WEB系列證照  Photoshop ACA / Illurstrator ACA / Flash ACA /Dreamweaver ACA

WEB.jpgAI-CC.jpg

微軟MOS office 2013

EXCEL 2013.jpg   

 

創作者介紹
創作者 PC-followme的異想世界 的頭像
PCfollowme

PC-followme的異想世界

PCfollowme 發表在 痞客邦 留言(0) 人氣( 22 )