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