Add HTML templates - Jekyll

[EChesters]

The code needs to be restructured to use HTML templates.

Every time we update the footer, nav-bar or head, every file must be touched.

Footer, nav-bar and head need to be extracted out to their own files.

[EChesters]

@lili2311 @tanyapowell I've looked into how to do this, but I'm unfamiliar with Grunt. I've been thinking about turning the project into a Jekyll one to make use of its templates.

What do you guys think to Jekyll?

[lili2311]

We can find a templating language, there is no need to convert the whole project. I can post some suggestions or we can make use of Pimp My Causes templates setup with grunt.

For example: https://github.com/mathiasbynens/grunt-template

[EChesters]

As long as we have templates I don't mind what we use. But touching the code is a nightmare to make even small changes. Is there any way of setting priority on issues?

[tanyapowell]

What about a templating engine such as angular.js (DOM based), or mustache.js or handlebars.js? This is eventually going to be plugged into the CMS that is being worked on, so could be worth setting it all up now

@EChesters - we could use Zenhub as a project management tool, as you don't have to leave GitHub. Could set milestones and epics too as a way of prioritising issues

[lili2311]

What are you finding a nightmare? Because the code did not work as intended? If you are unfamiliar with grunt I can help explain what it is doing and how to use it to make your life easier.

[EChesters]

The lack of templates is making commits huge. To change the navbar I had to change 15 files, and had the same problem for the footer. It's also a nightmare keeping up what you've changed where and making sure the changes have been done in all appropriate files. The Grunt file looks like a beast as well, so I'm scared to touch it.

[lili2311]

So let's add the templating in first then move on? The project was rushed and unfinished for go live now that there is no rush it can be done with proper thought.

[EChesters]

I know why it has been done this way, which is why I've only just raised the issue. However now it is becoming a problem which is why I was asking how to set the priority.

I'm asking now how to do this with proper thought. I took a look at using Grunt and found it complicated, and instead suggested Jekyll.

Would you like me to leave this with you if you need to do it in Grunt?

[lili2311]

no Jekyll could be a better tool if you are more familiar with it and will contribute lots to the project, if conversion will only affect templating anyway why not! But do consider the deployment as well as that is currently via Grunt

[EChesters]

Since Grunt and Jekyll do completely different jobs, it should be fine using them both.

Is there anyway of testing the Jekyll version on a different branch before deploying to live?

[tanyapowell]

Think there are two separate issues here:

• implement a templating language
• add any tasks that the templating language requires to the Gruntfile (and possibly modularise it too).

@lili2311 is the Gruntfile used for anything else other than deployment?

Jekyll uses Liquid as a templating language. So the question is - is this the right templating language for the project.

Short term yes, longer term - we need to look into it

[lili2311]

Grunt in this project specifically does:

• watch and compile SASS to css
• copy and minify both CSS and HTML to a deploy folder
• deployment to dev and production

[tanyapowell]

We can watch and compile Sass to css by sass --watch, as it's built in. So if the Gruntfile is too heavy we can remove that task. Then only have the Gruntfile doing two tasks

• minification
• deployment

Let's set up a quick call to discuss this further @EChesters @lili2311

[tanyapowell]

It has been agreed that this project should be migrated to jekyll so we can modularise the html and begin templating content. We will continue using Grunt for

• deployment
• minification

I've created a milestone for this, as I believe we should break this issue down into tasks to help with those on the project with limited time.

@lili2311 and @EChesters as always your input is welcome for creating sub-tasks for this issue