Python 2.7以及Python Virtual Environment – 安裝

因ubuntu從18.04開始,內建的python版本都是為3.6以上 (舊的內建2.7),所以要手動輸入版本號

安裝python2.7

sudo apt update
sudo apt install python2.7 -y

檢查一下python2.7版本:

python2.7 -V

輸出結果:

安裝pip套件

這邊的作法是下載get-pip.py來安裝。

注意:
第3行的URL不一定是最新的,若有跳出錯誤訊息是URL找不到,請自行更換成錯誤訊息跳出的URL。

cd ~
cd 下載
curl https://bootstrap.pypa.io/pip/2.7/get-pip.py -o get-pip.py
python2.7 get-pip.py 

若安裝成功,最後會看到這個訊息:

(可略過不做)
為使用pip套件建立別名:
後面的指令pip2請自行改成python2.7 -m pip

cd ~
touch .bash_aliases
echo "alias pip2='python2.7 -m pip'" >> .bash_aliases
source .bash_aliases
pip2 -V

輸出結果:

pip 20.3.4 from /home/ubuntu/.local/lib/python2.7/site-packages/pip (python 2.7)

使用pip安裝virtualenv

日後為每個專案製作一個專屬的python environment

pip2 install virtualenv
# 等同於 python2.7 -m pip install virtualenv

為virtualenv製作別名

這是因為如果安裝其他python版本的virtualenv,用別名來區分使用的版本。也可以略過,後續指令virtialenv2.7自行替換成virtualenv

echo "alias virtualenv2.7='python2.7 -m virtualenv'" >> ~/.bash_aliases
source .bash_aliases
# 測試一下
virtualenv2.7 --version
# 輸出結果
# virtualenv 20.4.3 from /home/ubuntu/.local/lib/python2.7/site-packages/virtualenv/__init__.pyc

製作一個test_venv專屬的python environment。

mkdir python27_venv
cd python27_venv
virtualenv2.7 test_venv  # 方法1:有製作別名(上方操作)才可使用此方法
python27_venv python2.7 -m virtualenv test_venv  # 方法2

創建完後進入虛擬環境:

source ~/python27_venv/test_venv/bin/activate
# 命令列多出前綴(test_venv)。表示已經啟用此虛擬環境
(test_venv)$ python -V
Python 2.7.17 # 輸出結果
(test_venv)$ pip list
# 離開虛擬環境
(test_venv)$ deactive

# 前綴消失,表示已經關閉虛擬環境

ubuntu背景執行py方法

主要介紹在linux下使用Terminal來背景執行python的幾種方式,
一個用python寫的監控腳本test.py,一直運行,每5秒、10秒、15秒顯示一次現在時間。

以下為test.py、test2.py、test3.py這三隻同時使用背景來執行的畫面。

執行test.py後,會顯示跳出PID為25270。

# code:utf-8
from datetime import datetime
from time import sleep

while(1):
    count = 1
    sleep(5)
    print(str(count) + " : " + str(datetime.now().strftime('%Y-%m-%d %H:%M:%S')))

再執行一隻test2.py,不會讓原本的test.py停住,還是會繼續執行,並且顯示新的PID。

# code:utf-8
from datetime import datetime
from time import sleep

while(1):
    count = 2
    sleep(10)
    print(str(count) + " : " + str(datetime.now().strftime('%Y-%m-%d %H:%M:%S')))

再執行test3.py。

# code:utf-8
from datetime import datetime
from time import sleep

while(1):
    count = 3
    sleep(15)
    print(str(count) + " : " + str(datetime.now().strftime('%Y-%m-%d %H:%M:%S')))

查詢一下背景運行的程式有哪些。

ps -ef

想停止某隻程式的話,就輸入:

kill PID


kill掉後原本的Terminal會出現已終止某隻程式。

原本的test2.py和test3.py還會繼續執行。

HTML -標記的語法規範與結構

語法

單標記

只有一個標記,既能表示開始,也能表示結束
語法:<標記> 或 <標記/>
ex:

<br> 或 <br/> 換行
<hr> 或 <hr/> 一條水平線
<img> 或 <img/> 圖片
<input> 或 <input/> 表單控件

單標記是沒有內容文字的,所以沒有</img>,建議寫成<img />
在>前加上一個”/”,這樣的話就可以很清楚的看見這個元素的結束。

雙標記

雙標記,是有顯示的開始 和 結束標記組成的
<標記>內容
ex:

<b>普通文本</b>
<s>文本內容</s>

有開始,必須有結束,否則會產生意想不到的效果

標記的嵌套

在一對標記中,又出現了其他的標記,相當於就是功能的嵌套

標記嵌套時一定要注意格式問題:
ex:

<s><b>文本內容</b></s>

被嵌套的內容一定要加 縮進

<s>
  <b>文本內容</b>
</s>

標記的屬性 和 值

在標記中,屬性是用來修飾標記的顯示效果的。

  1. 屬性必須聲明在開始元素中
    <元素 屬性聲明位置處>
    <元素 屬性聲明位置處>
  2. 屬性 和 元素之間,用空格隔開
    <元素 屬性聲明位置處>
    <元素 屬性聲明位置處>
  3. 屬性 和 值之間使用 = 連接,值要用”或””引起來
    <元素 屬性=”值”>
  4. 一個元素允許設置多個屬性,並且排名不分先後,
    多屬性間用 空格 隔開
    <元素 屬性1=”值1″ 屬性2=”值2″>
  5. HTML中的註釋
<!-- 這是註釋內容
這也是註釋內容
-->
  1. 注意:
註釋不能出現在<>中
<p<!-- -->></p>

註釋不能嵌套
<!--
這是一段註釋
<!--
這又是一段註釋
-->
-->

HTML文檔結構

HTML頁面

在 文檔類型聲明 之下,使用一對 根標記來表示頁面
html根標記包含兩對子標記:

網頁頭部信息

<head></head>

網頁的主體

顯示給用戶看的內容,是最長編寫的地方。

<body></body>

元素

<head></head> 
  1. 標題內容
  2. 指定網頁內容的編碼格式
<meta charset="utf-8>
  1. 指定網頁的關鍵字 – 面向搜索引擎
<meta name="keywords" content="關鍵字1,關鍵字2,關鍵字3">
  1. 指定網頁的描述文本 – 面向搜索引擎
<meta name="description" content="... ...">

HTML標記

文本

HTML中的特殊字符

&nbsp; 表示一個空格
&lt; 表示一個 <
&gt; 表示一個 >
&copy; 表示一個 c (copyright)
&yen; 表示 ¥

文本樣式標記

改變文本在網頁中的表現形式
特點:以下標記允許與其他文本內容在一行內顯示。

<i></i> : 斜體
<u></u> : 下劃線
<s></s> : 刪除線
<b></b> : 加粗顯示
<sup></sup> : 上標
<sub></sub> : 下標

`

標題標記

  • 改變文字大小以及加粗效果
  • 每個標題都具備垂直的空白距離
  • 每個標題獨占一行
  • 每個標題都有一個屬性
    屬性:align
    取值:left / center / right
<h1></h1> : 一級標題,文字最大
<h6></h6> : 六級標題,文字最小
<h1 align="left">標題H1 </h1>
<h2 align="left">標題H2 </h2>
<h3 align="center">標題H3 </h3>
<h4 align="center">標題H4 </h4>
<h5 align="right">標題H5 </h5>
<h6 align="right">標題H6 </h6>

段落元素

突出顯示一段文本
獨占一行
每個元素都具備垂直空白距離
屬性:align
取值:left / center / right

<p></p>
<p align="left">left</p>
<p align="center">center</p>
<p align="right">right</p>

換行元素

<br>

水平線元素

<hr>

分區元素

  1. 塊分區元素
    作用:佈局
    獨占一行
    <div></div>
    屬性:align (left / center / right)
  2. 行內分區元素
    設置同一行文本的不同樣式。
    能在一行中顯示多個。
    <span></span>

行內元素與塊級元素

  1. 按照元素不同的表現形式,對元素進行的一個類別的劃分。
  2. 塊級元素
    在網頁中能夠獨占一行的元素都是塊級元素
    p,div,h1~h6
    以上元素都有align屬性
  3. 行內元素
    多個元素能夠在一行內顯示的,都是行內元素
    span,i,b,s,u,sub,sup
<b><i><u>xxxx</u></i></b>

HTML、CSS、JavaScript 簡易介紹

寫網頁時常聽到的三大名稱:

簡單來說:
html是網頁的結構,CSS是網頁的樣式,JavaScript是網頁的行為。

  • HTML 網頁的結構,看起來都方方正正。
  • CSS 把外貌給顯示出來,讓網頁的外貌看起來美觀一些
  • JavaScript 控制網頁裡面的內容以及使用者的操作行為

HTML 基本觀念

  • 巢狀結構
  • 元素(element)
  • 屬性(attribute)
    使用文本編輯軟件即可做開發,以 .html 或 .htm 為結尾的文件,最後使用瀏覽器開啟檔案即可顯示。

巢狀結構

簡單來說就是一層一層的概念
範例:

<html>
    <head>
        <title>Title</title>
    </head>
    <body>
        <h1>標題H1 </h1>
    </body>
</html>

因為巢狀結構有分層級,上層稱為父元素,下層稱為子元素
而層級之間有一定上下、左右的規則,會透過Document Object Model (DOM)來進行遍歷的順序。

元素(element)

使用過程中,需要用 <> 括起來。
HTML元素網址

屬性(attribute)

可以藉由各種方式去設定元素或調整它們的行為。
簡單來說,除了最開頭的元素以外,中間都是屬性。

HTML屬性網址

CSS

CSS就是管理網頁的外貌。

.mainBody{
    min-width: 1024px;
    width: 100%;
    height: 100%;
}
.mainBody .logo{
    height: 45px;
    line-height: 45px;
    background-color: #214D8A;
}

JavaScript – JS

JavaScript 就是管理網頁的內容以及使用者的操作行為,為了要控制網頁的內容。

<script>
</script>

就是實做JavaScript的地方。

Git – 常用指令

git checkout # 有兩個功能,一個是branch, HASH 間的切換,另外一個則是工作區檔案的還原。
git checkout . # 還原所有檔案
git checkout app.html # 還原一個檔案

git remote update # 檢查遠端是否有更新
git branch # 檢查local分支
git branch -a # 檢查雲端最新分支

git stash # 備份當前的工作區
git stash save abcd # 將當前修改的檔案暫存起來並命名為abcd
git stash list # 顯示git內的所有備份,可以利用這個列表來決定從那個地方恢復。
git stash apply stash@{0} # 把Stash撿回來用
git stash drop stash@{0} # 從列表裡刪掉暫存的Stash了
git stash clear # 刪除所有暫存的操作

git reset –hard # 回復到最新提交版本
git reset e1d58ef^ # 拆掉commit的版本

git add -u # 加入所有被更動的檔案(包含 modified 及 deleted)
git log # 查看提交歷史紀錄

git pull origin # 從遠端更新

git push origin my-tag # push 指定標籤 (多個標籤以空白隔開)
git push –tags # push 所有 tag

git diff # 檢查修改內容
git remote -v # 查詢遠端pull、push路徑

tag相關

git tag -l # 查詢所有tag名稱
git tag -a test_tag -m “” # 新增一個名為test_tag的tag
git push origin test_tag # push 指定標籤 (多個標籤以空白隔開)

git push origin –tag # push 所有 tag

git push –tags # push 所有 tag

Line bot – 創建Line bot帳號

建立Heroku

首先進到Heroku的帳戶,登入會看到這個畫面

Create new app,創建名字

建立 屬於自己的Line Bot

developers網址

登入後長下面這樣,點選Create a new provider

請輸入一個Providers的名稱之後,點擊Create

左上角是名字,選擇 Create a Messaging API channel

Channel name
Channel description
Category
Subcategory
Email address

以上這些填一填,最下方打勾

創建完成!

將創建好的Line Bot與Heroku進行串接

點選 Messaging API

點選 Auto-reply messages 右邊的 Edit

點選後會跳出一個新頁面,Webhook設置為啟用

點選Channel access token 右方issue,之後會產生一串有英文數字特殊符號的字串,可以先複製起來,後續會使用到。

移動到最上方,選擇Basic settings後,到Channel secret點擊issue,
這串也會跟著改變,也要複製下來,後面會使用到。

編輯程式

填入自己當時複製起來的字串。第一個最長,第二個是比較短的。

# Channel Access Token
line_bot_api = LineBotApi('YOUR_CHANNEL_ACCESS_TOKEN')
# Channel Secret
handler = WebhookHandler('YOUR_CHANNEL_SECRET')

將代碼傳送到Heroku上

到Heroku的官網,依照自己的系統來安裝套件。Heroku官網

安裝成功後我們來登入Heroku,輸入:

heroku login

會自動開啟新網頁視窗請你登入帳號密碼,下方為登入成功畫面,之後就不需要再管這個畫面了。

Git 基本設定以及Push Hearoku

查看目前的設定

git config --list

如果本來就沒有設定git,需要輸入以下指令來進行初始化:

git config –global user.name “你的名字”
git config –global user.email “你的信箱”

在自己的專案創建一個.git檔案(該動作只需要做一次)

git init 

回到資料夾檢查看有沒有出現.git的資料夾,
通常是被隱藏起來,想看的話要把檢視->隱藏的項目打勾

將 git 資料夾與 Heroku作為連接,這邊HEROKU_APP_NAME是要照你當時在Heroku的專案名稱一樣,
如果不同,他則會報錯

heroku git:remote -a {HEROKU_APP_NAME}

下圖為錯誤訊息:

下圖為設定成功的訊息:

然後照下圖方式

指令如下:

git add .
git commit -m "你想輸入的訊息(必填)" 
git push -f heroku master

最後會執行一段時間,成功如下圖

Line Bot 與 Hearoku 綁定

剛剛已經完成將程式碼PUSH到Hearoku了,現在則是讓Line Bot能夠到Hearoku去運行我們想要機器人為我們做的事情。

回到LINE Developers的Messaging API,
選擇 Webhook URL 點擊Edit 將網址貼上去,格式:

https://{HEROKU_APP_NAME}.herokuapp.com/callback

輸入完後點選Verify,成功後就會將剛剛輸入的URL存上去了。

回到Heroku網站,點選Open app,跳出的新網頁就是你的專案網址。

測試自己做的機器人回覆內容

目前機器人是看打什麼字就回復什麼內容,
如果要關閉每次都跳出那感謝訊息,要到回到回應設定,將自動回覆訊息關閉。

clone heroku 的程式碼

有些人開發不一定是使用同一台電腦,clone的指令如下:

git clone https://git.heroku.com/YOUR_HEROKU_APP_NAME.git

YOUR_HEROKU_APP_NAME這串英文改成你的專案名字就可以成功clone下來了。