Getting Started
Installing distill
Before you getting started, you need to install distill.
- Start RStudio
- At the Console window of RStudio, type the code chunk below:
install.packages("distill")
To learn more about what functions and features offer by distill, you should visit the homepage of distill for R Markdown at least once. The homepage provides a comprehensive discussion on the features and functions of distill.
Opening github and Netlify accounts
In this tutorial, github will be used to host the blog post and will be deploy via Netlify. To create an account, please visit their respective homepage below:
Start a New Website Project
To start a new website project,
- From the menu bar of RStudio, click on File -> New Project.
The New Project Wizard appears.
- Click on New Directory -> Distill Website.
Your screen should look similar to the screenshot below.
- For Directory name:, type a name such as DA. Avoid long name or/and name with spaces in between.
- For Create project as subdirectory of:, navigate to a folder in your harddisk.
- For Title:, provide a proper title for your blog (i.e. Data Analytics Journey).
- Click on Create Project when you are ready.
Let us examine the Files window of RStudio as shown in the screenshot below. The home-directory is called DA. It consists of the DA.rproj file, the about.rmd file, the index.rmd file, the *_site.yml* file and *_site. The _site* folder contains all the final html files and other libraries required to build the web page.
Viewing the newly created blog page
Next, let us view the newly created blog page.
- Click on *_site* folder.
- Click on index.html.
- Select View in Web Browser from the context menu
A web page appears on RStudio viewer as shown below.
Congratulations! Your first web blog has been built successfully.
Editing the _site.yml Page
- From RStudio window, click on _site.yml tab.
You screen should look similar to the screenshot below.
The _site.yml is where we control the content of the blog that include the name, title, descriptive, and the navigation bars.
We will add two new navigation bars on the left. One for DataViz Makeover and one of Take-home Exercise.
- Insert line 12-19 as shown in the screenshot below.
- Click on the Save icon to save the change.
To update the change, you can either
- Click on index.rmd and then click on Knit icon.
Alternatively, the code chunk below should be used.
rmarkdown::render_site()
Note: It is important to perform either one of the above step when *_site.yml* is edited.
Notice that two new navigation bars are added on the website.
Editing about.rmd
In this section, you will learn how to edit the about.rmd file and update its corresponding html page.
- From RStudio window, click on about.rmd tab.
Your screen will look similar to the screenshot below.
This is the default about page. Let us edit the about.rmd similar to the screenshot below.
- Knit the document when the editing is completed.
The About page of the blog will look similar to the screenshot below.
Starting Git
In this section, you will learn how to start a git service in RStudio by using use_git() of usethis package.
Note: Use the code chunk below to install usethis if it has yet to be installed in your computer.
install.packages("usethis")
Next, you will edit the code chunk below on RStudio Console.
usethis::use_git()
- Press on Enter or Return key.
The follow message appears.
At this stage, we are not ready to commit the edition.
- For Selection:, type 3.
- Press on Enter key.
The follow message appears.
We are going to re-start RStudio.
- For Selection:, type 1.
- Press on Enter key.
The Switch Projects dialog window appears.
- Click on Save button.
Notice that Git tab has been added on RStudio pane.
Your screen should look similar to the screenshot below.
We are going to commit all changes.
- Click on the checkboxes in front of all the files.
Your screen should look similar to the screenshot below.
- Click on Commit button.
Notice that we can not push the commit because we have yet to configured Github.
Configuring and Pushing to Github
In this section, you will learn how to configure Github and push the commit to Github.
- At RStudio Console, type the command below:
usethis::use_github()
- Press on Enter key to run the command.
Once the operation completed, the Gihtub webpage appears.
Publishing the Blog
In this section, you will learn how to publish the newly create blog on Netlify server.
Note: This sectgion assume that you have already create an account wit Netlify.
- Login Netlify.
Your screen should look similar to the screenshot below.
- Click on the button of New site from Git.
Your screen should look similar to the screenshot below.
- Click on Github button.
Your screen should look similar to the screenshot below.
- Scrolling down until Publish Directory appears.
- At Publish directory, type -site.
When you are ready,
- Click on Deploy site button.
Notice that Netlify will give a temporary and yet weird name.
You can change the name by using the Site settings option.
- Click on Site settings button.
Your screen should look similar to the screenshot below.
- Click on Change site name button.
The Change site name dialog window appears.
- Give the site an easy to remember name (i.e r4dsa).
- Click on Save button.
Notice that the blog page has a new name (i.e. r4dsa) now.
