Module 1: https://xinfinorg.github.io/Blockchain_Tutorial-website/blockchain.html

To do

Login functionality
Need to check on the rerouting of the express function that authenticates whether user isLoggedIn
Pages for the link at footer
Email sign up (only UI)
Look into google auth sign-in
Enroll today, start lesson.
Functionality for certificate page
Functionality for contact form
Become partner button at university course offline
Next arrow when user finish reading the documents
Content for become partner popup
No page showing all courses, clicking on online blockchain training goes to blockchain basic course for engineer
Code to read the images in folder for gallery and automatically generate it
404 page
For the course content pages, it is preferable if the side bar could automatically be populated with the heading and sub-heading generated in the markdown files or generate a json file of that

Running the website

The src file runs on Gulp, handlebars, livereload and other relevant packages. Using handlebars, the templates could be reused easily and the code is more maintainable. Otherwise, the dist folder is good to go as well. Have to run on server environment.

Some of the benefits of this template:

Easily change hero images, title and copy with a single line e.g. as seen in the university courses page

{{> includes/hero hero-title="University Courses" hero-image="/img/pm4.jpg" hero-copy="this is if you want to add a line below the title"}}

Add two column template

{{> layouts/two-columns}}  {{#\*inline "col-left"}}{{/inline}}  {{#\*inline "col-right"}}{{/inline}}

Easily update courses pages, update courses sub-menu, home page courses link by updating the data structure in /dist/data/courses.json. Run gulp compileCourseOverview and the new pages will be generated in /dist/courses. The structure of the course page is updated at /src/partials/layouts/coursesOverview.hbs. (To note, at the home page, there is no fix number set to the courses display)
Similarly for events and contributors. Easily add, edit and remove the data structure. This made changing the view while reducing error.
The same header, navigation and footer can be generated for every single as each referred to the same /partials/includes/header etc.
Create courses in markdown under /content. The file structure that you created for data will be generated under /server/protected/courses/. This is generated using metalsmith, hence you need to run metalsmith command separately.

gulp metalsmith

Get node up and running

npm install

To watch live changes during development

gulp watch

To watch metalsmith during development as well in another console

gulp watch-ms

Sometimes, the browser does not reload, or if you change the data structure for courses, it might not immediately make changes (gulp only watches the courses.hbs to regenerate the page), when that happens, you can manually rebuild the website or compile the courses page (2 separate commands).