With Grav being a flat-file (no database) CMS tech-savvy educators have a wider range of possible development and deployment options for their Grav Course Hubs than most other database-driven systems. Recently I’ve been exploring an on-line alternative to my currently preferred local development approach, so I thought I would share both together for easier comparison. Both approaches will let you safely develop and test your Grav site before deploying changes to a live production server.

Continue Reading

This article is now outdated. Please refer to the Grav Course Companion Getting Started Guide.

I am pleased (well, actually quite stoked) to announce that my ready-to-run Course Companion, built with the open source CMS Grav, is now available for fellow educators to take for a test drive.

Continue Reading

Here is a quick sampling of some Grav CMS Course Companion workflows:

Video 1. Simple install of the course companion on a Web server (in under 30 seconds).

Video 2. Instructor workflow of making a course companion edit and pushing change to live site (recommended desktop and server install).

Video 3. Student workflow of making a suggested change to the course companion (optional feature).

Video 4. Instructor review of proposed student changes to the course companion site (optional feature). Appointed students can also have the ability to review and approve submitted changes.

Flipped-LMS approach using Grav, GitHub, and Deploy
Figure 1. Flipped-LMS approach using Grav CMS, GitHub, and Deploy.

Here is what I have in mind so far for a possible ebook or workshop about Grav CMS for instructors:

  • What is a Modern Flat-file CMS?
  • Getting Grav up and Running
    • Requirements
    • Installation
      • Server Only
      • Desktop + Server
  • The Basics of Grav
    • Admin Panel
      • Account Creation
    • Overview
      • Dashboard
      • Configuration
      • Managing Pages
      • Editing Pages
    • Working with Files
      • Overview
      • Pages
    • Folders
    • Page Content
    • Overview
    • Names
    • Headers
      • Markdown
      • Linking Pages
      • Embedding Media
  • Flipping your LMS with Grav
    • What is a Flipped-LMS?
    • Why Flip the LMS?
    • Flipped-LMS Approach
    • Experience Design Goals
    • Why Grav?
  • An Open and Collaborative Workflow
    • Overview
    • Recommended Toolset
      • MAMP
      • Git Service (e.g. GitHub, GitLab, Gogs, etc.)
      • GitHub Desktop
      • Deploy
    • Example Workflow
    • Setting it all Up
  • Course Companion Skeleton Package
    • Highlights
    • Site Structure
    • Pages Types
    • Configuration
  • Things to Explore Next…
    • Font awesome icons (included)
    • Built-in media manipulation functionality
    • Modular content using Page Inject plugin (included)
    • Additional theme customizations
    • The joys of the Twig templating language
  • Wrap-up

Here is a draft workshop description:
Do you have unmet pedagogical goals due to the constraints of your current LMS? Do you want to have a better experience for your students and yourself? In this workshop, Paul will introduce Grav, the modern flat-file (no database) CMS and his open source course companion to help other instructors flip their LMS to overcome these challenges. Participants should be comfortable with editing text files, connecting to a Web server, and be familiar with basic Web page elements.

And here is a peek at the in-progress slides:

Thoughts or comments? You can find me on Twitter at @hibbittsdesign.

What is a flipped LMS?
A flipped LMS approach is where an open platform, in the control of course participants, serves as an alternative front-end to the institutional LMS

Flipped-LMS approach
Figure 1. Flipped-LMS approach.

Why flip the LMS?
To support pedagogical goals unmet by current LMS/platform
To deliver a better student (and facilitator) experience
To increase capability of access, sharing and collaboration

What to “Flip” Your LMS With?
Ideally an open and collaborative platform, as shown below:

Open + collaborative Web platform
Figure 2. Open + collaborative Web platform.

Flipped-LMS approach using an open + collaborative Web platform
Figure 3. Flipped-LMS approach using an open + collaborative Web platform.

For example, the modern flat-file CMS Grav along with GitHub and an automatic deployment service such as Deploy can be used quite effectively by tech-savvy educators as an open and collaborative platform to support a flipped-LMS approach:

Flipped-LMS approach using Grav, GitHub, and Deploy

Figure 4. Flipped-LMS approach using Grav CMS, GitHub, and Deploy.

When flipping your LMS what are some key experience design goals?
Student experience design goals:

Facilitator experience design goals:
Controllable (i.e. manageable)
Pliable (i.e. flexible)
Enjoyable (hey, instructors are people too…)

Want to get started with flipping your own LMS? Since this article was written I’ve built an open source project using the Grav CMS to help other tech-savvy instructors - explore the on-line demo and then head over to Grav Course Hub Getting Started Guide to get going.

As a modern flat-file CMS, Grav can take full advantage of today’s ecosystem of open and collaborative editing services, such as GitHub or GitLab. In this article we will look at how to easily use Grav with GitHub Desktop (which uses GitHub and Git for source control) and the automatic deployment service Deploy to result in a very efficient, open and collaborative workflow. No scripting or command line interactions will be required, I promise.

This guide is now outdated. View the updated GitHub & GitHub Desktop tutorial on the new learn.hibbittsdesign.org site.

As an educator, the use of a service such as GitHub to store an online course companion is very appealing as not only does it support an open practice but also enables students to control the very learning environment that they are using. I first described this workflow in my earlier article My Dream Workflow as an Instructor.

Before you start this tutorial I suggest you first get your Grav site up and running locally using MAMP, as outlined in Running Grav Locally with MAMP. By utilizing MAMP you will then have a complete, local version of your course companion site running on your computer that can be easily updated and then deployed to your Webserver.

This tutorial should take about 15 minutes, and once completed you will have an efficient, open, and collaborative workflow for yourself and your students!

Step-by-step instructions

  1. If you do not done so already, sign up for a GitHub account.

  2. Download the GitHub Desktop client for your computer (Mac or PC), and once it is installed launch the application and proceed with the setup process to enter your GitHub account credentials.

    GitHub Desktop setup welcome
    Figure 1. GitHub Desktop setup welcome.

    GitHub Desktop connect to GitHub
    Figure 2. GitHub Desktop connect to GitHub.

  3. Assuming you already have a Grav site present on your computer (and preferably one that is already viewable via MAMP), you next need to create a GitHub Repository of your site. It is recommended that if this is the first time you are using GitHub with Grav that you add the entire Grav site to GitHub, but other approaches are possible such as only storing the “user” folder (see the provided additional resources at the end of this article for more options).

    GitHub Desktop main window
    Figure 3. GitHub Desktop main window, displaying the included tutorial.

    Press the “Add a Repository” button (upper-right plus(+) sign in the main window) in the GitHub Desktop client, select the “Add” tab within the displayed dialog box, and then press the “Choose…” button to select the folder containing your entire Grav site.

    GitHub Desktop add Repository dialog
    Figure 4. GitHub Desktop add Repository dialog.

    GitHub Desktop local Repository added
    Figure 5. GitHub Desktop local Repository added.

  4. You are now ready for the first commit to your new GitHub repository. Whenever you make a commit you will need to include a brief text summary - as this is your first commit enter the text “First commit.” into the “Summary” text box (above the “Description” text field), and then press the button “Commit to master”.

    GitHub Desktop first commit
    Figure 6. GitHub Desktop first commit.

  5. Since this is your first commit to your repository, the “Publish” button (upper-left of main window) will need to be also pressed to actually perform the actual file updates. Once the “Publish” button is pressed enter a short description for your new GitHub repository and then select which GitHub account you want to publish to (if you have multiple accounts).

    GitHub Desktop repository details dialog box
    Figure 7. GitHub Desktop - repository details dialog box.

    GitHub Desktop publishing the repository
    Figure 8. GitHub Desktop publishing the repository.

    GitHub Desktop - repository published
    Figure 9. GitHub Desktop repository published.

  6. Once this process is complete you should now be able to view your Grav site files stored on GitHub - please do this now to ensure that everything went as expected. If you have any issues during this process you may find more detailed GitHub Desktop client support information at https://help.github.com/desktop/.

    GitHub repository of your Grav site
    Figure 10. GitHub repository of your Grav site.

  7. The final step in this process is to trigger an automatic deployment of any changed GitHub files to your Webserver. I recommend you use a Web service that provides this functionality - such as Deploy or Buddy. You can learn how to set up Deploy for use with GitHub in the Deploy support article How do I Start an Automatic Deployment from GitHub? and how to set up Buddy for use with GitHub in the Buddy support articles How to integrate Buddy with GitHub? and How to upload files to FTP/SFTP? .

Congratulations! With the above steps completed you now have a Grav site which you can run and test locally (using MAMP), and with only one click in the GitHub Desktop application have any changed local site files updated in your GitHub repository and then have them automatically pushed to your Webserver hosting your Grav site (via either Deploy or Buddy). In my experience, I can make an update to my Grav site and sync changes to GitHub for automatic deployment to my Webserver in as little as 30 seconds.

 GitHub Desktop repository changes screen
Figure 19. GitHub Desktop main window. When any changes are detected they will be displayed on this screen and can be pushed to GitHub when the “Commit and Sync master” button is pressed.

Students can also now make suggested changes to your Grav site via GitHub or GitHub repository file links provided in your Grav site (see the bottom of this example page at http://paulhibbitts.net/cmpt-363-153//resources). GitHub will provide an excellent view of proposed changes, which you can immediately accept or start a further discussion about these possible changes with the student submitting them.

You can press the GitHub Desktop client “Sync” button (which replaces the “Publish” button you previously used) in the GitHub Desktop client to also download any changes made to the online GitHub repository down to your own computer.

Interested in learning even more about using Grav with GitHub? Check out these two super-informative posts on the Grav Blog: