Chapter 1 RMarkdown Website
1.1 基礎模版建立
選單:New Project … > New Directory or Existing Directory > (選下圖選項)
1.1.2 任務
以2019 econhackathon網頁資訊為主,創作2020競賽網站。
1.3 Bootstrap
RMarkdown的底子使用了Bootstrap補充的設計風格,所以Bootstrap裡的應用直接寫在RMarkdown裡都會成功。
1.3.1 自學教材
1.4 Forms
form to google sheets: https://github.com/jamiewilson/form-to-google-sheets
- js
- addEventListener method: https://www.w3schools.com/jsref/met_document_addeventlistener.asp
- arrow functions: https://www.w3schools.com/js/js_arrow_function.asp
https://zendev.com/2018/10/01/javascript-arrow-functions-how-why-when.html
- fecth: https://javascript.info/fetch
- FormData: https://developer.mozilla.org/en-US/docs/Web/API/FormData/FormData
- addEventListener method: https://www.w3schools.com/jsref/met_document_addeventlistener.asp
理解:
<form name="submit-to-google-sheet">
<input name="email" type="email" placeholder="Email" required>
<button type="submit">Send</button>
</form>
<script>
const scriptURL = '<SCRIPT URL>'
const form = document.forms['submit-to-google-sheet']
form.addEventListener('submit', e => {
e.preventDefault()
fetch(scriptURL, { method: 'POST', body: new FormData(form)})
.then(response => console.log('Success!', response))
.catch(error => console.error('Error!', error.message))
})
</script>
1.5 Forms 應用
- Rmd要有html碼前後加上
<!--html_preserve-->
<!--/html_preserve-->
bootstrap form component: https://getbootstrap.com/docs/4.3/components/forms/
1.6 Words to Web
Save as -> html
Launch Bracket software. Open the saved html.
1.7 網路爬蟲
Google chrome
套件:
## Welcome to clipr. See ?write_clip for advisories on writing to the clipboard in R.
1.7.1 manual: clipr/psych
1.7.2 automatic: xml2
##
## Attaching package: 'dplyr'
## The following objects are masked from 'package:stats':
##
## filter, lag
## The following objects are masked from 'package:base':
##
## intersect, setdiff, setequal, union
1.7.2.1 Chrome找XPath
右鍵Inspect
… -> More tools -> developer tools
1.7.2.2 從母層位置開始
# 使用chrome developer tools找出所要位置的XPath, 再依此拿出對應nodeset
nodes0 %>%
xml_find_all(xpath='//*[@id="item"]/div[6]/div/div[2]/div[2]/blockquote') ->
nodesTarget_mom
# 以此nodeset下去看子層,最後取出所要文字
nodesTarget_mom %>%
xml_children() %>%
xml_text()
## [1] "19.08.26 財政部國有財產署 南區 教育訓練 - 懶人包設計與製作 講師"
## [2] "19.08.20 嘉義大學 學生會 - 簡報設計 講師"
## [3] "19.08.01 財政部國有財產署 北區 教育訓練 - 懶人包設計與製作 講師"
## [4] "19.05.31 屏東科技大學 企業管理所 簡報設計與實作 一日工作坊 - 講師"
## [5] "19.05.09 衛生福利部 108年衛生教育工作坊 - 懶人包製作 講師"
## [6] "19.04.27 屏東科技大學 職涯發展處 - 簡報設計與實作 一日工作坊 講師19.03.18 逢甲大學 領知中心 - 簡報設計 講師"
## [7] "19.03.14 中原大學 原住民設計專班 設計概論講座 - 簡報設計 講師"
## [8] "19.03.11 逢甲大學 圖書館 - 簡報設計 資訊邏輯力、設計與實作 一日工作坊 講師"
## [9] "18.12.09 高雄醫學大學 心理系學會 - 懶人包設計進階 一日工作坊 講師"
## [10] "18.11.12 之道學習 高中自學生 - 簡報設計 講師"
## [11] "18.10.13 屏東科技大學 職涯發展處 - 商務簡報應用 一日工作坊 講師"
## [12] "18.10.06 屏東科技大學 職涯發展處 - 簡報設計與表達 一日工作坊 講師"
## [13] "18.10.02 逢甲大學 圖書館 - 懶人包設計與行銷進階 一日工作坊 講師"
## [14] "18.09.14 台北商業大學 職涯大使團隊 - 簡報設計 講師"
## [15] "18.09.05 嘉義大學 學生會 - 簡報設計 講師 "
## [16] "18.06.08 彰化女中 班聯會 - 簡報設計 講師 "
## [17] "18.05.09 屏東大學 人際與溝通通識課 - 簡報設計 講師 \n"
## [18] "18.05.03 長庚大學 醫學生聯合會 - 懶人包製作進階 - 講師 "
## [19] "18.03.22 元智大學 新世紀領袖培育計畫團 - 簡報設計 講師 "
## [20] "18.03.11 長庚大學 醫學生聯合會- 懶人包設計 講師 "
## [21] "17.11.30 彰化師範大學 課外活動指導組 - 簡報設計與優化 講師 "
## [22] "17.11.26 國立交通大學 創新創業社 - 簡報設計 講師 "
## [23] "17.10.02 台灣科技大學 學生會 - 懶人包製作與設計 講師 \n"
## [24] "17.09.30 中國醫藥大學 醫學系系學會 - 美感設計 講師 "
## [25] "17.09.05 嘉義大學 學生會 - 美感設計 講師 "
1.7.2.3 選出子層一則找兄弟
nodes0 %>%
xml_find_all(xpath='//*[@id="item"]/div[6]/div/div[2]/div[2]/blockquote/p[1]') ->
nodesTarget_bro # 選子層一則
nodesTarget_bro %>%
xml_siblings() %>% # 找它的兄弟
xml_text()
## [1] "19.08.20 嘉義大學 學生會 - 簡報設計 講師"
## [2] "19.08.01 財政部國有財產署 北區 教育訓練 - 懶人包設計與製作 講師"
## [3] "19.05.31 屏東科技大學 企業管理所 簡報設計與實作 一日工作坊 - 講師"
## [4] "19.05.09 衛生福利部 108年衛生教育工作坊 - 懶人包製作 講師"
## [5] "19.04.27 屏東科技大學 職涯發展處 - 簡報設計與實作 一日工作坊 講師19.03.18 逢甲大學 領知中心 - 簡報設計 講師"
## [6] "19.03.14 中原大學 原住民設計專班 設計概論講座 - 簡報設計 講師"
## [7] "19.03.11 逢甲大學 圖書館 - 簡報設計 資訊邏輯力、設計與實作 一日工作坊 講師"
## [8] "18.12.09 高雄醫學大學 心理系學會 - 懶人包設計進階 一日工作坊 講師"
## [9] "18.11.12 之道學習 高中自學生 - 簡報設計 講師"
## [10] "18.10.13 屏東科技大學 職涯發展處 - 商務簡報應用 一日工作坊 講師"
## [11] "18.10.06 屏東科技大學 職涯發展處 - 簡報設計與表達 一日工作坊 講師"
## [12] "18.10.02 逢甲大學 圖書館 - 懶人包設計與行銷進階 一日工作坊 講師"
## [13] "18.09.14 台北商業大學 職涯大使團隊 - 簡報設計 講師"
## [14] "18.09.05 嘉義大學 學生會 - 簡報設計 講師 "
## [15] "18.06.08 彰化女中 班聯會 - 簡報設計 講師 "
## [16] "18.05.09 屏東大學 人際與溝通通識課 - 簡報設計 講師 \n"
## [17] "18.05.03 長庚大學 醫學生聯合會 - 懶人包製作進階 - 講師 "
## [18] "18.03.22 元智大學 新世紀領袖培育計畫團 - 簡報設計 講師 "
## [19] "18.03.11 長庚大學 醫學生聯合會- 懶人包設計 講師 "
## [20] "17.11.30 彰化師範大學 課外活動指導組 - 簡報設計與優化 講師 "
## [21] "17.11.26 國立交通大學 創新創業社 - 簡報設計 講師 "
## [22] "17.10.02 台灣科技大學 學生會 - 懶人包製作與設計 講師 \n"
## [23] "17.09.30 中國醫藥大學 醫學系系學會 - 美感設計 講師 "
## [24] "17.09.05 嘉義大學 學生會 - 美感設計 講師 "
1.7.2.4 善用XPath
nodes0 %>%
xml_find_all(xpath='//*[@id="item"]/div[6]/div/div[2]/div[2]/blockquote/p') ->
nodesTarget_bro2 # 一次選所有兄弟
nodesTarget_bro2 %>%
xml_text()
## [1] "19.08.26 財政部國有財產署 南區 教育訓練 - 懶人包設計與製作 講師"
## [2] "19.08.20 嘉義大學 學生會 - 簡報設計 講師"
## [3] "19.08.01 財政部國有財產署 北區 教育訓練 - 懶人包設計與製作 講師"
## [4] "19.05.31 屏東科技大學 企業管理所 簡報設計與實作 一日工作坊 - 講師"
## [5] "19.05.09 衛生福利部 108年衛生教育工作坊 - 懶人包製作 講師"
## [6] "19.04.27 屏東科技大學 職涯發展處 - 簡報設計與實作 一日工作坊 講師19.03.18 逢甲大學 領知中心 - 簡報設計 講師"
## [7] "19.03.14 中原大學 原住民設計專班 設計概論講座 - 簡報設計 講師"
## [8] "19.03.11 逢甲大學 圖書館 - 簡報設計 資訊邏輯力、設計與實作 一日工作坊 講師"
## [9] "18.12.09 高雄醫學大學 心理系學會 - 懶人包設計進階 一日工作坊 講師"
## [10] "18.11.12 之道學習 高中自學生 - 簡報設計 講師"
## [11] "18.10.13 屏東科技大學 職涯發展處 - 商務簡報應用 一日工作坊 講師"
## [12] "18.10.06 屏東科技大學 職涯發展處 - 簡報設計與表達 一日工作坊 講師"
## [13] "18.10.02 逢甲大學 圖書館 - 懶人包設計與行銷進階 一日工作坊 講師"
## [14] "18.09.14 台北商業大學 職涯大使團隊 - 簡報設計 講師"
## [15] "18.09.05 嘉義大學 學生會 - 簡報設計 講師 "
## [16] "18.06.08 彰化女中 班聯會 - 簡報設計 講師 "
## [17] "18.05.09 屏東大學 人際與溝通通識課 - 簡報設計 講師 \n"
## [18] "18.05.03 長庚大學 醫學生聯合會 - 懶人包製作進階 - 講師 "
## [19] "18.03.22 元智大學 新世紀領袖培育計畫團 - 簡報設計 講師 "
## [20] "18.03.11 長庚大學 醫學生聯合會- 懶人包設計 講師 "
## [21] "17.11.30 彰化師範大學 課外活動指導組 - 簡報設計與優化 講師 "
## [22] "17.11.26 國立交通大學 創新創業社 - 簡報設計 講師 "
## [23] "17.10.02 台灣科技大學 學生會 - 懶人包製作與設計 講師 \n"
## [24] "17.09.30 中國醫藥大學 醫學系系學會 - 美感設計 講師 "
## [25] "17.09.05 嘉義大學 學生會 - 美感設計 講師 "