bloql

Blog engine powered by React using Relay and GraphQL to interact with data.

Usage

• Install bloql package and a bloql retriever to get files:

  npm install bloql bloql-markdown-file-database --save

• Create a backend to serve blog posts:

  var path = require('path');
  var express = require('express');
  var bloql = require('bloql/middleware/express');
   
  const app = express();
   
  bloql(app, {
    pretty: true,
    postsPath: path.join(__dirname, 'posts'),
    database: require('bloql-markdown-file-database')
  });
   
  ...
   
  app.listen(3000, () => {
    console.log('Server started and listening on port 3000');
  });

  (for now only available for express)

• Now you're all set to use bloql on the client:

  import React, { Component } from 'react';
  import ReactDOM from 'react-dom';
  import { createComponent } from 'bloql/PostList';
   
  class PostList extends Component {
   
    render() {
   
      // Render your post list using all react components you want
      return (
        <ul>
          {this.props.posts.edges.map(edge =>
            <li key={edge.node.meta.slug}>{edge.node.meta.title}</li>
          )}
        </ul>
      );
   
    }
   
  }
   
  // Convert your component into a Bloql element
  PostList = createComponent(PostList);
   
  // You can place your component anywhere in any application and
  // combine it with other React components
  ReactDOM.render(
    <PostList/>,
    document.getElementById('app')
  );

Have a look there for minimal and understandable examples: bloql-examples