Workflow

In Part I of this series of post we setup our new blog using blogdown and Hugo. Once the blog is configured, this is the typical workflow I follow to write new posts and update my blog online:

1. Open your blog project with RStudio
2. Load the blogdown library and start the Hugo server and browser

library(blogdown)
blogdown::serve_site()

3. Create new post: the best way is to use the RStudio Addins → New post. The Addins menu is in the top bar of RStudio, but you can also get it using

blogdown:::new_post_addin()

Then you will get a window like this

Fill in all the details. Don’t forget to choose plain markdown or R markdown. Use the latter if you want to include some R code.

A new markdown will open with the YAML header filled with the title, author, date, etc. of the posts.

Take some time here to change/add categories and tags to your blog. You can also

• Add a featured image which will appear at the top of the post in some themes (like the casper-two that I chose)

image: /img/posts/image_for_this_post.png

• Since you will take some time to write the new post (even some days), I suggest to include also the variable

draft: true

If you include this, the post will show up in the Rstudio/Hugo local developing environment. It will not be rendered when we build the updated version of the blog to deploy. Once you have finished it make draft: false so next time we build the deployment version of the blog it will be included.

4. After that start writing your amazing post. Everytime you save a new version of the R/markdown file, the Hugo server will render the new version of the blog and you will get in the console something like this

Editing a R/markdown is super easy. You can find some really good guides to do that here

• Introduction to R Markdown from Rstudio.
• Mardown Guide by Matt Cone

Underneath Hugo is taking care of converting everything into HTML. This means that you can also use Hugo shortcodes in the markdown to do things like inserting a tweet or a youtube video. Shortcodes are simple shortcuts to render HTML, iframes, etc. in those cases. Shortcodes appear in your R/markdown like this in markdown

{{< ... >}}

of like this in R markdown

{{ % ... %}}

For example, if we want to include this youtube video in your R/markdown https://www.youtube.com/watch?v=2WTWx0yknQQ you simply have to include the following code in your text

{{< youtube 2WTWx0yknQQ >}}

Or this tweet https://twitter.com/xieyihui/status/817461069014859780 with this code

{{< tweet 817461069014859780 >}}

Check the complete list of already available shortcodes here. You can even write your own ones as we will see later in Part III of this tutorial.

5. If you are happy with your post, remove the draft: true line in the YAML and we are ready to deploy the new version of your blog to our domain. Here is the commands in RStudio I use to do that:

system("rm -r ~/blog/casper-two/public/*")
blogdown::hugo_build(local=F)
system("~/blog/casper-two/deploy.sh")

The fist command simply erases the public directory that contained the old version of the blog. This is probably not needed, but it gives me peace of mind :).

The second command builds the blog. Note the local=F flag which tells Hugo to build a deployment version of the blog, meaning that all the posts with draft: true will not be rendered.

The third command is my personal deployment script. Although most of the guides out there show you how to deploy your blog using Netlify and/or GitHub, I am using my own domain and space at Dreamhost. Then to update my blog I simply synchronize (using rsync) the public directory with the root directory of my domain. Here is my deploy.sh script

#!/bin/sh 
USER=your_user_to_your_blog_domain
HOST=your_dream_host_machine.dreamhost.com
DIR=your_blog_domain/
rsync -avz --exclude-from 'exclude-list.txt' --delete public/ ${USER}@${HOST}:~/${DIR}
exit 0

you might also notice that I have excluded some files in the synchronization which are specified in the file exclude-list.txt. In my case I only have the .htacces file there.

All done!