Sunday 30 September 2018

Build a blog with Cogear.JS

Cogear.JS is a modern static websites generator, built with Node.JS and based on Webpack.It's frontend-framework agnostic. So you can use it either with Vue.JS, React, Angular, etc. or without it.To learn more about it, read recent article on Reddit.Today will learn how to build a blog with Cogear.JS.InstallationMake sure to fit the requirements.To install Cogear.JS do next:$ npm install -g cogear # or $ yarn global add cogear https://www.youtube.com/watch?v=UwWsSnFS0g0https://i.redd.it/asuuwg75ycp11.jpgBlog craftingWe need to transform default site into a blog.It requires two things:Blog plugin.Blog theme.There is a standard way via built-in generator:$ cd ~/Sites $ cogear new blog https://www.youtube.com/watch?v=fweOYQ-_FU0https://i.redd.it/8k124sw9ycp11.jpgBut I've prepared a preset for you which includes both plugin and theme.https://ift.tt/2IsiEMU install a blog with preset.$ git clone --recurse-submodules https://ift.tt/2Rd1RRL blog Now you need to install the dependencies:$ cd ~/Sites/blog $ npm install # of $ yarn install DoneThat was all you have to do.Now fire up Cogear.JS in the development mode.$ cogear You blog is ready: Cogear.JS blogI've uploaded the result to: https://ift.tt/2IrM9hD it out.​https://ift.tt/2RhMtDY time to create the first post.Create ./src/pages/p/first-post.md file with the following content:--- title: First post tags: - news --- # This is my first post! Well done. Save it and browser page will be reloaded automatically.Cogear.JS blog with postThe result is also available by link: https://cogear-blog-with-post.now.sh​https://i.redd.it/dgb6em9zycp11.pngP.S. Why p folder has been chosen for a blog?It's easy to customize this behavior.Edit ./config.yaml file from thistitle: Blog | Cogear.JS – modern static websites generator description: keywords: theme: blog blog: index: "" regex: "^p/" tagUri: 'tag' perPage: 5 pages: ^p/: layout: post author: login: Dmitriy Beliaev avatar: 'https://ift.tt/2ItaVhx' link: https://cogearjs.org to thattitle: Blog | Cogear.JS – modern static websites generator description: keywords: theme: blog blog: index: "" regex: "^blog/" tagUri: 'tag' perPage: 5 pages: ^blog/: layout: post author: login: Dmitriy Beliaev avatar: 'https://ift.tt/2ItaVhx' link: https://cogearjs.org And rename folder ./src/pages/p to ./src/pages/blog.More about the config file in the following video:https://www.youtube.com/watch?v=hEUgZcoFKWMhttps://i.redd.it/k2p234hfycp11.jpgYour questions are welcome!

Submitted September 30, 2018 at 12:02PM by CogearJS

No comments:

Post a Comment