跳至主要内容

15 篇文章 含有標籤「CS」

檢視所有標籤

NTU 台大 Web 網頁開發 Vibe Coding 課程學習重點筆記 01-01:Introduction to Web Programming

· 閱讀時間約 5 分鐘
NTU Web Programming Vibe Coding 系列筆記

這是 NTU 台大 Web 網頁開發 Vibe Coding 課程 學習筆記系列:

📚 第一階段:基礎概念

💡 查看完整系列 | 🎓 Vibe Coding 學習資源

在軟體工程與生成式人工智慧高度整合的時代,開發者的職責已從單純的代碼編寫者轉化為系統的協作指揮官。

名言金句

「一個好的主管需要懂得與屬下溝通,而與 AI 協作的關鍵,在於精確定義需求並理解技術背後的邏輯與架構。」

核心論點

這部影片的核心在於展示如何利用現代 AI 工具(如 Cursor)快速構建功能完整的網路服務,並以此作為切入點,探討開發者在 AI 浪潮下應具備的素養。透過實作一個待辦事項(To-do App)的過程,教學重點不再是語法的堆砌,而是如何將心中的產品意象透過精確的指令(Prompt)轉化為可執行的軟體架構。

教學過程強調了「開發環境重現性」的重要性。一個專業的網路服務不應只存在於開發者的本機端,而必須確保團隊成員或助教能在不同的環境下快速安裝並運行。這涉及到環境設定檔(如 .env)的正確處理,不僅是為了安全性以隱藏敏感的金鑰,更是為了確保軟體在不同部署階段的靈活性與穩定性。

最後,影片探討了 AI 工具在教學與實務中的定位。雖然 AI 具備「One-shot」生成代碼的驚人能力,但這並不代表開發者可以忽視基礎。理解 HTML、CSS 與 JavaScript 的運作機制,以及文件物件模型(DOM)如何動態改變網頁內容,才是確保在 AI 產生錯誤或遇到複雜規格時,開發者具備調整與優化系統的核心競爭力。

重點摘要

  1. 環境設定檔與安全性:在構建涉及第三方服務(如 GPT API)的服務時,應使用環境變數管理金鑰,嚴禁將敏感資訊直接寫入代碼或上傳至版本控制系統。
  2. 開發環境重現性:確保服務能讓團隊新成員快速重現與安裝,是衡量軟體工程品質的重要指標,也是課程評核的重點之一。
  3. Cursor 開發工具應用:詳細介紹了 Cursor 的界面功能,包含檔案瀏覽器、代碼編輯區、終端機,以及與 AI 溝通的聊天室。
  4. AI 模型選型與模式:分析了不同 AI 模型(如 Claude, GPT-4)在代碼生成上的表現,並介紹了 Max Mode 如何透過自我測試與思考來解決複雜程式問題。
  5. 指令工程與溝通:強調與 AI 溝通就像主管與屬下的溝通,單純的截圖或簡短指令往往不足以應對精細規格,需學會精確描述產品行為。
  6. 前後端基礎概念:快速概括網頁開發的三大支柱(HTML, CSS, JavaScript)及 DOM 的動態變更原理,作為 AI 輔助開發的知識基礎。
  7. 實戰練習與作業:透過個人網頁的撰寫作為初步練習,引導學生從簡單的靜態頁面過度到具備互動性的網路服務。
  8. 代碼生成的不可預測性:提醒 AI 背後是統計模型,具有隨機性與樂透性質,開發者需具備檢視與修正產出內容的能力。

行動方案

  1. 你應立即在開發環境中建立規範化的目錄架構,並配置一個範例環境檔(如 .env.example),確保所有敏感資訊皆已妥善隔離。
  2. 你需熟練操作 Cursor 的各項進階功能,特別是學習如何在 Auto Mode 與 Max Mode 之間切換,以因應不同難度的開發任務。
  3. 你應針對作業一的個人網頁需求,嘗試撰寫一份詳細的結構化指令,包含視覺設計要求與功能互動邏輯,並觀察 AI 產出的代碼是否符合預期。

問題反思

  1. 如果 AI 已經能完成大部分的底層開發,你認為具備理解代碼邏輯與 DOM 原理的開發者,在除錯階段具備什麼樣的優勢?
  2. 在追求開發速度的同時,你該如何平衡 AI 產出的代碼質量與系統的可維護性?

心得結論

本課程示範了 AI 時代下網頁開發的新常態:效率不再是手寫速度的競爭,而是溝通、架構理解與工具駕馭能力的綜合展現。透過將實務規範(如金鑰安全)與前沿工具(如 Cursor)結合,教學內容不僅傳授了技術,更傳遞了現代軟體工程師應有的職業態度。這是一場關於如何在高效率與扎實基礎之間尋找平衡點的深刻教育,也為後續深入學習網路服務架構奠定了堅實的心理與技術準備。

NTU Web Programming (2025.09) -- 01. Introduction to Web Programming (Part 1)

NTU 台大 Web 網頁開發 Vibe Coding 課程學習重點筆記 00:Course Introduction

· 閱讀時間約 6 分鐘

NTU 台大 Web 網頁開發 Vibe Coding 課程學習重點筆記

NTU Web Programming Vibe Coding 系列筆記

這是 NTU 台大 Web 網頁開發 Vibe Coding 課程 學習筆記系列:

📚 第一階段:基礎概念

💡 查看完整系列 | 🎓 Vibe Coding 學習資源

NTU 台大 Web 網頁開發 Vibe Coding 課程學習重點筆記

當人工智慧已經能在一分鐘內寫完你原本要花一週開發的程式碼,身為軟體工程師的你,下一步該如何定義自己的價值?

名言金句

「從想法到寫程式的這段過程已被 AI 取代,但從需求轉化為演算法的核心思考能力始終是開發者的護城河。」

NTU 台大 Web 網頁開發 Vibe Coding 課程學習重點筆記

核心論點

這門課程的重啟代表了軟體教育在生成式人工智慧浪潮下的範式轉移。過往網頁程式設計強調手把手編寫每一行程式碼,但在現代開發環境中,這樣的學習路徑已無法追上技術更迭的速度。教學的核心已從單純的語法記憶,轉向如何與 AI 協作,並在工具輔助下快速構建穩定且具備規模化的網路服務。

網路服務的開發遠比一般認知的網頁設計更為深奧。它不僅涉及視覺呈現的前端技術,更包含複雜的後端邏輯、資料庫架構以及伺服器端的運作機制。隨著前端技術發展至前所未有的高度,開發者必須建立完整的系統觀,理解軟體工程的生命週期,而不僅僅是處理零散的視覺元件或簡單的互動功能。

在自動化工具普及的時代,偵錯與問題解決的能力成為衡量專業度的關鍵指標。當 AI 產出的代碼出現錯誤或不符合需求時,開發者必須具備深厚的基礎知識來進行系統性的除錯。這意味著學習者需要掌握從邏輯推演、演算法設計到最後實踐的完整流程,確保技術工具是為解決問題服務,而非僅是盲目地複製與貼上代碼。

重點摘要

  1. 教學目標轉型:課程不再強調傳統的逐行手寫程式,而是引導學生進入 AI 協作模式,重點在於掌握 AI coding 的趨勢與精神,以因應未來軟體產業的技術變革。
  2. 開發環境的一致性:強調在類 Unix 系統下進行開發的重要性。要求使用 Windows 系統的學習者必須透過 WSL 建立 Linux 環境,確保開發工具與業界標準接軌,並減少環境配置不當導致的錯誤。
  3. 版本控制與流程規範:強制使用 Git 與 GitHub 進行代碼管理。這不僅是為了繳交作業,更是為了訓練學習者適應現代團隊協作的標準流程,包含建立規範化的目錄架構以利自動化管理。
  4. 課程資源與工具應用:提供學習者專業開發資源補助,鼓勵使用 GitHub Copilot 等先進工具,讓學員將精力集中在更高階的邏輯設計與系統架構思考上。
  5. 自主學習與淘汰機制:建立嚴格的學習評核與停修規範,強調在高強度的技術學習過程中,學習者必須展現出極強的自我管理與吸收能力,並對個人的學習進度負完全責任。
  6. 期末專題的實踐價值:要求學員組成團隊,從無到有構建一個具備實際用途的網路服務,並透過社群平台分享開發歷程,藉此累積實務經驗並建立個人專業品牌。
  7. 程式能力的重新定義:將程式能力拆解為構思、演算法設計、實踐與偵錯四個階段,明確指出前兩者與最後一者是人類開發者在 AI 時代必須守住的專業核心。

行動方案

  1. 你應立即在個人的電腦上建構完整的 Linux 開發環境。若你使用 Windows 作業系統,請務必安裝並熟練操作 WSL,這是確保開發流程符合業界標準的第一步。
  2. 你需建立一套結合 AI 輔助工具的工作流。在面對開發任務時,先嘗試由你定義問題架構與演算法邏輯,再引導 AI 產生基礎代碼,最後由你進行嚴格的測試與除錯。
  3. 你應該積極參與開發者社群與版本控制實踐。透過在 GitHub 上維護專案,並在社群中發表技術心得,將學習過程轉化為可被驗證的數位資產與專業實力。

問題反思

  1. 當 AI 能夠生成大部分的底層代碼時,你該如何調整你的學習權重,以確保自己具備引領 AI 解決複雜問題的系統設計能力?
  2. 在工具門檻大幅降低的背景下,一個優秀的網路服務與一個平庸的作品之間,本質上的差異將會體現在哪些維度?

心得結論

這部影片精準捕捉了當前軟體開發教育的轉折點。在技術紅利逐漸被工具抹平的年代,工程師的價值不再體現於對特定語法的熟稔度,而是體現於對問題本質的洞察與系統性思考的深度。課程透過嚴格的環境規範、工具引進與實戰專題,旨在將學習者從寫碼的勞動力轉化為具備創造力的系統架構者。這不僅是一門網頁設計課的開端,更是一次關於數位時代人才競爭力的深刻反思。

參考文件

NTU Web Programming (2025.09) -- 00. Course Introduction

NTU Web Programming 2025

程式設計共學營學員回饋心得

· 閱讀時間約 2 分鐘

林同學:

"我覺得這個課程非常棒
內容非常豐富
助教也會積極回答問題❤️
非常喜歡這個課程,希望未來可以增加更多的課程😆
唯一的缺點可能是進度有點快了點就有一回課程,到後面幾乎快跟不上了,希望能放慢一點速度~"

洪同學:

學到甚多爬蟲知識可應用於工作上~謝謝

楊同學:

之前因為有轉職的念頭,所以找了很多資源,python部分網路其實也有參考udemy的部分,覺得你們的課程安排難易度蠻不錯的,覺得之後可以朝坊間一些課程設計出一個彈性的roadmap,讓大家知道未來如果想走向前後端,學習的路徑和課程怎麼規劃,再結合專題實例,讓大家可以整理出自己的作品。

李同學:

整個課程下來覺得自己進步非常多! 之前有參加過相關社團,但不像這個課程一樣那麼循序漸進,一步步由淺入深。很喜歡每週發布新作業任務的感覺,很像在闖關玩遊戲,把任務都做完也很有成就感。唯一一個建議是有些小地方(code)可以再寫的清楚一點,這樣比較可以省去額外查資料的時間! 期待你們之後開設其他進階課程!

潘同學:

謝謝這一系列的課程,讓我學習新知的同時又有複習到舊有的,而且還真正實際練習專案,非常感謝

黃同學:

"謝謝這次課程~
難度適中,讓初學的我感覺有具體成長又不被挫敗擊垮
也讓我從比較廣泛的角度了解整個電腦科學與程式概論,感覺有整體的概念,再看到
其他文章和課程也比較知道在藍圖的哪個位置"

林同學:

課程設計有條理,且內容難易適中,讓我在兩個月內就能對Python的基本概念有所理解。

林同學:

課程中學習到很多Python入門的知識,但有些課程中的範例較生硬(ex.質數),對於初學者來說有點難理解,但整體作為入門的學習覺得吸收良多!

汪同學:

課程簡單,適合入門選擇。期待後續進階課程。

李同學:

"""很喜歡你們這系列的課程!
實作導向的課程設計真的可以學得很快
希望之後可以多出一些新的課程!很期待"""

Matplotlib / Pandas 資料分析繪圖顯示中文字體入門教學

· 閱讀時間約 6 分鐘
  1. 前言
  2. 認識圖表專有名詞
  3. 解決中文字體空白方法
  4. 總結

前言

MatplotlibPandas 是兩個在資料科學專案中時常使用的兩個套件。Pandas 主要用於資料輸入輸出及資料分析操作,而 Matplotlib 主要是用來資料視覺化,呈現圖表使用,兩者可以單獨也可以搭配使用。在使用 Matplotlib 繪製圖表的中文使用者最常會遇到的問題就是中文字體在預設的 Matplotlib 顯示不出中文字體。接下來我們就透過範例程式一步步手把手帶領大家如何在 Matplotlib 顯示圖表的中文字體標籤和說明圖示(本文假設讀者對於 Python 程式語法、Pandas 和 Matplotlib 已有基本認識)。

認識圖表專有名詞

Matplotlib 中有一些專有名詞,若能掌握住將對我們接下來學習如何在 Matplotlib 使用中文字體會很有幫助。

(1) Figure: 代表整個面板 (2) Axes: 代表整個圖表 (3) Axis: 代表軸 (4) Legend: 代表圖示說明 (5) Label: 代表軸標頭 (6) Title: 代表圖表標頭

解決中文字體空白方法

解決中文字體空白或是顯示不出來的問題,主要解法有以下兩種:

  1. 在程式中引入支援中文的字體並於需要顯示的地方當作參數使用
  2. 透過本機端電腦參數設定和字體檔案放置到對應資料夾(可以不用每次在程式中指定字體,但第一次設定步驟較為繁瑣)

接下來本文會先透過一個範例優先介紹 在程式中引入支援中文的字體 這種作法。

範例程式

Step 1. 規劃目標並準備資料 目標:我們希望透過長條圖顯示桃園地區結婚對數,了解結婚分布狀況。

資料集使用政府開放資料中 108 年度桃園地區結婚對數資料集,我們下載 .csv 檔案後更改檔案名稱為: marriage.csv。檔案內容如下:

月份區域別,一月,二月,三月,四月,五月,六月,七月,八月,九月,十月,十一月,十二月
桃園區,305,202,240,177,272,221,184,109,222,251,223,268
中壢區,271,198,215,213,222,219,188,94,240,246,215,269
大溪區,54,46,40,37,64,58,38,20,47,74,46,48
楊梅區,103,69,91,71,95,99,81,41,89,115,98,121
蘆竹區,100,72,77,80,92,87,70,38,96,95,103,86
大園區,59,38,40,37,61,53,42,15,49,57,53,50
龜山區,100,64,80,75,86,85,82,46,102,92,80,91
八德區,138,98,114,104,133,122,108,57,108,121,105,130
龍潭區,75,52,67,78,72,49,74,26,76,69,73,83
平鎮區,151,97,110,115,144,132,127,55,115,138,138,150
新屋區,37,15,14,24,21,20,24,7,26,21,23,26
觀音區,45,21,38,31,43,32,29,14,45,31,32,40
復興區,11,4,8,5,6,8,6,5,8,6,7,4

Step 2. 載入資料

import pandas as pd

# 讀入資料集檔案
df = pd.read_csv('married.csv')

接著要取出我們想要顯示圖表的資料:

# loc 取值方式為 [索引, [欄位]],取 月份區域別 出來當作 index
data = df.loc[:, ['月份區域別', '一月']]
print(data)

印出內容:

   月份區域別   一月
0 桃園區 305
1 中壢區 271
2 大溪區 54
3 楊梅區 103
4 蘆竹區 100
5 大園區 59
6 龜山區 100
7 八德區 138
8 龍潭區 75
9 平鎮區 151
10 新屋區 37
11 觀音區 45
12 復興區 11

並設定 dataframe index 為 月份區域別 當作 x 軸,因為原本 預設 index 為 0, 1, 2, ...

# 原本 index 為 0, 1, 2, 3...12,改為 月份區域別,這樣 x 軸標籤就會改為 月份區域別
data = data.set_index('月份區域別')
print(data)

印出內容:

        一月
月份區域別
桃園區 305
中壢區 271
大溪區 54
楊梅區 103
蘆竹區 100
大園區 59
龜山區 100
八德區 138
龍潭區 75
平鎮區 151
新屋區 37
觀音區 45
復興區 11

Step 3. 繪製圖表 接著我們於程式最上方引入 matplotlib 套件並使用別名繪製長條圖:

import matplotlib.pyplot as plt


# kind 定義圖表類型。plot 函式會取 column 值代表 y 軸的值,index 索引代表 x 軸
axes = data.plot(kind='bar')

Step 4. 中文化 若使用自行設定字體若有中文字的地方都要給定字體才不會出現亂碼或空白(ex. title, label, legend 等),這邊我們使用 NotoSansCJK-Black(也可以自行選擇支援中文的字體)可以在 下載連結 下載使用並放入和程式同一個專案工作資料夾下。

# 使用 FontProperties 建立字體屬性物件
myfont = FontProperties(fname=r'./NotoSansCJK-Black.ttc')
# 設定標頭和字體
plt.title('一月份各區域結婚數',fontproperties=myfont)
# 設定 x 軸標頭和字體
plt.xlabel('區域別',fontproperties=myfont)
# 設定 y 軸標頭和字體
plt.ylabel('結婚數', fontproperties=myfont)
# 設定右上角說明圖示字體
plt.legend(prop=myfont)

# 使用 for 迴圈一一取出 x 軸標籤 label 設定字體,若 y 軸有中文字也是類似使用方式 get_yticklabels
for label in axes.get_xticklabels():
label.set_fontproperties(myfont)

其中特別需要注意是 xlabel 需要一一取出設定字體:

# 使用 for 迴圈一一取出 x 軸標籤 label 設定字體,若 y 軸有中文字也是類似使用方式 get_yticklabels
for label in axes.get_xticklabels():
label.set_fontproperties(myfont)

Step 5. 呈現成果

# 顯示圖表
plt.show()

完整程式碼:

import pandas as pd
import matplotlib.pyplot as plt
from matplotlib.font_manager import FontProperties

# 讀入資料集檔案
df = pd.read_csv('married.csv')

# loc 取值方式為 [索引, [欄位]],取 月份區域別 出來當作 index
data = df.loc[:, ['月份區域別', '一月']]
print(data)
# 原本 index 為 0, 1, 2, 3...12,改為 月份區域別,這樣 x 軸標籤就會改為 月份區域別
data = data.set_index('月份區域別')
print(data)
# plot 函式會取 column 值代表 y 軸的值,index 索引代表 x 軸
axes = data.plot(kind='bar')

myfont = FontProperties(fname=r'./NotoSansCJK-Black.ttc')
# 設定標頭和字體
plt.title('一月份各區域結婚數',fontproperties=myfont)
# 設定 x 軸標頭和字體
plt.xlabel('區域別',fontproperties=myfont)
# 設定 y 軸標頭和字體
plt.ylabel('結婚數', fontproperties=myfont)
# 設定右上角說明圖示字體
plt.legend(prop=myfont)

# 使用 for 迴圈一一取出 x 軸標籤 label 設定字體,若 y 軸有中文字也是類似使用方式 get_yticklabels
for label in axes.get_xticklabels():
label.set_fontproperties(myfont)

# 顯示圖表
plt.show()

執行結果:

總結

  1. 前言
  2. 認識圖表專有名詞
  3. 解決中文字體空白方法
  4. 總結

以上透過範例介紹圖表的專有名詞及講解如何設定支援中文字體的物件,並讓 matplotlib 圖表可以顯示中文字體。相信讀者跟著操作可以快速解決 matplotlib 不能顯示中文字體的惱人問題。若有討論或是問題歡迎留言和我們一起交流學習喔!

如何在終端機下使用 conda 指令管理虛擬環境

· 閱讀時間約 2 分鐘

Python 虛擬環境本質上是一個資料夾,讓我們可以根據不同專案去管理所需要的環境,安裝不同版本的套件避免衝突(例如:某專案需要套件的版本不同)。除了在 Anaconda 圖形化介面環境設定虛擬環境外,我們也可以使用 conda 指令管理虛擬環境。

指令操作

首先,打開 Terminal 終端機 / Anaconda Prompt,我們可以使用 conda 進行指令碼的操作,包括原本使用 GUI 圖形化操作的建立虛擬環境資料夾(工作環境)和安裝套件等操作,進而讓我們的專案獨立使用自己的空間(當然也可以不使用,直接共用 base 工作環境,這邊先記住可以因為不同專案開設不同的虛擬環境來隔離不同的套件安裝)。目前暫時不會用到,可以先記得有相關指令可以管理虛擬環境就好。

檢視目前 conda 的版本:

conda --version

查看 conda 指令的說明文件:

conda --help

建立新的工作環境且安裝自行指定的 Python 版本(ENVIRONMENT 為自行命名環境名稱,ex. demo_project):

conda create --name ENVIRONMENT python=3.6

切換至指定虛擬工作環境(ENVIRONMENT 為自行命名環境名稱。ex. demo_project):

conda activate ENVIRONMENT

離開虛擬工作環境回到 base 基礎工作環境:

conda deactivate

移除指定虛擬工作環境:

conda remove --name ENVIRONMENT --all

程式挑戰:全域變數和區域變數可視範圍 Variable Scope

· 閱讀時間約 3 分鐘

給定 C 語言程式如下,其中 s 被宣告為全域變數,給定值為 1。請問最後程式執行後輸出為何?

#include <stdio.h>


int s = 1; // 全域變數

void add(int a) {
int s = 6;
for (; a >= 0; a = a - 1) {
printf("%d, ", s);
s++;
printf("%d, ", s);
}
}

int main() {
printf("%d, ", s);
add(s);
printf("%d, ", s);
s = 9;
printf("%d", s);
return 0;
}

(A) 1, 6, 7, 7, 8, 8, 9 (B) 1, 6, 7, 7, 8, 1, 9 (C) 1, 6, 7, 8, 9, 9, 9 (D) 1, 6, 7, 7, 8, 9, 9

參考解答

答案為 (B) 1, 6, 7, 7, 8, 1, 9

本程式挑戰主要在測試同學對於「全域變數」(Global variable)、「區域變數」(Local variable)的生命週期和變數可視範圍(Scope)的理解。若是函數內沒有宣告變數卻使用該變數,則會往外看是否有同名變數,若有則使用該變數。在主程式外的宣告的變數為全域變數,程式內的跨函式都可以存取、修改該變數,若是在函式內宣告的變數或參數變數則為區域變數,區域變數存取修改權僅限於該函式內,函式結束即消失。

#include <stdio.h>

// 全域變數
int s = 1;

void add(int a) {
// 區域變數 s
int s = 6;
// 區域變數 a,值為 1
for (; a >= 0; a = a - 1) {
// 迴圈兩次,第一次印出 6,第二次印出 7
printf("%d, ", s);
// s = s + 1
s++;
// 迴圈兩次,第一次印出 7,第二次印出 8
printf("%d, ", s);
}
}

int main() {
// s 在主程式中找不到,所以為全域變數 s,值為 1
printf("%d, ", s);
// 複製傳入參數值為 1
add(s);
// 全域變數 s,值為 1
printf("%d, ", s);
// 更改全域變數 s,值為 9
s = 9;
printf("%d", s);
return 0;
}

我們可以透過觀察程式執行的過程來判斷(在 C 語言我們以主程式 main() 為執行區塊,由上往下執行):例如在 main() 函式內部 s = 9; 這行之前的 s 使用的是全域變數 1。因此傳入 add() 函式的 a 參數為 1。因此 for 迴圈會進行兩次後結束,印出 6, 7, 7, 8add 函式內的 s 為自己內部宣告的區域變數非外部的全域變數 1,所以不影響到全域變數 s

最後main() 函式內部使用到的 s 全域變數(前面沒有設定變數型別),被改成 9

s = 9

所以結果為:1, 6, 7, 7, 8, 1, 9

另外還有區塊變數(Block variable)是指宣告在某個陳述句區塊之中的變數,例如 while 迴圈或是 for 迴圈區塊內使用,區塊結束即消逝。

#include <stdio.h>

int main() {
int i = 101;

for (int i = 0; i < 10; i++) {
// 不受外面的 i 影響
printf("%d", i);
}
// 印出的是 101
printf("%d", i);
}

其結果為:0123456789101

參考文件

  1. Wiki C 語言
  2. csie ntnu

看懂 IT 術語:AI 人工智慧

· 閱讀時間約 2 分鐘

人工智慧(Artificial Intelligence)是一門綜合性學科(包含電腦科學、醫學、機器人學、腦神經科學、數學、統計學、經濟學、哲學等),主要研究方向為研究發展和人類類似或是超越人類智慧及能力的電腦系統。機器學習(Machine Learning)深度學習(Deep Learning)是目前人工智慧主要的實踐技術及研究。而巨量和多元的大數據(Big Data)資料則提供人工智慧很好的研究素材和原料,成本持續下降的運算硬體資源則提供人工智慧領域很好的背景支持(例如:雲端運算、GPU、TPU 等)。

若以製作料理的角度來看,大數據(Big Data)就是食材、機器學習(Machine Learning)就是烹飪方式,讓人大快朵頤的美味料理就是人工智慧(Artificial Intelligence)

圖片來源

人工智慧就是讓電腦系統能像人類一樣學習和思考,但是目前對於「智慧」難以有確切的定義,於是將人工智慧區分為「強人工智慧」(Strong AI)和「弱人工智慧」(Weak AI) 兩種不同的主張。「弱人工智慧」只能模擬人類的思維與行為表現,但缺乏真正的推理與解決問題的能力,也不具備有自主意識,並不具備人類的思考能力。目前市面上多數「人工智慧」產品或技術主要都是「弱人工智慧」。舉例來說,目前人工智慧在特定領域已經和人類相當甚至超越人類(例如:語音、影像辨識服務、遊戲競賽、棋藝對奕人工智慧等),這些就屬於弱人工智慧。

參考文件

  1. Wiki 人工智慧
  2. Wiki 機器學習

跨領域自學程式設計常見問題解析 FAQ

· 閱讀時間約 10 分鐘

隨著資訊科技的發展以及 108 年課綱列入程式設計和資訊科技能力素養相關科目,讓許多家長和學生,甚至是職場上班族開始思索是否要開始進修學習資訊技能以及自學程式設計,以免自己或小孩輸在人生的競技場中。過去一段時間我們 HappyCoder 自學程式設計學院社群輔導超過 3000 位學員跨領域學習程式設計,有許多學員和社群朋友提出許多關於跨領域自學程式設計的相關疑問。為了能讓更多的人可以對於跨領域自學程式設計有更清楚的認識,我們整理了以下常見自學程式設計相關的問題,希望能解決許多朋友心中的疑惑,也歡迎大家一起加入我們,一起交流討論,分享你的自學程式設計經驗。

關於跨領域自學程式設計你想知道的都在這裡了

問題一:自學程式設計是在學什麼?

在學習一項新的技能或是才藝時若能明確自己的目標和動機可以讓學習的路上更為順遂。所以事先釐清自己的動機、目的和需求才開始選擇合適的程式語言和工具以及合適的學習資源才是跨領域自學程式設計的第 0 步開始。一般而言跨領域非資工資管等資訊相關科系的學生自學程式主要有分三種方向和動機:

1. 希望轉換跑到轉職成為程式設計師和軟體工程師

事實上,程式設計師或是軟體工程師若是對於撰寫程式和解決問題很有熱忱的話,是一個十分令人羨慕的職業:因為可以將興趣和職業相結合,這是許多工作比較難有辦法達到的部分。

若是以希望轉換跑到轉職成為程式設計師和軟體工程師為目標的話,著重的主要就是求職相關技能的養成,包含對應職業的職能培養、履歷撰寫、面試技巧和軟體工程師素養的養成等。例如:Web 前端軟體工程師、Web 後端軟體工程師、Mobile 行動應用工程師、IC 設計演算法工程師、IoT 軟硬整合工程師/嵌入式系統開發、Blockchain 開發者、DevOps 開發運維以及資料科學家、資料工程師、資料分析師等分別有不同和共同的工作職能需要養成。但需要注意的是 IT 資訊科技產業技術和新知變化快速,要有願意持續刻意練習和克服困難的毅力、自學能力和熱情才能走的長久。

至於如何準備轉職面試、如何度過新手期,如何規劃軟體工程師的職涯發展,資淺工程師如何邁向資深工程師,這部份議題太大太廣,需要之後另外開主題來討論。

2. 磨練運算思維(Computational Thinking)、解決問題的能力及跨領域自學能力

這部份是我們 HappyCoder 自學程式設計學院致力於推廣的自學程式設計精神。學習程式設計並不是希望每個人都成為程式設計師或軟體工程師,因為沒有必要,也不可能。由於撰寫程式最重要的其實是需求分析和系統設計的部分,在這個階段透過問題的拆解、模式識別和歸納、抽象化以及問題的分析與演算法設計等都是很好用來培養解決問題、搜尋資料和團隊溝通協調合作的機會。換言之:學習程式設計並不等於學習運算思維,只是透過正確的方式學習程式設計是學習運算思維和解決問題的能力相對快且有效的方式之一

那學習運算思維和解決問題有什麼好處呢?事實上,生活中無處不需要運算思維(Computational Thinking)和解決問題的能力。舉凡規劃旅行計畫、分析投資策略、通勤路線規劃、購物選擇、工作商業邏輯分析等。而培養跨領域自學能力則是在各行各業面對自動化 AI 人工智慧等科技發展很重要的競爭力。

學習程式設計並不是希望每個人都成為程式設計師或軟體工程師,因為沒有必要,也不可能。而是在學習程式設計的過程中,磨練運算思維(Computational Thinking)、解決問題的能力及跨領域自學能力,成為更好的自己

3. 學習基礎程式設計用於解決自己專業領域或生活上重複繁瑣的工作

這時候主要是根據想解決的問題去學習和選擇適合的程式語言工具,用來解決生活上的問題。例如:學習 Python 網路爬蟲自動化爬取資料、學習使用 Pyhon 操作 Excel 減少重複性工作、製作小遊戲自娛娛人、開發聊天機器人自動回覆訊息提升工作效率等。

問題二:自學程式設計英文要不要很好?

初期不一定需要,但若具備良好的英文閱讀和理解能力,將讓自己在學習進階內容時可以更快理解內容。這個原因在於目前程式語言主流資訊和學習資源以英文為主,若是具備好的英文能力將有助於學習相關知識,尤其若是學習目標為轉職程式設計師和軟體工程師的話,這部份尤為重要。未來若是希望往資深工程師或是更高深的領域鑽研的話,英文閱讀和理解以及能夠在工作場合、論壇或是演講以英文書寫、口語表達自己的能力就非常重要。

問題三:自學程式設計數學要不要很好?

看目標需求而定。若是志在轉職程式設計師和軟體工程師的話,大部分情況下數學能力只要高中程度即可(前提是高中有好好學習)。若是希望轉職資料科學家或是機器學習專家等對於統計學、離散數學和線性代數等數學能力有更高的要求。所以簡而言之,大部分的情況下軟體工程師更重要的是理解能力、自學能力和邏輯和抽象化歸納能力,在特定領域或是研究機構數學能力相對要求比較高。

問題四:自學程式設計要學什麼程式語言?

端看你的需求決定需要學習哪一種程式語言。若是希望轉職軟體工程師或是程式設計師,可以先從 Web 開發入門,相對而需求量較多也比較容易讓跨領域自學的人進入。對於 Web 開發、前端基本需要學習 HTML/CSS 語法以及 JavaScript 程式語言(也可以使用 NodeJS 用於後端開發)。若是 Web 後端則可以選擇 Python、Ruby、PHP、Java 等。行動應用則是選擇 Android(Java/Kotlin)或是 iOS(Swift/Objetive-C)。若是有志於資料科學相關職涯發展的話 Python 是推薦入門的程式語言。若是對於嵌入式系統應用有興趣,C/C++ 就是首選程式語言。

若是你希望磨練運算思維(Computational Thinking)和解決問題的能力、學習基礎程式設計用於解決自己領域或生活上重複繁瑣的工作,選擇 Python 程式語言是很好的入門方式。

問題五:超過 30 歲自學程式設計轉職軟體工程師合適嗎?薪水待遇好嗎?

因人而異。不可諱言越年輕轉職成本越低,因為家累負擔小,機會成本低。隨著市場上軟體工程師的缺口增加,當然也有不乏更年長的朋友轉職成功,但年紀越大需要的是完善的規劃、毅力和執行力。一般會建議若是非本科生跨領域自學程式設計轉職軟體工程師或程式設計師可以和本身領域有相關,這樣一來你過去的經驗就是加分,尤其現在跨領域人才越來越被重視。舉例而言:若是你過去的背景在金融銀行相關,在現在純網銀和金融科技快速發展的情況,若能把握相關機會則是相對單一背景的競爭者更好的優勢。

至於待遇則是因人、產業、地點而異。程式設計師和軟體工程師是一個特別的職業,一個頂尖軟體工程師的生產力和一個平庸的軟體工程師可能會差異到 10 倍甚至更多,當然依照生產力的不同也會有不同的待遇(當然有時還是要看機運和個人品牌及人際網路的經營)。此外選擇在矽谷灣區等網路軟體產業蓬勃發展的地方,軟體工程師薪資待遇當然會比在其他地方好上許多。另外,以網路軟體研發工程師為主的公司,也會比工程師只是配角的公司好。

若是有志於從事軟體工程師的職業,就要有不斷學習新知的認知和熱情,才能在不斷更迭變化的技術圈中持續進步。

問題六:自學程式看書?還是上課好?還是考一個資工資管相關碩士?

因人而異。若是想先嘗試是否合適可以先選擇看書自學,接著可以參與一些線上或線下課程,但最重要的還是能參與一個有好的同儕可以彼此激勵分享經驗的學習環境和社群。當然,若能有導師協助帶領則可以讓自己少走許多冤枉路。

對於一些新創公司或小公司來說學歷可能不是很重要(但還是要看職位,若是資料科學家相關職位對於是否有相關學術經驗可能就蠻重要的),能夠馬上實戰的即戰力是最重要的。但對於一些規模較大的公司,不管是升遷或是入職時對於學歷要求還是比較看中(事實上,學歷的重點在於打入另外一個人際網路連結)。另外,若是希望在美國等海外工作,最大的問題其實是簽證問題。所以許多海外求職朋友會在海外再額外拿一個碩士學位,獲得相關簽證爭取留在當地工作的機會。

當然若是希望成為資深軟體工程師,不斷鑽研學習和補足電腦科學基礎理論是很重要的一環,此外,向上管理、溝通協調、領導統御、系統分析設計等能力更是重要的軟實力。

問題七:小孩想要學習程式,家長該如何協助?

先釐清為何要學習程式,並不用刻意的強求小朋友一定要學習程式語言,小孩重要的是陪伴和鼓勵以及探索自己的興趣。若是比較小的朋友會建議以磨練運算思維(Computational Thinking)、解決問題的能力及跨領域自學能力為主。若是國中小的學生可以先從不插電書籍或是桌遊學習程式設計邏輯思考和電腦科學概念,接下來可以透過 ScratchMicrobit 等簡易拖拉式程式語言工具著手,更進一步則可以導入 Python 進行簡單小遊戲或應用程式開發,培養興趣和成就感。

總結

  1. 問題一:自學程式設計是在學什麼?
  2. 問題二:自學程式設計英文要不要很好?
  3. 問題三:自學程式設計數學要不要很好?
  4. 問題四:自學程式設計要學什麼程式語言?
  5. 問題五:自學程式看書?還是上課好?還是考一個資工資管相關碩士?
  6. 問題六:超過 30 歲自學程式設計轉職軟體工程師合適嗎?薪水待遇好嗎?
  7. 問題七:小孩想要學習程式,家長該如何協助?

以上整理跨領域自學程式設計常見問題解析,在開始你的自學程式設計還是要先確認自己的目標和動機,才能走好接下來的每一步。

若是讀者們對於自學程式設計相關問題還有疑問的話,歡迎在下方留言,我們會陸續更新整理。若是覺得我們的文章寫的不錯,也歡迎給我們按讚分享鼓勵:)

歡迎在網路社群上訂閱追蹤我們,免費獲得自學程式設計教學、學習資源和課程資訊!

參考文件

  1. 自學程式設計學習資源懶人包
  2. 用 Python 自學程式設計:程式設計思維入門
  3. 想要自學程式?七個自學程式設計正確的觀念和心態

(Photo by Dlanor S on Unsplash)

新手村系列:Markdown 和 HTML 基礎語法教學

· 閱讀時間約 6 分鐘

Markdown 是一種輕量級的標記語言,最初為 John Gruber 所設計。Markdown 特色在於允許人們「使用易讀易寫的純文字格式編寫文件,然後轉換成有效的 HTML 文件」。簡而言之,Markdown 就是一種簡潔易懂的語法,讓我們可以專注在內容上,不用花時間思考外觀樣式,在透過轉換變成可以呈現在網頁上的 HTML 語法。目前在許多知名技術/開發者論壇或是開發者工具(例如:Github)、技術部落格工具都有支援 Markdown 語法。

什麼是 HTML?

在開始學習 Markdown 之前我們先來認識一下 HTML,畢竟 Markdown 最終還是要轉換成 HTML 這個網頁上內容結構的標準語法。HTML 中文稱作超文本標記語言(英文全名為 HyperText Markup Language,簡稱 HTML),是一種用於建立網頁的標準標記語言。

這樣講起來有點抽象,事實上我們每天在觀看瀏覽的網頁就是由一個個 HTML 所組成。所以我們可以透過瀏覽器的檢視原始碼功能去一窺目前網頁的 HTML 樣貌。

這邊我們使用 Google Chrome 瀏覽器當作範例,可以在畫面中點選右鍵 > 檢視原始碼(View Page Source):

就可以看到該網頁的 HTML 內容:

網頁來源:Wikipedia HTML 頁面

由於這個網頁已經有點複雜,因為它已經包含了 CSS 外觀樣式語法和 JavaScript 互動邏輯程式的部分,對於初學者來說比較難一眼理解。所以我們用一下範例來介紹 HTML 最基礎的部分:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<h1>我是標題</h1>
<p>我是段落</p>
<a href="https://zh.wikipedia.org/zh-tw/Markdown">我是超連結</a>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/84/HTML.svg/200px-HTML.svg.png" alt="">
</body>
</html>

若是使用瀏覽器打開這個 HTML 網頁會呈現:

HTML 標籤語法每個標籤皆有其意義且大部分成對出現,標籤元素內可以設定屬性值。網頁元素主要放置於 <body></body> 中,<head></head> 內主要放置 meta data 設定檔案和放置引入的外觀樣式檔案、程式邏輯等。元素內可以透過設定屬性值(attribute)來宣告元素功能,以下 href="https://zh.wikipedia.org/zh-tw/Markdown" 代表點擊該連結會到該 wikipedia 網址。

<!-- href 是屬性,決定連結點擊後目的地 -->
<a href="https://zh.wikipedia.org/zh-tw/Markdown">我是超連結</a>

<!-- src 是屬性,決定載入圖片位置-->
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/84/HTML.svg/200px-HTML.svg.png">

元素包裹內容在內,代表標題元素:

<h1>我是標題</h1>

Markdown 常見語法教學

一般 Markdwon 段落以空白行分隔。若是序列則內容需要內縮(一個 tab)。

標題

是一级標題
=======

# 一級標題
## 二级標題

其 HTML 元素為:

<h1>是一级標題</h1>
<h1>一級標題</h1>
<h2>二级標題</h2>

效果如下:

是一级標題

一級標題

二级標題

文字

_斜體_
**粗體**
`等寬字型Monospace`

其 HTML 元素為:

<em>斜體</em>
<strong>粗體</strong>
<code>等寬字型Monospace</code>

效果如下:

斜體 粗體 等寬字型Monospace

多行程式碼

其 HTML 元素為:

<pre>
<code>
<span>print('hello world')</span>
</code>
</pre>

效果如下:

print('hello world code :)')

水平線

---

其 HTML 元素為:

<hr>

效果如下:


無序列表

* 張三
* 李四
* 王二

其 HTML 元素為:

<ul>
<li>張三</li>
<li>李四</li>
<li>王二</li>
</ul>

效果如下:

  • 張三
  • 李四
  • 王二

有序列表

1. 不論
2. 三七
3. 二十一

有序列表,其 HTML 元素為:

<ol>
<li>不論</li>
<li>三七</li>
<li>二十一</li>
</ol>

效果如下:

  1. 不論
  2. 三七
  3. 二十一

巢狀有序列表

1. 不論
- 第一
- 第二
- 第三
2. 三七
1. 第一
2. 第二
3. 第三
3. 二十一

有序列表,其 HTML 元素為:

<ol>
<li>不論
<ul>
<li>第一</li>
<li>第二</li>
<li>第三</li>
</ul>
</li>
<li>三七
<ol>
<li>第一</li>
<li>第二</li>
<li>第三</li>
</ol>
</li>
<li>二十一</li>
</ol>

效果如下:

  1. 不論
    • 第一
    • 第二
    • 第三
  2. 三七
    1. 第一
    2. 第二
    3. 第三
  3. 二十一

超連結

[連結文字](連結網址)

其 HTML 元素為:

<a href="https://upload.wikimedia.org/wikipedia/commons/thumb/8/84/HTML.svg/200px-HTML.svg.png">連結文字</a>

效果如下:

連結文字

圖片

![文字屬性](Icon-pictures.png "文字標題")

其 HTML 元素為(少數沒有成對出現的元素標籤):

<img src="連結網址" alt="文字屬性" title="文字標題" />

效果如下:

圖片文字

注釋引用

> Markdown使用電郵用字元「>」來引用。

其 HTML 元素為:

<a href="連結網址">連結文字</a>

效果如下:

Markdown 使用電郵用字元「>」來引用。

表格

| Column 1 | Column 2 | Column 3 |
| -------- | -------- | -------- |
| Text | Text | Text |

其 HTML 元素為:

<table>
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
</tr>
</thead>
<tbody>
<tr>
<td>Text</td>
<td>Text</td>
<td>Text</td>
</tr>
</tbody>
</table>

效果如下:

Column 1Column 2Column 3
TextTextText

總結

以上簡單介紹了:

  1. 什麼是 HTML?
  2. Markdown 常見語法教學

以上介紹了 HTML 和 Markdown 基礎語法的教學,透過 Markdown 這一種簡潔易懂的語法,我們可以更專注在內容創作上。對於一個自學程式設計新手而言,培養撰寫文章的習慣(例如:建立自己的技術部落格)是很重要的環節,不但可以累計自己經歷也可以強化記憶並幫助到需要的人。若是需要完整語法介紹可以參考markdown.tw,當然,只要多加練習就可以慢慢掌握 Markdown 語法的訣竅,進而喜歡這種簡潔的書寫方式。

參考文件

  1. Github Basic writing and formatting syntax
  2. markdown.tw
  3. markdown wiki

想要自學程式?七個自學程式設計正確的觀念和心態

· 閱讀時間約 12 分鐘

想要自學程式?七個自學程式設計正確的觀念和心態

「軟體正在吃掉全世界。」(Software is eating the world.)

這是知名創投也是 Netscape 瀏覽器共同創辦人 Marc Andreessen 的名言。

隨著科技的快速發展,我們生活中已經離不開網路、手機等科技電子產品,而這些科技電子產品,背後往往有電腦軟體程式在運作(想想你每天使用的 Google、Facebook、LINE、Youtube 等應用程式)。也因為全世界的學校陸續開始將程式設計課程列入課綱之中,從一般白領上班族到有小孩的家長,不論是否是資訊相關科系畢業都開始學習程式語言和程式設計相關知識。深怕沒有擁有這項程式語言第二專長會被小孩所嫌棄或是錯過加薪升職的大好機會。

然而隨著網路、軟體技術的日新月異,初學者往往會迷失在豐富的學習資源和除錯 debug 的挫折當中,喪失了程式設計本身創作的樂趣。所以這邊我們要分享自學程式設計必備觀念和心態,希望讓所有有自學程式設計需求的朋友,不再徬徨、無助。

為什麼要學習程式設計?

我們為什麼要學習程式設計?相信這是許多家長和初學者內心的疑問。

事實上,程式設計是一種介於藝術與科學的腦力創作運動。學習程式設計正確心態是透過學習程式設計理解電腦科學運作的原理和動手用科技技術解決生活上的問題。

在學習程式設計過程中可以培養創造能力(對,你只要有一台電腦和網路就有機會創造出幾千幾萬人使用的軟體或網路服務),邏輯思考團隊合作自學能力解決問題的能力

撰寫程式可以讓你可以學習怎麼樣把一個複雜的問題切分成一個個小問題,在這個過程中不但可以訓練邏輯思考、解決問題的能力。隨著專案越來越大、技術越來越複雜,你可能會需要和其他專案成員合作去解決和學習你不懂的新技術,是一個很好培養自學能力和團隊合作能力的機會。當然在過程中可能會因為長期關注電腦螢幕而需要適時的休息和運動(但現代人即便不寫程式也是每天盯著螢幕了:P),這也是為什麼幼稚園和國中小的學童們會建議先從不插電學習程式設計的教材和桌遊開始學習程式設計和電腦科學的邏輯觀念。

確認目標和動機

最好學習程式設計的動機是因為想解透過科技解決生活上的問題(例如:想要寫一個記帳 App 給家人使用所以開始學習 Mobile App 開發,你可能需要學習 Android Java/Kotlin 或 iOS Swift/Objective-C)或是結合你現有的領域和電腦科學的應用。

若是你是因為想要轉職成為工程師/程式設計師,這又是另外一個話題。若是這樣,你可以針對你想要學習的領域列出需要學習知識去一一攻克(直接上求職網站把心儀的工作要求做成一個 checklist 清單)。例如:我希望轉職 Web 前端工程師,我需要具備基本的 HTML/CSS 語法和 JavaScript 程式語言的基礎或是我想轉職資料科學家,我需要具備 Python 或是 R 語言的基礎和理解機器學習和深度學習演算法等。

當具備正確的學習程式設計心態後,以終為始是學習程式設計最重要的一個環節,這是當你夜深人靜 debug 不出來時給自己最好的支持動力。事實上,程式語言只是一個創作的工具,你可以想像成設計師素描本和素描筆,雕刻大師的雕刻刀。幸運的是,程式設計只要一台電腦加上網路就可以開始。

選擇合適的程式語言和工具

若你是完全的初學者,我們會建議你從以下程式語言開始入手,再一步步針對你有興趣的領域繼續鑽研。

想要自學程式?七個自學程式設計正確的觀念和心態

  1. Scratch 若是你是國中小學的學員,你可以從 Scratch 開始。Scratch 是 MIT 麻省理工學院所開發的電腦程式平台,透過拖拉積木的方式可以讓使用者學習電腦程式的邏輯和概念,創造出多媒體或是遊戲應用,蠻適合低年齡層的學員使用。更重要的是 Scratch 本身是一個全世界的社群平台,你可以分享自己的作品也可以觀摩學習其他人的作品、認識新朋友,教學相長。

想要自學程式?七個自學程式設計正確的觀念和心態

  1. Python 若是成人或是想直接學習正式一點程式語言的學生,我們會推薦由 Python 入手。為什麼是 Python 呢?因為對於初學者來說 Python 是一個簡單易學但又功能強大的程式語言(Python 不僅可以編寫 Web 網站、桌面應用程式、開發遊戲更是機器學習/深度學習等資料科學應用的重要程式語言)。相較於其他 C/C++ 或是 Java 等程式語言,Python 相對而言較為簡潔且容易閱讀,此外不用經過編譯(compile)即可以執行程式也對於初學者較為友善。

想要自學程式?七個自學程式設計正確的觀念和心態

  1. JavaScript Java 和 JavaScript(簡稱 JS)和名字雖然很像但是卻是兩個不同的程式語言(可以說是熱狗和狗的差別),發展方向和應用層面也有所不同。隨著網際網路和瀏覽器引擎和 Node.js 的發展 JavaScript 的影響力有增無減。不再局限於瀏覽器的從早期的跑龍套到現在的獨挑大樑,現在不管是 Web 前後端、行動應用程式、桌面應用程式,甚至是深度學習等都可以使用 JavaScript 來開發。若是你想要開發有關 Web 相關的應用,更是必須學好 JavaScript,對於新手來說可以透過 Web 呈現和分享自己的作品是一個很有成就感的事情。但 JavaScript 技術變化很快,若是有有經驗的導師帶領可以少走許多冤枉路,且學習 JavaScript 通常需要搭配學習 HTML/CSS 語法。

想要自學程式?七個自學程式設計正確的觀念和心態

  1. Micro:bit Micro Bit(也叫做 BBC Micro Bit)是由 BBC 所推出的具備藍牙、光感測器、溫度感測、加速儀等感測器的微電路版,適合對於嵌入式系統和物聯網、創客應用有興趣的讀者。可以使用 Python、JavaScript、積木式等程式語言自己動手製作機器人或是溫度監控器等有趣應用!

看書/上課,動手做點東西

學習程式語言最好的方式就是買本你覺得合適入門書或是加入線上/線下課程後,開始動手做點東西。真正做出點什麼東西,去解決生活上的問題才是驗證你是否學會程式語言最重要的指標(就像是學英文一樣,你背誦了很多單字,但從沒開口說過或是無法和國際友人溝通,那即便是多益或是托福考的再高分那也不算是真正學會英文)。和幾個志同道合的朋友一起做專案、參與實習、接案或是參與開放原始碼專案(Open source project)都是一個很好的方式。

學寫程式就像是學習烏克麗麗或是吉他等才藝一樣需要動手練習才會學得好,總而言之就是:

動手做點東西 動手做點東西 動手做點東西

很重要所以講三遍!

想要自學程式?七個自學程式設計正確的觀念和心態

學會網路搜尋 Google 大法

一般在學習程式設計遇到困難時,最好的解法就是把錯誤訊息或是遇到的問題去 Google 搜尋一下,大部分情況下都可以在網路得到對應的解答。另外,Stack Overflow 程式設計問答網站Github 開源程式碼集散地 也是一個學習的好去處,沒事去逛逛,相信一定會有不少收穫。

想要自學程式?七個自學程式設計正確的觀念和心態

加入社群,尋找戰友

一個人寫 code 很孤獨,一群人寫 code 很幸福。在學習寫程式的過程是一條孤獨且漫長的道路,即便是經驗老道的老手也需要和不同領域的人請教,更何況是剛入門的新手。選擇一個友善的自學程式社群加入,可以讓你在學習程式語言的過程中更加順遂,而加入 HappyCoder 自學程式設計學院 相信是一個很好的選擇。

學會有禮貌的問問題並紀錄學習心得

當你卡關時你往往會希望尋求協助,但在尋求協助之前可以先自我評估所遇到的問題,可以讓你在問問題時可以更具體讓人明白也可以讓你在 Google 時可以找到合適關鍵字來搜尋(沒有人有義務一定要回答你的問題,幫助他人釐清問題是個好習慣)。

  1. 你想要做什麼?
  2. 你已經嘗試過什麼方法?
  3. 結果如何?

以上的問題最好回答可以具體一點。

例如說:

你想要做什麼?我想在要 Windows 環境下安裝 Python 環境 你已經嘗試過什麼方法?我已經在 Python 官方網站下載安裝完成 結果如何?但我在 cmd 終端機指令中輸入 Python 指令時出現沒有這個指令的錯誤

又例如說:

你想要做什麼?我想要在瀏覽器中跳出 comfirm 確認的提示框 你已經嘗試過什麼方法?我打好了 JavaScript 程式碼,也儲存了 結果如何?沒看到在瀏覽器成功執行,但在瀏覽器的開發者工具 console 顯示 Uncaught SyntaxError: Invalid or unexpected token 錯誤訊息

有些時候透過回答這三個問題,問題就自己迎刃而解了。

有些時候撰寫程式一段時間後腦袋會變鈍或是肩膀頸部緊繃。適當時候休息一下,起身運動或是喝口水和人交談一下,或許回頭再試試就會有靈感也說不一定。

另外,當你完成一個程式專案或是解掉某個 bug 時,記得可以撰寫成技術文章(若是有心要轉職程式設計領域的同學,經營自己的 Github 和部落格真的很重要),不但可以豐富自己的專業履歷也可以強化自己的記憶方便未來查找外,更重要的是也可以幫助到下一個跟你遇到同樣問題的人喔!

想要自學程式?七個自學程式設計正確的觀念和心態

尋找導師,持續學習

不管是在職場工作或是學習程式設計,有好的導師或是 role model 引導確實可以讓自己少走許多冤枉路和減少時間金錢的浪費。但一開始盡量不要找已經工作十年以上的工程師或是程式設計師(等到你要往架構師或是技術管理者邁進時再去找他們),對於新手來說,兩三年或三五年工作經驗的工程師和程式設計師剛好是個不會太有距離感,導師又能體會新手剛入門會遇到的挫折和煩惱,帶著誠懇和禮貌去尋找你身邊或是社群中願意帶你的導師。不過記得當你離開新手村後,若有機會也可以成為其他人的導師,取之於社群回饋於社群。

俗話說:師父領進門,修行在個人。若你有志於程式設計領域繼續鑽研,那就必須認知到 IT 行業是一個需要持續精進自我的領域。不管是技術還有如何設計產品、溝通協調、管理專案、撰寫簡潔漂亮的程式碼、設計架構等都需要持續地進修學習,唯有持續保持積極的學習態度和能力才是在這個領域持續保有競爭力的最佳保證。

總結

以上我們整理了多年來自學程式設計的經驗,我們也曾花過許多冤枉錢和時間。在這邊分享自學程式設計必備觀念和心態,希望讓所有有自學程式設計需求的朋友,不再徬徨、無助。

最後複習一下自學程式設計必備觀念和心態:

  1. 確認目標和動機
  2. 選擇合適的程式語言和工具
  3. 看書/上課,動手做點東西
  4. 學會網路搜尋 Google 大法
  5. 加入社群,尋找戰友
  6. 學會有禮貌的問問題並紀錄學習心得
  7. 尋找導師,持續學習

Happy Coding :)

第 02 期 Python 程式設計入門共學營 【業界資深工程師導師帶你練功】熱烈報名中

第 02 期 Python 程式設計入門共學營 【業界資深工程師導師帶你練功】熱烈報名中

由業界資深工程師導師帶你零基礎入門 Python 程式設計,我們為你去蕪存菁梳理出最重要的核心觀念和知識點,讓學員在有限的時間和金錢內用最有效率的方式學習,讓你的自學程式設計不再孤單無助!Co-Learning Camp 程式設計共學營是一種新型態跨領域線上學習方式(翻轉教育學習法),透過線上互動式程式練習、社群共學和專題導向式學習方式來學習程式設計,進而培養第二專長和跨領域自學能力,提升你的職場競爭力,成為更好的自己。

你也想累積專題作品實作經驗,建立基本程式設計應用能力嗎?你也想培養第二專長和跨領域自學能力,提升你的職場競爭力,成為更好的自己嗎?

第 02 期 Python 程式設計入門共學營【8 週 24 個程式冒險 | 業界資深工程師導師帶你練功】熱烈報名中,名額有限,額滿為止!

活動時間:2019/11/23 - 2020/01/16 馬上報名成為更好的自己:報名連結

參考文件

  1. 自學程式設計學習資源懶人包
  2. 用 Python 自學程式設計:程式設計思維入門

(image via negativespace.coyoda

如何在 Windows 打造 Python 開發環境設定基礎入門教學

· 閱讀時間約 13 分鐘

如何設定開發環境應該是每個初學程式設計者的痛(即便是老手有時也會覺得苦惱),尤其當你需要在終端機(terminal)輸入指令(command)來操控你的指令時(好吧,若你完全只走圖形化介面,習慣 GUI 操作就另當別論,但若你有志於往程式設計領域發展,建議還是熟悉一下指令碼)。

要在 LinuxMac OS 這種屬於類 Unix 系統(指各種 Unix 的衍生系統,而 Unix 指的是一種電腦作業系統,具有多工、多使用者的特色,是許多作業系統的父親)上打造 Python 開發環境相對容易,但當你使用 Windows 作業系統並希望在終端機下指令操作或開發應用程式時,往往受限於環境而產生許多困難和誤踩地雷。因此,接下來本文將教大家如何在 Windows 打造屬於自己的 Python 開發環境(包含一般 Winodows 安裝和使用虛擬機在 Windows 環境下建立 Linux/Ubuntu 作業系統,開發 Python 程式一般建議使用 Linux/Ubuntu 環境避免環境設定除錯困擾)!

開始建置 Python 開發環境

所謂工欲善其事,必先利其器,在開始之前我們必須先建置相關的開發環境,讓自己從麻瓜(不會寫程式的人)變成擁有程式魔力的魔法師。以下介紹我們在接下來開發 Python Web 應用程式所需要安裝的開發環境工具(強烈建議使用 Virtual Box 虛擬機搭配 Linux/Ubuntu 環境,若你真的很想使用 Windows 環境就繼續往下看吧!)。

  1. Microsoft VSCode 編輯器 Microsoft VSCode 是 Microsoft 推出的編輯器(非整合開發環境 IDE),夾帶著 Microsoft 過去打造 Visual studio 整合開發環境的豐富經驗,相比 Sublime Text 和其他編輯器,VSCode 的優勢在於開源且活躍的開發社群、內建 debugger 框架、原生 Git 整合、套件整合容易等特性。綜合以上幾點,對於初學者來說 VSCode 是一個蠻適合入門的開發環境。它的安裝方式也十分簡易,在官網下載後按照指示安裝完成即可,下載完成後可以打開看看。

    title: 如何在 Windows 打造 Python 開發環境設定

    我們可以點選左邊 icon 欄的第五個(長得像正方形拼圖),安裝 Python 語法和格式檢查的相關套件幫助除錯(搜尋 Python),選擇 Python 並點選 install 安裝:

    title: 如何在 Windows 打造 Python 開發環境設定

    你也可以於檔案(file)-> 開啟(open)打開你在電腦中已經準備好的專案資料夾,同時也可以在資料夾中新增檔案,我們之後的程式也會希望在建立好的專案資料夾中進行開發。這邊我們建立一個 hello.py 的檔案並印出 hello 訊息。

    print('hello python')
  2. 終端機環境(iTterm/內建 terminal) terminal(終端機)是我們下指令的地方,許多時候我們進行程式開發時不會使用 GUI 圖形化介面而是使用下指令方式請電腦做相對應的行為(記得寫程式就是下指令請電腦做事情!)。在 Linux 和 Mac 裡面都有內建的 terminal 的應用程式,以下為 MacOS 的 iTerm2 終端機下指令示意圖(iTerm2 中 $ 為提示字元,不用輸入):

    title: 如何在 Windows 打造 Python 開發環境設定

    使用 Windows 讀者可以使用 Cmder 這個軟體當做終端機環境。

    title: 如何在 Windows 打造 Python 開發環境設定

    比起 Winodws 內建的命令列 CMD,cmder 更貼近 Unix 的命令列指令碼:

    title: 如何在 Windows 打造 Python 開發環境設定

    首先到 Cmder 官網先安裝 Cmder Full 版本(含 git),安裝完成後解壓縮資料夾到桌面,執行裡面的 cmder.exe 檔案即可。

    title: 如何在 Windows 打造 Python 開發環境設定

    Cmder 預設是 λ,如果不習慣可以改成 Mac / Linux 環境下的 $,具體流程請參考這份文件

    title: 如何在 Windows 打造 Python 開發環境設定

    對於有志於從事程式開發相關工作的讀者建議可以多熟悉指令碼的輸入,更多指令碼可以參考鳥哥撰寫的 Linux 基本指令介紹Linux 學習資源

    以下是常用指令
    # 移動到桌面
    cd \Users\XXXX\Desktop
    # 列出資料夾下檔案
    ls
    # 刪除檔案
    rm 檔名
    # 複製檔案
    cp 檔名
  3. Git 版本控制系統/註冊 GitHub 帳戶 Git 是一種分散式版本控制系統,可以讓我們可以更方便地管理我們的程式碼。在網路上有非常多優秀的 Git 教學文件(連猴子都能懂的Git入門指南寫給大家的 Git 教學初心者 Git 上手攻略)。安裝 Git 方式是到官網下載軟體,依照指示安裝(若您使用 Cmder 的完整安裝 Download Full 的版本就不用安裝 git,因為已經幫你安裝好了)。

    title: 如何在 Windows 打造 Python 開發環境設定

    互動式語法學習:

    title: 如何在 Windows 打造 Python 開發環境設定

    在介紹完 git 之後我們來了解一下 GitHub。GitHub 是一個可以存放 git 程式碼專案的平台,透過 GitHub 我們可以接觸到最新的開放原始碼資訊,也可以將我們的程式碼開源出來。

    title: 如何在 Windows 打造 Python 開發環境設定

    從 GitHub 上複製程式碼

    # 複製一份到本地端
    $ git clone https://github.com/happycoderorg/python101.git
    # 移動到資料夾
    $ cd python101

    常見 Git 指令:

    # 初始化專案
    $ git init
    # 查看狀態
    $ git status
    # 檢查差異
    $ git diff
    # 將變更檔案放入暫存區
    $ git add index.py
    # 使用 commit -m 提交變更
    $ git -a -m 'init commit'
    # 查看歷史
    $ git log
    # 放棄已經 commit 的檔案重回暫存區
    $ git reset HEAD index.py
    # 放棄檔案變更
    $ git checkout index.py
  4. Anaconda Python3 版本 Anaconda 是一個 all-in-one 的 Python 開發環境,對於初學者來說是個十分合適的開發環境包。Anaconda 具備了幾項特點:

    • 便於安裝許多流行的科學、數學、工程、資料分析的 Python 模組
    • 免費並支援跨平台:Linux、Windows、Mac
    • 內建 Spyder 編輯器和 Jupyter Notebook 環境
    • 方便建立不同的虛擬開發環境

    安裝流程也十分簡單,進入 Anaconda 首頁,選擇對應作業系統(這邊使用 Windows)和是屬於 64 還是 32 位元: title: 如何在 Windows 打造 Python 開發環境設定

    Windows10 可以在系統看到位元資訊; title: 如何在 Windows 打造 Python 開發環境設定

    Windows7 可以在控制台->系統與安全->系統觀看作業系統位元資訊: title: 如何在 Windows 打造 Python 開發環境設定

    選擇對應 Python 版本下載(這裡選擇 Python3 以上版本),我們使用 Graphical Installer(圖像介面安裝方式),接著在下載完成時按照預設的安裝方式完成安裝; title: 如何在 Windows 打造 Python 開發環境設定

    記得安裝時要注意建議在安裝 anaconda 時勾選把環境變數加入(path environment variable),這樣在使用 cmder 時使用 conda 相關指令才不會出現錯誤,若一開始沒有勾選的話建議解除安裝後再重新安裝 anaconda 勾選加入環境變數。

    title: 如何在 Windows 打造 Python 開發環境設定

    若是完整安裝成功,可以打開 Cmder 終端機輸入,若是顯示 Python 3.6.0 :: Anaconda 4.3.0 (x86_64) 版本號即安裝成功(若沒成功可能要檢查一下是不是環境變數路徑的問題):

    $ python -V
    Python 3.6.0 :: Anaconda 4.3.0 (x86_64)

    接著要建立我們專案虛擬環境,這樣在安裝操作套件時比較不容易被污染到 root 全域的環境(因為你可能會有很多專案,專案使用的套件不盡相同,正式上線時只要把相關套件資訊透過 pip freeze > requirements.txt 存起來,然後在正式上線的伺服器安裝 pip install -r requirements.txt 即可),啟動後會出現(套件名稱)的提示字元:

    顯示目前虛擬環境列表
    conda info -e
    創建虛擬環境
    conda create -n 套件名稱 python=3.6
    進入虛擬環境(若是非 Windows cmder 環境加 source 於開頭) ,成功後提示字元變成:(套件名稱)$
    activate 虛擬環境名稱
    離開虛擬環境(若是非 Windows cmder 環境加 source 於開頭)
    deactivate

建立虛擬環境(virtual environment)

接著我們正式來建立一個 Python 的專案,打開終端機移動到桌面,建立專案資料夾(在輸入指令時可以使用 tab 自動補完指令)

# 移動到桌面
cd \Users\XXXX\Desktop
# 建立資料夾
mkdir python_examples
# 移動到資料夾
cd python_examples

建立獨立虛擬環境,並進入虛擬環境:

# 創立虛擬環境
conda create -n python_examples_venv python
# 啟動虛擬環境
activate python_examples_venv

成功進入虛擬環境後(會出現小括號 python_examples_venv)代表已經進入虛擬環境,即可以在裡面執行 Python 程式並安裝相關套件於該虛擬環境下:

# 安裝 django web 框架套件
pip install django
# 執行 python 檔案
python hello.py

事實上,在 Python3 中還有另外兩種建立虛擬開發環境的方式,包括使用 Python 內建工具:

# 使用 Python3 內建工具建立名為 example_venv 的虛擬開發環境
python -m venv example_venv

使用 virtualenv,和 anaconda 不同的是 virtualenv 會在建立虛擬環境的專案資料夾下建立一個資料夾裡面放虛擬環境的東西:

# 先安裝 virtualenv
pip install virtualenv
# 使用 virtualenv 產生一個名為 example_venv 的
virtualenv example_venv
# 移動到 example_venv 的外面資料夾,執行進入虛擬環境
example_venv\Scripts\activate
# 安裝 django web 框架套件到虛擬環境中(只會安裝在該虛擬環境中)
pip install django

整合在一起:在 Windows 撰寫你的第一個 Python 程式

確認安裝好以下工具後,我們就可以開始撰寫你的第一個 Python 程式

  1. 安裝 Microsoft VSCode
  2. 安裝 Cmder
  3. 安裝 Anaconda(記得勾選加入環境變數)
  4. 安裝 virtualenv (在終端機使用:pip install virtualenv 安裝)
  5. 在桌面創建一個 python_example 資料夾,打開 Microsoft VSCode 後開啟該專案資料夾,創建一個 hello.py 的檔案並在裡面打上 print('hello python!!')
  6. 打開 cmder 終端機 cd 移動到 hello.py 所在資料夾
  7. 執行 python hello.py,恭喜你完成第一個 Python 程式!

在 Windows 上安裝 Linux/Ubuntu

  1. 安裝 VirtualBox 對應版本虛擬機(這邊安裝 Windows 版本,若你是 Mac 想嘗試 Linux 也可以安裝 Mac 版本),下載完按照步驟安裝完成

    title: 如何在 Windows 打造 Python 開發環境設定

  2. 官網下載 Linux/Ubuntu 光碟映像檔案,請根據電腦位元架構選擇最新桌面穩定版本 16.04 LTS(for windows)

    title: 如何在 Windows 打造 Python 開發環境設定

  3. 建立 Linux Ubuntu 虛擬機,可以參考這篇 VirtualBox 虛擬機器安裝 Ubuntu 設定教學,設定一下名稱、作業系統類型和版本,欲分配給虛擬的記憶體大小(建議調整為大約實體記憶體的 1/3,舉例來說你有 30G 記憶體,可以分配 10G 給虛擬機)。接著選擇立即建立虛擬硬碟、VDI (VirtualBox 磁碟映像)、動態配置硬碟大小不會造成浪費(虛擬硬碟容量建議 30G 以上)。

    title: 如何在 Windows 打造 Python 開發環境設定

  4. 選擇建立好的虛擬機並選設定值按鈕,選擇存放位置選項,控制器中選擇虛擬 CD/DVD 檔案選擇剛剛從官網下載下來的檔案,確定後接著選擇虛擬機並啟動,接下來選擇安裝 Linux/Ubuntu,選擇立即安裝和預設值,需要一段時間安裝和設定(中間會有語言相關的選擇和密碼設定)

    title: 如何在 Windows 打造 Python 開發環境設定

  5. 啟動使用 Linux/Ubuntu,按照上面教學安裝 Microsoft VSCode 編輯器,安裝 Anaconda,建立第一個 Python 檔案、打開終端機(termical)安裝 ,執行 Python 程式

    title: 如何在 Windows 打造 Python 開發環境設定

網路上也有許多相關參考教學文章:VirtualBox 5.2安裝Ubuntu 16.04 相關教學VirtualBox 虛擬機器安裝 Ubuntu 設定教學

若是螢幕太小可以在上排選單中選擇:裝置->插入 Guest Additions CD 映像...->執行->重開虛擬機->可以調整大小

整合在一起:用 Linux 撰寫你的第一個 Python 程式

確認安裝好以下工具後,我們就可以開始撰寫你的第一個 Python 程式

  1. 進入虛擬機的 Linux/Ubuntu
  2. 安裝 Microsoft VSCode
  3. 安裝 Anaconda(記得勾選加入環境變數)
  4. 安裝 virtualenv (在終端機使用:pip install virtualenv 安裝)
  5. 在桌面創建一個 python_example 資料夾,打開 Microsoft VSCode 後開啟該專案資料夾,創建一個 hello.py 的檔案並在裡面打上 print('hello python!!')
  6. 打開 terminal 終端機 cd 移動到 hello.py 所在資料夾
  7. 執行 python hello.py,恭喜你完成第一個 Python 程式!

總結

如何設定開發環境應該是每個初學程式設計者的痛(強烈建議使用 Virtual Box 虛擬機搭配 Linux/Ubuntu 環境),以上介紹了如何在 Windows 打造 Python 開發環境設定,請讀者務必照著自己的電腦作業系統環境安裝一次,當然若你有志於往程式設計領域發展,也要熟悉一下指令碼操作。

參考文件

  1. VirtualBox 5.2安裝Ubuntu 16.04
  2. Create virtual environments for python with conda
  3. conda vs. pip vs. virtualenv
  4. Anacodna之conda VS Virtualenv VS Python 3 venv 对比使用教程,创建虚拟环境
  5. 命令列指令碼查詢

(image via githubusercontentwebsiteoptimizationytimgytimgostechnix

用 Python 自學程式設計:list、tuple、dict and set

· 閱讀時間約 6 分鐘

Python 自學程式設計:程式設計思維入門

Markdown 是一種輕量級的標記語言,最初為 John Gruber 所設計。Markdown 特色在於允許人們「使用易讀易寫的純文字格式編寫文件,然後轉換成有效的 HTML 文件」。簡而言之,Markdown 就是一種簡潔易懂的語法,讓我們可以專注在內容上,不用花時間思考外觀樣式,在透過轉換變成可以呈現在網頁上的 HTML 語法。目前在許多知名技術/開發者論壇或是開發者工具(例如:Github)、技術部落格工具都有支援 Markdown 語法。

什麼是 HTML?

在開始學習 Markdown 之前我們先來認識一下 HTML,畢竟 Markdown 最終還是要轉換成 HTML 這個網頁上內容結構的標準語法。HTML 中文稱作超文本標記語言(英文全名為 HyperText Markup Language,簡稱 HTML),是一種用於建立網頁的標準標記語言。

這樣講起來有點抽象,事實上我們每天在觀看瀏覽的網頁就是由一個個 HTML 所組成。所以我們可以透過瀏覽器的檢視原始碼功能去一窺目前網頁的 HTML 樣貌。

這邊我們使用 Google Chrome 瀏覽器當作範例,可以在畫面中點選右鍵 > 檢視原始碼(View Page Source):

就可以看到該網頁的 HTML 內容:

網頁來源:Wikipedia HTML 頁面

由於這個網頁已經有點複雜,因為它已經包含了 CSS 外觀樣式語法和 JavaScript 互動邏輯程式的部分,對於初學者來說比較難一眼理解。所以我們用一下範例來介紹 HTML 最基礎的部分:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<h1>我是標題</h1>
<p>我是段落</p>
<a href="https://zh.wikipedia.org/zh-tw/Markdown">我是超連結</a>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/84/HTML.svg/200px-HTML.svg.png" alt="">
</body>
</html>

若是使用瀏覽器打開這個 HTML 網頁會呈現:

HTML 標籤語法每個標籤皆有其意義且大部分成對出現,標籤元素內可以設定屬性值。網頁元素主要放置於 <body></body> 中,<head></head> 內主要放置 meta data 設定檔案和放置引入的外觀樣式檔案、程式邏輯等。元素內可以透過設定屬性值(attribute)來宣告元素功能,以下 href="https://zh.wikipedia.org/zh-tw/Markdown" 代表點擊該連結會到該 wikipedia 網址。

<!-- href 是屬性,決定連結點擊後目的地 -->
<a href="https://zh.wikipedia.org/zh-tw/Markdown">我是超連結</a>

<!-- src 是屬性,決定載入圖片位置-->
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/84/HTML.svg/200px-HTML.svg.png">

元素包裹內容在內,代表標題元素:

<h1>我是標題</h1>

Markdown 常見語法教學

一般 Markdwon 段落以空白行分隔。若是序列則內容需要內縮(一個 tab)。

標題

是一级標題
=======

# 一級標題
## 二级標題

其 HTML 元素為:

<h1>是一级標題</h1>
<h1>一級標題</h1>
<h2>二级標題</h2>

效果如下:

是一级標題

一級標題

二级標題

文字

_斜體_
**粗體**
`等寬字型Monospace`

其 HTML 元素為:

<em>斜體</em>
<strong>粗體</strong>
<code>等寬字型Monospace</code>

效果如下:

斜體 粗體 等寬字型Monospace

多行程式碼

其 HTML 元素為:

<pre>
<code>
<span>print('hello world')</span>
</code>
</pre>

效果如下:

print('hello world code :)')

水平線

---

其 HTML 元素為:

<hr>

效果如下:


無序列表

* 張三
* 李四
* 王二

其 HTML 元素為:

<ul>
<li>張三</li>
<li>李四</li>
<li>王二</li>
</ul>

效果如下:

  • 張三
  • 李四
  • 王二

有序列表

1. 不論
2. 三七
3. 二十一

有序列表,其 HTML 元素為:

<ol>
<li>不論</li>
<li>三七</li>
<li>二十一</li>
</ol>

效果如下:

  1. 不論
  2. 三七
  3. 二十一

巢狀有序列表

1. 不論
- 第一
- 第二
- 第三
2. 三七
1. 第一
2. 第二
3. 第三
3. 二十一

有序列表,其 HTML 元素為:

<ol>
<li>不論
<ul>
<li>第一</li>
<li>第二</li>
<li>第三</li>
</ul>
</li>
<li>三七
<ol>
<li>第一</li>
<li>第二</li>
<li>第三</li>
</ol>
</li>
<li>二十一</li>
</ol>

效果如下:

  1. 不論
    • 第一
    • 第二
    • 第三
  2. 三七
    1. 第一
    2. 第二
    3. 第三
  3. 二十一

超連結

[連結文字](連結網址)

其 HTML 元素為:

<a href="https://upload.wikimedia.org/wikipedia/commons/thumb/8/84/HTML.svg/200px-HTML.svg.png">連結文字</a>

效果如下:

連結文字

圖片

![文字屬性](Icon-pictures.png "文字標題")

其 HTML 元素為(少數沒有成對出現的元素標籤):

<img src="連結網址" alt="文字屬性" title="文字標題" />

效果如下:

圖片文字

注釋引用

> Markdown使用電郵用字元「>」來引用。

其 HTML 元素為:

<a href="連結網址">連結文字</a>

效果如下:

Markdown 使用電郵用字元「>」來引用。

表格

| Column 1 | Column 2 | Column 3 |
| -------- | -------- | -------- |
| Text | Text | Text |

其 HTML 元素為:

<table>
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
</tr>
</thead>
<tbody>
<tr>
<td>Text</td>
<td>Text</td>
<td>Text</td>
</tr>
</tbody>
</table>

效果如下:

Column 1Column 2Column 3
TextTextText

總結

以上簡單介紹了:

  1. 什麼是 HTML?
  2. Markdown 常見語法教學

以上介紹了 HTML 和 Markdown 基礎語法的教學,透過 Markdown 這一種簡潔易懂的語法,我們可以更專注在內容創作上。對於一個自學程式設計新手而言,培養撰寫文章的習慣(例如:建立自己的技術部落格)是很重要的環節,不但可以累計自己經歷也可以強化記憶並幫助到需要的人。若是需要完整語法介紹可以參考markdown.tw,當然,只要多加練習就可以慢慢掌握 Markdown 語法的訣竅,進而喜歡這種簡潔的書寫方式。

參考文件

  1. Github Basic writing and formatting syntax
  2. markdown.tw
  3. markdown wiki

用 Python 自學程式設計:list、tuple、dict and set

· 閱讀時間約 5 分鐘

Python 自學程式設計:程式設計思維入門

在前一單元中我們了解了變數和 Python 世界物件的重要性,也介紹了簡單的資料型別,我們也有提到簡單資料型別(布林、整數、浮點數和字串)就像是原子一樣,而複雜資料型別就像是分子一樣,在這一單元中我們將更進一步了解 Python 複雜的資料型別以及如何操作它們。

串列 list 與元組 tuple

在程式語言中通常可以利用序列式方式去記錄資料,在 Python 中,我們使用 list 串列和 tuple 元組來儲存序列式資料。兩者最大的不同在於 tuple 是不可以改變的。

  1. 串列 list 串列是一連串順序性的元素組成,我們可以新增、讀取、刪除和修改串列,串列中可以有重複的元素。

    • 建立串列

    串列可以透過中括號或是使用 list 關鍵字來創建,裡面元素由逗號分隔

    my_list0 = []
    my_list1 = list()
    my_list2 = ['python', 'js', 'SQL']

    list('js')
    # ['j', 's']
    • 使用 index offset 和範圍來取得元素

    在電腦科學世界,index 通常是從 0 開始,-1 從結尾數回來:

    languages = ['python', 'js', 'go']
    languages[0] # python
    languages[1] # js
    languages[-1] # go

    範圍取值 [開始:結束(不含):間隔(default 1)]:

    languages = ['python', 'js', 'go']
    my_list2[0:1] # ['python']
    • append 元素到串列最後
    languages = ['python', 'js', 'go']
    languages.append('java')
    • extend 串連串列
    languages = ['python', 'js', 'go']

    languages.extend('c++') # ['python', 'js', 'go', 'c++']

    languages += ['ruby', 'c'] # ['python', 'js', 'go', 'c++', 'ruby', 'c']
    • insert 插入元素到位置上
    languages = ['python', 'js', 'go']
    languages.insert(0, 'java') # ['java', 'python', 'js', 'go']
    • del 刪除特定 index 值
    languages = ['python', 'js', 'go']

    del languages[-1] # ['python', 'js']

    • len() 元素長度
    len(['python', 'js', 'go']) # 3
    • in 檢查元素是否在串列
    'java' in ['python', 'js', 'go'] # False

    還有更多好用的方法,讀者可以進一步查詢使用: remove()index()count()join()、sort()、copy()

  2. 元組 tuple 元組可以視為不可改變的串列,使用方式如下:

    languages = python', 'js', 'go' # (python', 'js', 'go')
    tuple(['python', 'js', 'go'])

    元組比起串列好處:

    • 佔用空間較少
    • 可以當做字典的 key(因不可變)
    • 具名 tuple 可當做物件替代
    • 當做函式引數

字典 dict 和集合 set

  1. dict 在其他程式語言可能稱 {'key':'value'} 字典為關聯式陣列或是雜湊表,其用獨一無二不可變的鍵(布林、整數、浮點數、字串和串列)去對應值,字典通常是可變的,可以新增刪除、修改鍵值。

    • 創建 dict
    languages = {
    'name': 'python',
    'version': '3.5'
    }

    dict([('name', 'python'), ('version', '3.5')])
    • 新增和取值
    languages = {}

    languages['name'] = 'python'

    print(languages['name']) # python
    • 合併
    languages = {
    'name': 'python',
    'version': '3.5'
    }

    languages2 = {
    'name': 'js',
    'version': '6'
    }

    languages.update(languages2)
    • keys() 取得所有鍵、values() 取得所有值、items() 取得所有鍵值對
    languages = {
    'name': 'python',
    'version': '3.5'
    }

    languages.keys() # ['name', 'version']
    languages.values() # ['python', '3.5']
    languages.items() # [('name', 'python'), ('version', '3.5')]
    • 使用 in 判斷 key 是否存在 dict
    languages = {
    'name': 'python',
    'version': '3.5'
    }

    'name' in languages # True
  2. set 類似小學時候學習的數學集合,可以想成就是留下鍵值的 dict。由於 set 存不重複值。當你只想知道值是否存在就是使用 set 的時機,例如使用 in 來判斷值是否存在。

    • 建立 set
    languages = set()

    languages = {'python', 'js', 'python', 'go'}
    # {'python', 'js', 'go'}
    • 轉換成 set
    set('python') # {'p', 'y', 't', 'h', 'o', 'n'}
    set(['python', 'js']) # {'python', 'js'}
    set(('python', 'js')) # {'python', 'js'}
    • 使用 intersection 取交集,union 取聯集,difference 取差集
    languages1 = {'js', 'python', 'go'}
    languages2 = {'python', 'go', 'java'}
    languages1.intersection(languages2) # {'python', 'go'}
    languages1.union(languages2) # {'js', 'python', 'java', 'go'}
    languages1.difference(languages2) # {'js'}

整合在一起

回想一下,我們可以使用 [] 建立 list 串列,用 , 來創立 tuple 元組,使用 來建立字典。雖然建立方式不盡相同,但相同的是你都可以透過中括號來存取內容值:

languages0 = ['python', 'js'] # languages0[0]
languages1 = ('python', 'js') # languages1[0]
languages2 = {
'name': 'python',
'version': '3.5'
} # languages2['name']

總結

以上就是程式設計思維入門簡介,透過了解什麼是程式設計思維和不同語言的特性,我們將對於自學程式設計有更正確的認識。接下來我們將透過 Python 介紹程式設計的內涵和不同的應用情境。當然,網路上也有許多學習資源可以當做參考。

(image via mshcdn

延伸閱讀

  1. Python 官網
  2. JavaScript 程式設計新手村
  3. Python Web 程式設計入門實戰
  4. 非本科生,我想半路出家學寫程式,該如何開始?
  5. 自學程式設計學習資源懶人包

用 Python 自學程式設計:變數(variable)與資料型別(type)

· 閱讀時間約 7 分鐘

Python 自學程式設計:程式設計思維入門

在前一單元中我們了解了程式設計思維的概念和建立了 Python 的開發環境,在這一單元中我們將了解 Python 變數與資料型別以及如何操作字串。

電腦最初的用途就是一台超大台計算機

資料的儲存以及操作在程式設計中扮演非常重要的角色,因為最早的電腦程式就是一種大型的計算機(最早的電腦就稱為計算機),即便現在學校教授電腦科學概論往往都會把課程稱為計算機概論呢!在操作資料的過程中如何儲存資料就是非常重要的事情,一般而言資料儲存有分為暫時儲存的揮發性資料(儲存在記憶體中的變數資料)和持久性儲存的資料(例如:資料庫、檔案等),在這邊我們討論的是變數的資料。

在 Python 世界,所有東西都是物件

在 Python 世界中,所有東西都是物件,物件可以視為透明的箱子,裡面存了一些資料。物件會有自己的資料型別,決定它做什麼樣的操作。另外,又依據箱子內的值可否改變而分為不可變物件可變物件

在前面我們有提到資料可以儲存在記憶體中的變數,在 Python 中變數只是一種名稱,當給定值時不會將值複製,而是將名稱貼到給定的物件上(注意 Python 程式語言中的 = 是給定值,== 才是相等的意思)

談到資料,就不得不談一下資料型別(type),雖然在 Python 不用像 C 語言之類程式語言需要在變數前面定義資料型別(在 Python 中 class 類別和 type 類型幾乎代表同一件事情,class 類別則是定義物件的基礎),但物件的資料型別會影響資料操作,所以值得我們好好認識。在 Python 世界裡,可以分為以下幾種簡單資料型別(可以想像成化學課中的原子):

  1. bool 布林,分為 TrueFalse 通常用於條件判斷
  2. int 整數,例如: 10999999
  3. float 浮點數,係指有小數點的整數:1.2221.0e7 等同於 10 的 7 次方
  4. string 字串,一串文字字元

我們可以透過 type(物件) 去確認該物件的型別:

print(True)
print(101)
print(3.14)
print('happy coding')

另外一種是複雜資料型別(可以想像成是化學課中的分子),這個我們會在下一個單元做討論:

  1. list 串列,用於儲存一系列序列資料(可以儲存不同資料型別),類似於其他程式語言的陣列但更為強大
  2. tuple 元組,類似於 list 串列,但不同的是 tuple 給定元素後不能改變
  3. dict 字典,和串列很像但不在乎元素順序,而且不會使用 0,1,...等的序列 index 來選擇項目,反之我們必須宣告唯一的 key 鍵值來對應想儲存的 value 值
  4. set 集合,集合就像是被移除 value 值的字典,只有保留 key 鍵值,也就是說 set 的內容元素都必須是獨一無二的

物件又分可變和不可變物件

  1. 不可變物件(int, string, float, tuple),亦即若資料改變,會複製一份資料到新的記憶體空間然後資料更新,下面是一個簡單範例:

    i = 101 # 宣告一個變數將 i 便條紙貼到 101 物件
    j = 101 # 宣告一個變數將 j 便條紙貼到 101 物件
    print(id(101)) # 印出 101 物件 id,可以想成是記憶體位置
    print('i id:' + str(id(i))) # 印出 i 指向的 id,和 101 物件值相同
    print('j id:' + str(id(j))) # 印出 j 指向的 id,和 101 物件值相同
    print(i is j) # 因為兩者會貼到同一個物件所以會顯示相等,True
    j = j + 1 # 若資料改變,會複製一份資料到新的記憶體空間然後資料更新
    print('new i id:' + str(id(i))) # 印出一樣的 id
    print('new j id:' + str(id(j))) # 印出新的 id
    print(i is j) # 兩者指到不同的記憶體位置,False

    執行結果:

    140181136769920
    i id:140181136769920
    j id:140181136769920
    True
    new i id:140181136769920
    new j id:140181136769952
    False
  2. 可變物件(list, dict, set),亦即若資料改變則直接在指向的記憶體空間改變資料,下面是一個簡單範例:

    a = {} # 宣告一個變數指到一個空字典 dict
    b = a # 將 b 變數指到 a 同樣記憶體位置
    print(id(a)) # 印出 a 的 id
    print(a is b) # 兩者指到相同的記憶體位置,True
    a['a'] = 'python' # 改變 a 的鍵值
    print('id a:' + str(id(a))) # 印出 a id
    print('a:' + str(a)) # 印出內容值
    print('id b:' + str(id(b))) # 印出 b id,dict 為可變物件,印出 id 會和 a 一樣
    print('b:' + str(b)) # dict 為可變物件,印出內容值會和 a 一樣
    print(a is b) # 兩者指到相同的記憶體位置,True

    執行結果:

    140181112792336
    id a:140181112792336
    a:{'a': 'python'}
    True
    id b:140181112792336
    b:{'a': 'python'}
    True

另外,Python 支援強制轉換資料型別: 可以透過 int()、float()、str() 進行資料型別轉換

int(1.2)
float('1.3')
str('1')

字串操作好好玩

在程式設計的世界中,操作字串基本上是家常便飯,接著我們來談談在 Python 中如何進行字串的操作:

在 Python 中若要宣告字串,可以使用單引號或雙引號,會有兩種方式是因為讓開發者可以產生有 '" 內容的字串。

my_str = 'This is a "good" language!'

但要特別留意的是在 Python3 和 Python2 對於字串的支援不盡相同,在 Python 中支援 Unicode 標準。與其他程式語言不同的是 Python 字元是不可變的,不能直接改變字串,但可以將一部分字串複製到其他字串。

以下是常見字串操作方式:

  1. 宣告字串

    language = 'python'
  2. 串連字串 +

    language = 'python'
    word = 'I love'
    word + language
  3. 複製字串 *

    language = 'python'
    language * 3
  4. 選取字串 [開始:結束:間隔]

    language = 'python'
    language[0:1] # p
    language[0:-1] # pytho
    language[0:4:2] # ph
  5. len、split、join、replace 字串操作

    language = 'python'
    print(len(language)) # 印出字串長度 6
    print(language.split(3)) # 切割字串長度
    print(language.join(3)) # 切割字串長度
    print(language.replace(3)) # 切割字串長度

總結

以上我們介紹了在 Python 世界中物件是基本元素,也介紹了變數以及字串的操作,接下來我們將透過 Python 介紹程式設計的內涵和不同的應用情境以及複雜資料型別的使用。

(image via mshcdn

延伸閱讀

  1. Python 官網
  2. JavaScript 程式設計新手村
  3. Python Web 程式設計入門實戰
  4. 非本科生,我想半路出家學寫程式,該如何開始?
  5. 自學程式設計學習資源懶人包
  6. python可变和不可变对象

用 Python 自學程式設計:程式設計思維入門

· 閱讀時間約 14 分鐘

Python 自學程式設計:程式設計思維入門

最近幾年全球刮起了一股爭相學習電腦科學(Computer Science)和程式設計(Programming)的風氣,上至總統、首相下至升斗小民都爭相開始學寫程式。事實上,學寫程式最重要的是學習電腦科學背後思考方式和邏輯,學習如何透過科技解決生活上的問題。更進一步說,程式設計與其說是一種科學,更偏向一種藝術人文的創作與科學的混合體。以前畫家或是作家是拿紙筆創作,現在只要有一部電腦,連上網路,就可以透過敲打鍵盤將自己的創意付諸實踐。

有人說:程式設計 = 演算法 + 資料結構

這樣的說法不能說錯。事實上,具備良好資料結構和演算法素養的程式設計師往往可以寫出品質較好的程式碼,但大部分人看到演算法和資料結構就已經滿臉問號了,更別提曾經在學校被這兩門課程心靈受挫的學生們。所以對於初學者來說,更應該讓他了解,事實上學程式設計思維就是在學習解決問題的能力:

  1. 尋找並發現問題
  2. 釐清並定義問題
  3. 分解問題
  4. 尋找解決方法和資源
  5. 驗證問題和解決方式

唯有具備這樣解決問題的能力,才能稱得上真正學會程式設計思維。而這樣的思考方式的訓練是不管將來到哪裡,是否有從事程式設計相關工作都受用,這才是對於學習電腦科學與程式設計思維正確的認知。

寫程式就是下指令請電腦做事情

剛剛我們在上面提到程式設計思維中有一個部分是分解問題,事實上,寫程式在定義問題後,我們必須把問題切分,就像是食譜一樣,不管是再豐盛的料理或是滿漢全席,都有一個個步驟去完成。舉例來說,我們今天要創作一道蔥花蛋或菜脯蛋,我的步驟會是:

  1. 放點油
  2. 打蛋
  3. 如果喜歡蔥花可以加入蔥花,如果喜歡菜脯可以加入菜脯(程式術語:if...else 條件判斷)
  4. 放入少許鹽巴
  5. 中火快炒,翻五次面(程式術語:for 迴圈)
  6. 當看到蛋面呈現金黃色時可以起鍋,結束料理(程式術語:while 迴圈)
  7. 好吃的蔥花蛋或菜脯蛋上桌

再大程式切分後就變成一個個小程式和指令,將程式切分成一個個模組,再將它們都組裝起來就成我們的應用程式和系統。

第一次學寫程式,學哪一種語言好呢?

既然程式設計思維很重要,究竟第一次學寫程式,學哪一種語言好呢?

先講結論:Python 語法平易近人,學習曲線平緩,應用廣,可以很快做出一些解決生活上問題的應用,累積成就感,適合初學者。當然若你是國中小的學生,Scratch 之類的拖拉式圖象化程式語言或許是合適選擇,但成人一般對於這種玩具比較排斥些,認為不是真正在學寫程式。

一般而言除了區分高低階程式語言外,我們會把程式語言分為:

靜態語言:在程式語言中我們會使用變數(variable)儲存程式的值,在靜態語言中需要事先宣告變數型態(type),也宣告了它會在記憶體中佔有多少空間等資訊。電腦會透過這些資訊把程式編譯(compile)成低階的機器語言讓電腦可以執行。這樣的設計可以讓電腦執行起來更有效率,但對於開發者來說會比較繁瑣一些(例如:宣告字串變數要在變數前加 string 宣告),也由於類型被宣告後無法改變,所以被稱為靜態語言。常見的靜態語言包括:C/C++、Java、C#、Go、Swift 等)。

動態語言(又稱為 script language):相對於靜態語言,動態語言不會強制變數類型宣告,它不是使用編譯器而是使用直譯器(interpreter)來解譯。動態語言雖然開發和撰寫程式上效率較快,但執行速度往往比靜態語言慢(現在差距已經慢慢變小)。一般常見的動態語言包括:Python、JavaScript、PHP、Ruby 等)。

以下就來先簡單介紹常見程式語言和它的簡單語法範例(可以透過 repl.it 可以將程式碼貼在網頁上呈現所見即所得效果):

  1. Python 本系列文章的主角,Python 是一種物件導向、直譯式的跨平台動態程式語言,它包含了一組功能完備的標準庫和豐富套件生態系,可以輕鬆完成很多常見的任務(例如:物聯網應用開發、遊戲、讀寫檔案、自然語言處理、網路爬蟲、網站開發、機器學習等),因為它可以很輕易整合其他底層語言,所以又稱為膠水語言。它的語法簡單,與其它大多數程式設計語言使用大括弧不一樣,它使用縮進來定義語句塊。由於具備簡潔易學等特性,是許多開發者推薦 Python 為初學者第一個學習的程式語言。由於版本更迭,我們接下來討論的主要是以 Python3 為主。以下是使用 Python 印出最喜歡的語言:

    language = 'Python'
    print('My favorite Language is {}'.format(language))
  2. C 經典的傳統主力程式語言,適用於需要效能重視速度的應用,可以操作許多小細節,但學習門檻稍微高一些,執行前需要事先編譯完成:

    #include <stdio.h>
    int main(int atgc, char *argv[]) {
    string language = "C++";
    printf("My favorite Language is %s", language);
    return 0;
    }
  3. C++ 屬於 C 家族成員,具備物件導向特性,同樣是適用於需要效能重視速度和操作底層韌體、硬體的好選擇:

    #include <iostream>
    using namespace std;
    int main() {
    string language = "C++";
    cout << "My favorite Language is " << language;
    return(0);
    }
  4. Java 常見於企業系統和 Android 行動應用開發的 Java 是物件導向程式語言,由於跨平台開發等特性讓 Java 一直是市場蠻熱門的語言。

    public class CodeLanguage {
    public static void main(String[] args) {
    string language = "Java";
    System.out.format("My favorite Language is %s", language);
    }
    }
  5. C# 由微軟推出吸收了 C++/Java 等優點的物件導向程式語言,常見於開發微軟平台相關的應用程式。

    using System;
    namespace CodeLanguage {
    class CodeLanguage {
    static void Main() {
    string language = "C#";
    Console.WriteLine("My favorite Language is {}", language);
    }
    }
    }
  6. JavaScript 隨著版本演進和 Node.js 的推出後從玩具語言到可以挑大樑的程式語言,應用範圍遍及網頁前後端開發、遊戲開發、物聯網程式開發、手機程式開發等。是程式設計師社群平台 Github 和程式問答平台 StackOverflow 上最受歡迎的程式語言之一。且由於應用範圍廣泛,程式江湖更傳言:可以使用 JavaScript 編寫的程式,最終都會出現 JavaScript 版本。

    var language = 'JavaScript'
    console.log('My My favorite Language is ' + language);
  7. PHP 吸收了 C/Java/Perl 特點的網站開發主力語言,世界上有許多的網站都是使用 PHP 進行開發。

    <?php
    $language = 'PHP';
    echo 'My favorite Language is ' + language;
    ?>
  8. Ruby 常見於網頁 Web 開發,以 Ruby on Rails Web 開發框架聞名於程式設計社群。

    language = 'Ruby'
    puts 'My favorite Language is #{language}'
  9. Swift 由 Apple 推出的推出的程式語言,主要用於開發 iOS/Mac 系列產品,應用範圍也涉及到了伺服器端開發(Server)。

    let language = 'Swift'
    print("My favorite Language is ", language)

  10. Go 由 Google 推出的程式語言,適合用於平行化程式開發。

    package main
    import "fmt"

    func main() {
    language := 'Go'
    fmt.Printf("My favorite Language is %s", language)
    }

看完了眾多語言是不是發現其實 Python 語法還蠻可愛平易近人的呢?事實上,世界上沒有最好的程式語言,只有最適合的使用地方。接下來我們將透過 Python 學習程式設計思維。

Python 環境建置

在開始之前我們必須先建置相關的開發環境,讓自己從麻瓜(不會寫程式的人)變成擁有程式魔力的魔法師。

所謂工欲善其事,必先利其器,要開發好的應用程式必須先準備好開發環境才行。以下介紹我們在接下來開發 Python Flask Web 應用程式所需要安裝的開發環境工具(以下以 Mac OS 等 Unix-like 作業系統為示範,若是 Windows 使用者建議安裝 Virtualbox 並運行 Linux Ubuntu 作業系統,參考安裝文件):

  1. Microsoft VSCode 編輯器 Microsoft VSCode 是 Microsoft 推出的編輯器(非整合開發環境 IDE),夾帶著 Microsoft 過去打造 Visual studio 整合開發環境的豐富經驗,相比 Sublime Text 和其他編輯器,VSCode 的優勢在於開源且活躍的開發社群、內建 debugger 框架、原生 Git 整合、套件整合容易等特性。所以對於初學者來說 VSCode 是一個蠻適合入門的開發環境。它的安裝方式也十分簡易,在官網下載後按照指示安裝完成即可。

    Python Web Flask 實戰開發教學 - 簡介與環境建置

    我們可以安裝 Python 語法和格式檢查的相關 Python 套件幫助除錯:

    Python Web Flask 實戰開發教學 - 簡介與環境建置

  2. 終端機環境(iTterm/內建 terminal) terminal(終端機)是我們下指令的地方,許多時候我們進行程式開發時不會使用 GUI 的介面而是使用下指令方式請電腦做相對應的行為。在 Linux 和 Mac 裡面都有內建的 terminal 的應用程式,若你是 Mac 用戶想使用更便利的工具(分割視窗、熱鍵、搜尋、自動補完等)可以額外安裝 iterm2 做使用。若是不想使用 Virtualbox,使用 Windows 讀者可以使用 Cmder 這個軟體當做終端機環境。

    Python Web Flask 實戰開發教學 - 簡介與環境建置

    下指令($ 為提示字元,不用輸入):

    Python Web Flask 實戰開發教學 - 簡介與環境建置

    對於有志於從事程式開發相關工作的讀者建議可以多熟悉指令碼的輸入,更多指令碼可以參考鳥哥撰寫的 Linux 基本指令介紹Linux 學習資源

  3. Git 版本控制系統/註冊 GitHub 帳戶 Git 是一種分散式版本控制系統,可以讓我們可以更方便地管理我們的程式碼。在網路上有非常多優秀的 Git 教學文件(連猴子都能懂的Git入門指南寫給大家的 Git 教學初心者 Git 上手攻略)。安裝 Git 方式是到官網下載軟體,依照指示安裝。

    Python Web Flask 實戰開發教學 - 簡介與環境建置

    互動式語法學習:

    Python Web Flask 實戰開發教學 - 簡介與環境建置

    在介紹完 git 之後我們來了解一下 GitHub。GitHub 是一個可以存放 git 程式碼專案的平台,透過 GitHub 我們可以接觸到最新的開放原始碼資訊,也可以將我們的程式碼開源出來。

    Python Web Flask 實戰開發教學 - 簡介與環境建置

    從 GitHub 上複製程式碼

    Python Web Flask 實戰開發教學 - 簡介與環境建置

    # 複製一份到本地端
    $ git clone https://github.com/happycoderorg/flask101.git
    # 移動到資料夾
    $ cd flask101

    常見 Git 指令:

    # 初始化專案
    $ git init
    # 查看狀態
    $ git status
    # 檢查差異
    $ git diff
    # 將變更檔案放入暫存區
    $ git add index.py
    # 使用 commit -m 提交變更
    $ git -a -m 'init commit'
    # 查看歷史
    $ git log
    # 放棄已經 commit 的檔案重回暫存區
    $ git reset HEAD index.py
    # 放棄檔案變更
    $ git checkout index.py
  4. Anaconda Python3 版本 Anaconda 是一個 all-in-one 的 Python 開發環境,對於初學者來說是個十分合適的開發環境包。Anaconda 具備了幾項特點:

    • 便於安裝許多流行的科學、數學、工程、數據分析的 Python 模組
    • 開源和免費
    • 跨平台支持:Linux、Windows、Mac
    • 支持 Python 版本切換,方便建立不同的虛擬開發環境
    • 內建 Spyder 編輯器和 Jupyter Notebook 環境

    安裝流程也十分簡單,進入 Anaconda 首頁,選擇對應作業系統(這邊使用 Mac OS): Python Web Flask 實戰開發教學 - 簡介與環境建置

    選擇對應 Python 版本下載,我們使用 Graphical Installer(圖像介面安裝方式),接著在下載完成時按照預設的安裝方式完成安裝; Python Web Flask 實戰開發教學 - 簡介與環境建置

    若是完整安裝成功,可以打開終端機輸入,若是顯示 Python 3.6.0 :: Anaconda 4.3.0 (x86_64) 版本號即安裝成功:

    $ python -V
    Python 3.6.0 :: Anaconda 4.3.0 (x86_64)

    接著要建立我們專案虛擬環境,這樣在安裝操作套件時比較不容易被污染到 root 的環境,啟動後會出現(套件名稱)的提示字元:

    # 顯示目前虛擬環境列表
    $ conda info -e
    # 創建虛擬環境
    $ conda create -n 套件名稱 python=3.6
    # 進入虛擬環境(若是 Windows cmder 環境不用加 source) ,成功後提示字元變成:(套件名稱)$
    $ source activate 套件名稱
    # 離開虛擬環境(若是 Windows cmder 環境不用加 source)
    $ source deactivate

建立虛擬環境

在建立相關開發工具後我們正式來建立一個 Python 的專案:

打開終端機移動到桌面,建立專案資料夾

$ cd ~/Desktop
$ mkdir python_examples
$ cd python_examples

建立獨立虛擬環境,並進入虛擬環境:

$ conda create -n python_examples_venv python
$ source activate python_examples_venv

成功進入虛擬環境後

你的第一個 Python 程式

一般而言我們會使用編輯器或是整合開發環境(IDE)進行程式撰寫,然後在終端機下指令執行程式。當然你也可以在終端機上使用內建互動式介面或是 jupyter notebook 進行。以下是我們要介紹給大家的簡單範例,第一個是隨機印出不同的喜愛程式語言,第二個是使用第三方套件擷取政府公開資料。程式設計唯有動手實際操作和實踐才能學的好,希望讀者打開你的編輯器透過自己實作去熟悉 Python 程式撰寫:

隨機印出不同的喜愛程式語言:

  1. 引入 random 套件
  2. 定義 language 變數,並將儲存程式語言字串的串列(list)資料結構給定給變數
  3. 產生 1 到 2 之間的隨機整數
  4. 列印出最喜歡的程式語言字串(含根據隨機產生的 index 選取到的串列值)
import random

language = ['Python', 'JavaScript', 'Java']
rnd = random.randint(1, 2)
print('My favorite Language is' + language[rnd])

可以在終端機移動到檔案資料夾執行程式檔案,例如:

python favorite_language.py

使用第三方套件擷取政府公開資料:

  1. 引入 requests 套件
  2. 爬取政府公開 Wifi 熱點資料,將取得資料回應給定給 response 變數
  3. 將資料轉換成以 { "key": "value "} 形式的 json 格式
  4. 印出取得的資料
import requests

url = 'http://data.taipei/opendata/datalist/apiAccess?scope=resourceAquire&rid=b087af42-2c54-4dbf-86c8-427d788779e5'
response = requests.get(url)
data = response.json()
print(data)

總結

以上就是程式設計思維入門簡介,透過了解什麼是程式設計思維和不同語言的特性,我們將對於自學程式設計有更正確的認識。接下來我們將透過 Python 介紹程式設計的內涵和不同的應用情境。當然,網路上也有許多學習資源可以當做參考,若你需要先建立基本的電腦科學知識的話,可以參考哈佛大學的熱門公開課程 CS50

(image via mshcdn

延伸閱讀

  1. Python 官網
  2. JavaScript 程式設計新手村
  3. Python Web 程式設計入門實戰
  4. 非本科生,我想半路出家學寫程式,該如何開始?
  5. 自學程式設計學習資源懶人包
  6. CS50
  7. CS50 TV