-
Notifications
You must be signed in to change notification settings - Fork 0
/
publishingMarkdown.Rmd
259 lines (152 loc) · 7.45 KB
/
publishingMarkdown.Rmd
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
---
title: "Publishing Markdown"
subtitle: "A short tutorial for Class 3EE"
author: ""
date: '`r Sys.Date()`'
output:
xaringan::moon_reader:
lib_dir: libs
css: xaringan-themer.css
nature:
highlightStyle: github
highlightLines: true
countIncrementalSlides: false
---
```{r setup, include=FALSE}
options(htmltools.dir.version = FALSE)
```
```{r xaringan-themer, include=FALSE, warning=FALSE}
library(xaringanthemer)
style_duo_accent(
primary_color = "#1381B0",
secondary_color = "#FF961C",
inverse_header_color = "#FFFFFF"
)
```
class: center, middle
## Congratulations for completing the first part of this tutorial called "Learning Markdown"!
## You are now a member of Class 3EE's Online News Team!
---
# Recap
By now, you would have:
* Learned what Markdown is and what it's used for;
* Learned how to write Markdown, the front matter and the syntax;
* Written your own Markdown document using text from your newspaper articles; and,
* Saved your Markdown document waiting for publication online.
---
class: center, middle
## Now you are ready to publish your Markdown document online.
---
# Things you need:
* A computer that can get on the internet;
* The Markdown document/s that you have already converted into Markdown;
* Permission from your parents and a little bit of help in doing all the online stuff;
---
# Overview of publishing a Markdown document online
* Markdown documents on their own are just lines of text and code that include information on what the document would and should look like when published
* The code and syntax that you have placed in your Markdown document needs to be read and interpreted by a computer who understands Markdown language. This is called `parsing` of the Markdown document and the computer that knows how to read and interpret Markdown is called a `parser`
* After `parsing`, the computer will then convert your Markdown document into another format that is ready for online publication. This format is called `HTML` format
* Once converted, your document is then published online ready to be viewed by yourself and others on the internet
---
# Typical workflow of publishing a Markdown document online
```{r workflow1, echo = FALSE, eval = TRUE, fig.align = "center", fig.width = 14}
DiagrammeR::mermaid("
graph LR
X(START) --> A[<center>1.<br/>Write<br/>Markdown<br/>document</center>]
A --> B[<center>2.<br/>Send Markdown<br/>document to<br/>a Markdown<br/>interpreter/parser</center>]
B --> C[<center>3.<br/>Markdown<br/>document is<br/>converted<br/>to HTML</center>]
C --> D[<center>4.<br/>HTML is<br/>published<br/>online</center>]
D --> Y(END)
",
height = 200)
```
---
# Our workflow for publishing Markdown to online newspaper
```{r workflow2, echo = FALSE, eval = TRUE, fig.align = "center", fig.width = 12}
DiagrammeR::mermaid("
graph LR
X(START) --> A[<center>1.<br/>Write<br/>Markdown<br/>document</center>]
A --> B[<center>2.<br/>Send Markdown<br/>document to<br/>Hugo framework<br/>via GitHub</center>]
B --> C[<center>3.<br/>Send<br/>Markdown<br/>document in<br/>Hugo framework<br/>to Netlify<br/>through GitHub</center>]
C --> D[<center>4.<br/>Netlify converts<br/>Markdown and<br/>publishes HTML<br/>online</center>]
D --> Y(END)
",
height = 200)
```
---
# Our workflow for publishing Markdown to online newspaper
* You will notice that in our workflow, all we have to do are **Step 1** and **Step 2**.
* **Step 3** and **Step 4** are all done automatically for us.
* The online tools that help us with **Step 3** and **Step 4** are **GitHub**, **Hugo**, and **Netlify**
```{r workflow3, echo = FALSE, eval = TRUE, fig.show = "hold", out.width = "33.3%"}
knitr::include_graphics(path = "https://miro.medium.com/max/1400/1*pUZiZ11l8uqsNgRgnW6-Zg.png")
knitr::include_graphics(path = "https://d33wubrfki0l68.cloudfront.net/c38c7334cc3f23585738e40334284fddcaf03d5e/2e17c/images/hugo-logo-wide.svg")
knitr::include_graphics(path = "https://www.netlify.com/img/press/logos/full-logo-light.svg")
```
---
# Our workflow for publishing Markdown to online newspaper
* By now, you would have completed **Step 1** already after our first tutorial.
* We will now focus on completing **Step 2**.
* For this step, you will need:
- A computer that can get on the internet;
- The Markdown document/s that you have already converted into Markdown;
- Permission from your parents and a little bit of help in doing all the online stuff;
---
class: center, middle
## Ready to start?
---
## Sign-in to GitHub
* Our most important tool for **Step 2** is **GitHub**
* **GitHub** is an online tool used mostly by people who write code for developing various kinds of software or for creating various online materials such as websites. **GitHub** allows its users to keep or save their code into repositories and **GitHub** provides tools for sending different kinds of code to its specific interpreter or parser to produce output.
* We have created generic **GitHub** accounts for each member of the Class 3EE News Team. Details of your accont have been provided to your parents. Please ask them for this and ask them to help you log-in.
* Sign in to **GitHub** at https://github.com/login using the login details provided
* If you are creating and using your own **GitHub** account, you will have to first *fork* the **europa-ee/news** repository before proceeding to the next steps.
---
## Open the europa-ee/news repository
* Once you have signed in, you will see the following on your screen:
* On the left-hand side of the screen you will see under **Repositories** the **europa-ee/news** repository. Click this link.
---
## Open the content directory in the europa-ee/news repository
---
## Open the post directory in the content directory in the europa-ee/news repository
---
## Click on upload files to upload your Markdown document
---
## Drag and drop your Markdown document or click on choose your files
---
## Choose your Markdown document file to upload
---
## Check that your file has been uploaded
* If you see your Markdown document file as below, then you know that you have successfully uploaded your document
---
## Commit your changes
* Once you have uploaded your Markdown document, you will need to commit the changes you have made to the **europa-ee/news** repository
* Click on commit changes
---
## Create a pull request
* So that your changes can be considered for publication online, you need to make a pull request.
* A pull request is the way for you to tell the **editor** of the online publication that you have uploaded your document.
---
## Create a pull request
* Confirm the pull request
---
## Create a pull request
---
class: center, middle
## You have now successfully submitted your article for publication.
## The editor will review your submission, make edits to your text and Markdown syntax as needed and within at most an hour from submission, your article will be available online.
## You will be notified once the article is online
---
class: center, middle
## If you have more than one article that you would like to publish online, just repeat the process above for each article.