diff --git a/README.md b/README.md
index 187b6dba..80d653ed 100644
--- a/README.md
+++ b/README.md
@@ -143,8 +143,8 @@ An environment variable `GITHUB_TOKEN` needs to present, filled with a [personal
 For local development, you can simply [create a personal access token](https://github.com/settings/tokens) and use it in your local .env file:
 
 ```bash
-cp .env.sample .env.development
-vi .env.development
+cp .env.sample .env
+vi .env
 # GITHUB_TOKEN=ADD-YOUR-TOKEN-HERE
 ```
 
diff --git a/content/concepts/bounties.md b/content/concepts/bounties.md
index 9349f460..7ca5a4a7 100644
--- a/content/concepts/bounties.md
+++ b/content/concepts/bounties.md
@@ -5,6 +5,7 @@ description: Help with Ocean Protocol development and have Ocean Tokens rain on
 
 Explain our bounties
 
--   [🎣 ocean-bounties](https://github.com/oceanprotocol/ocean-bounties/issues)
+<repo name="ocean-bounties"></repo>
+
 -   [Gitcoin](https://gitcoin.co/profile/oceanprotocol)
 -   [bounties.network](https://explorer.bounties.network/explorer?bountyStage=active&search=ocean%20protocol)
diff --git a/content/concepts/development.md b/content/concepts/development.md
index 542436f7..2ddbf96c 100644
--- a/content/concepts/development.md
+++ b/content/concepts/development.md
@@ -7,7 +7,7 @@ description: Learn about the engineering process behind Ocean Protocol and how y
 
 Ocean Protocol uses [C4 Standard process](https://github.com/unprotocols/rfc/blob/master/1/README.md) to manage changes in the source code. Find more details in the respective [OEP-01](https://github.com/oceanprotocol/OEPs/tree/master/1).
 
--   [🐙 Ocean Protocol Enhancement Proposals (OEPs)](https://github.com/oceanprotocol/OEPs)
+<repo name="OEPs"></repo>
 
 ## Project management
 
@@ -16,4 +16,5 @@ We use GitHub as a means for maintaining and tracking issues, roadmap and source
 -   [Ocean Protocol on GitHub](https://github.com/oceanprotocol)
 -   [Business Board (Ocean Roadmap)](https://github.com/oceanprotocol/ocean/projects/1)
 -   [Milestones](https://github.com/oceanprotocol/ocean/milestones?direction=asc&sort=due_date&state=open)
--   [🕶 dev-ocean](https://github.com/oceanprotocol/dev-ocean): Ocean Engineering Pages with documentation about Development, DevOps, QA, Security, etc.
+
+<repo name="dev-ocean"></repo>
diff --git a/content/concepts/ecosystem.md b/content/concepts/ecosystem.md
index ac205410..9c652d42 100644
--- a/content/concepts/ecosystem.md
+++ b/content/concepts/ecosystem.md
@@ -7,25 +7,25 @@ description: The Ocean Protocol network consists of various components. Learn ab
 
 See also [Set Up a Keeper](/setup/keeper/)
 
--   [💧 keeper-contracts](https://github.com/oceanprotocol/keeper-contracts)
+<repo name="keeper-contracts"></repo>
 
 ## Aquarius
 
 Aquarius provides an off-chain database store for metadata about data assets. Every marketplace must run an instance of Aquarius.
 
--   [🐋 aquarius](https://github.com/oceanprotocol/aquarius)
+<repo name="aquarius"></repo>
 
 ## Brizo
 
 Brizo is the technical component executed by Publishers allowing them to provide extended data services. Brizo, as part of the Publisher ecosystem, includes the credentials to interact with the infrastructure (initially cloud, but could be on-premise).
 
--   [brizo](https://github.com/oceanprotocol/brizo)
+<repo name="brizo"></repo>
 
 ## Pleuston
 
 An example marketplace front-end for consumers to explore, download, and publish data assets within the Ocean Protocol network. Implemented using React and squid-js.
 
--   [🦄 pleuston](https://github.com/oceanprotocol/pleuston)
+<repo name="pleuston"></repo>
 
 ## Squid
 
@@ -39,7 +39,7 @@ Client libraries used by applications to interact with Ocean nodes, including Ke
 
 All of our core components generate Docker images automatically and we provide some handy Docker Compose scripts to help with testing, showcasing, and developing Ocean Protocol.
 
--   [🐳 docker-images](https://github.com/oceanprotocol/docker-images)
+<repo name="docker-images"></repo>
 
 ### Full Ocean network stack
 
diff --git a/content/test.md b/content/test.md
index d04240e9..67cabdf5 100644
--- a/content/test.md
+++ b/content/test.md
@@ -19,6 +19,7 @@ For more complete info, see [John Gruber's original spec](http://daringfireball.
 * [Horizontal Rule](#horizontal-rule)
 * [Line Breaks](#line-breaks)
 * [Videos](#videos)
+* [React Components in Markdown](#react-components-in-markdown)
 
 ## Headers
 
@@ -375,3 +376,22 @@ Or, in pure Markdown, but losing the image sizing and border:
 ```md
 [![IMAGE ALT TEXT HERE](http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](http://www.youtube.com/watch?v=YOUTUBE_VIDEO_ID_HERE)
 ```
+
+## React Components in Markdown
+
+In all Markdown docs you can use some select React Components. This magic is done with [gatsby-remark-component](https://www.gatsbyjs.org/packages/gatsby-remark-component/).
+
+Note that the component name in Markdown needs to be always in lowercase, and have a closing tag.
+
+### Repository
+
+The `Repository` component fetching and displaying information about a GitHub repo. can be used as `<repo>` Component requires a `name` to be passed:
+
+```
+<repo name="pleuston"></repo>
+```
+
+Resulting in:
+
+<repo name="pleuston"></repo>
+
diff --git a/content/tutorials/jupyter.md b/content/tutorials/jupyter.md
index 7e7e14d6..bac37b6c 100644
--- a/content/tutorials/jupyter.md
+++ b/content/tutorials/jupyter.md
@@ -4,4 +4,4 @@ title: Use Jupyter Notebooks to interact with the Ocean network
 
 For now, check out [the Mantaray repository](https://github.com/oceanprotocol/mantaray). In the future, we hope to have live online Jupyter notebooks.
 
--   [mantaray](https://github.com/oceanprotocol/mantaray)
+<repo name="mantaray"></repo>
diff --git a/gatsby-config.js b/gatsby-config.js
index a2d82bf0..42a4a4a8 100755
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -1,10 +1,4 @@
-let activeEnv = process.env.ACTIVE_ENV || process.env.NODE_ENV || 'development'
-
-console.log(`Using environment config: '${activeEnv}'`) // eslint-disable-line
-
-require('dotenv').config({
-    path: `.env.${activeEnv}`
-})
+require('dotenv').config()
 
 if (!process.env.GITHUB_TOKEN) {
     throw new Error(
@@ -84,7 +78,8 @@ module.exports = {
                     'gatsby-remark-responsive-iframe',
                     'gatsby-remark-prismjs',
                     'gatsby-remark-autolink-headers',
-                    'gatsby-remark-copy-linked-files'
+                    'gatsby-remark-copy-linked-files',
+                    'gatsby-remark-component'
                 ]
             }
         },
diff --git a/package.json b/package.json
index 74b6c802..f0674565 100755
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "gatsby-plugin-sitemap": "^2.0.2",
     "gatsby-plugin-svgr": "^2.0.0-alpha",
     "gatsby-remark-autolink-headers": "^2.0.11",
+    "gatsby-remark-component": "^1.1.3",
     "gatsby-remark-copy-linked-files": "^2.0.6",
     "gatsby-remark-embed-video": "^1.4.0",
     "gatsby-remark-images": "^2.0.6",
@@ -34,7 +35,8 @@
     "prismjs": "^1.15.0",
     "react": "^16.6.1",
     "react-dom": "^16.6.1",
-    "react-helmet": "^5.2.0"
+    "react-helmet": "^5.2.0",
+    "rehype-react": "^3.0.3"
   },
   "license": "Apache-2.0",
   "scripts": {
diff --git a/src/components/DocContent.jsx b/src/components/DocContent.jsx
index ce4237c5..e639bc02 100644
--- a/src/components/DocContent.jsx
+++ b/src/components/DocContent.jsx
@@ -1,15 +1,17 @@
 import React from 'react'
 import PropTypes from 'prop-types'
+import RehypeReact from 'rehype-react'
+import Repository from './Repositories/Repository'
 import styles from './DocContent.module.scss'
 
-const DocContent = ({ html }) =>
+const renderAst = new RehypeReact({
+    createElement: React.createElement,
+    components: { repo: Repository }
+}).Compiler
+
+const DocContent = ({ html, htmlAst }) =>
     html ? (
-        <div
-            className={styles.docContent}
-            dangerouslySetInnerHTML={{
-                __html: html
-            }}
-        />
+        <div className={styles.docContent}>{renderAst(htmlAst)}</div>
     ) : (
         <div className={styles.empty}>
             This is a placeholder for now. Help creating it.
@@ -17,7 +19,8 @@ const DocContent = ({ html }) =>
     )
 
 DocContent.propTypes = {
-    html: PropTypes.string
+    html: PropTypes.string,
+    htmlAst: PropTypes.object
 }
 
 export default DocContent
diff --git a/src/components/DocContent.module.scss b/src/components/DocContent.module.scss
index a610bdfe..2296ce31 100644
--- a/src/components/DocContent.module.scss
+++ b/src/components/DocContent.module.scss
@@ -14,8 +14,8 @@
         margin-top: $spacer / 2;
     }
 
-    h1,
-    h2 {
+    > div > h1,
+    > div > h2 {
         margin-top: $spacer * $line-height;
         margin-bottom: $spacer / $line-height;
         padding-bottom: $spacer / $line-height;
diff --git a/src/components/Repositories/Repository.module.scss b/src/components/Repositories/Repository.module.scss
index 6fba5ad3..4ebbdd16 100644
--- a/src/components/Repositories/Repository.module.scss
+++ b/src/components/Repositories/Repository.module.scss
@@ -5,18 +5,17 @@
     border: 1px solid $brand-grey-lighter;
     background: $brand-white;
     border-radius: $border-radius;
-    margin-bottom: 4%;
     font-size: $font-size-small;
     text-align: left;
-
-    @media (min-width: $break-point--small) {
-        flex: 0 0 100%;
-    }
+    width: 100%;
+    margin-bottom: $spacer;
 }
 
 .repositoryName {
     font-size: $font-size-h4;
     margin-top: 0;
+    border: 0;
+    padding: 0;
 }
 
 .repositoryRelease {
diff --git a/src/templates/Doc.jsx b/src/templates/Doc.jsx
index 37a75e57..6a4658e2 100644
--- a/src/templates/Doc.jsx
+++ b/src/templates/Doc.jsx
@@ -49,7 +49,6 @@ export default class DocTemplate extends Component {
                                     <Sidebar
                                         location={location}
                                         sidebar={section}
-                                        isPlaceholder={!post.html}
                                     />
                                 </aside>
                                 <article className={styles.main}>
@@ -57,7 +56,10 @@ export default class DocTemplate extends Component {
                                         title={title}
                                         description={description}
                                     />
-                                    <DocContent html={post.html} />
+                                    <DocContent
+                                        html={post.html}
+                                        htmlAst={post.htmlAst}
+                                    />
                                     <DocFooter post={post} />
                                 </article>
                             </main>
@@ -67,7 +69,10 @@ export default class DocTemplate extends Component {
                                     title={title}
                                     description={description}
                                 />
-                                <DocContent html={post.html} />
+                                <DocContent
+                                    html={post.html}
+                                    htmlAst={post.htmlAst}
+                                />
                                 <DocFooter post={post} />
                             </article>
                         )}
@@ -84,6 +89,7 @@ export const pageQuery = graphql`
             id
             excerpt
             html
+            htmlAst
             fileAbsolutePath
             frontmatter {
                 title