🔮 Alain.xyz Blog Comments

All comments on the Alain.xyz are powered by Uterances, a tool that uses Github issues as threads for blog post comments.

How it Works

The site is comprised of 3 primary modules:

├─ daemon/    # Server Daemon
├─ backend/   # Express HTTP Server
├─ frontend/  # React Frontend Application
└─ portfolio/ # Personal Portfolio

Backend

The Backend is a basic Express HTTP server, with the added functionality of being able to prerender React components to help reduce the time to interaction.

Node - JavaScript based web server.
Express - Middleware based web server framework.
MongoDB - Basic non-relational database.

Frontend

The Frontend is a React/Redux/Webpack application with that takes lots of artistic license.

React - Front-end framework view framework.
Redux - Unified Application State system.

Daemon

The Daemon is responsible for keeping the server in sync with this Github repo (so Continuous Integration), and uses Github's Repository Webhooks to do so. Alternatives such as using a git remote are also possible, but this has the added benefit of supporting pull requests from here 😁.

Rust - easy to use systems language used for a continuous integration daemon.
Iron - An Express like extendable web framework for Rust.

Build

TypeScript - Typed JavaScript.
Lerna - Tool for managing multiple projects in one repo.
Webpack - Compilation tool for JavaScript.
SystemJS - an import() polyfill.
PostCSS - CSS with postprocessing functions applied to its AST.

Check out the blog post where I detail design decisions here.

A few of the projects that influenced the design of this app were:

License

All source code is available with an MIT license, feel free to take bits and pieces and use them in your own projects. I would love to hear how you found things useful, feel free to contact me on Twitter @alainxyz.

All written articles and art such as blog posts and artwork, etc. are Copyright Alain Galvan, All Rights Reserved unless stated otherwise. If you would like to feature them in a research paper however, feel free to use the following bibtex:

% If you're using a different blog post, replace the title, month, and year appropriately.
@misc{galvan2020,
  title={A Comparison of Modern Graphics APIs},
  url={https://www.alain.xyz/blog/comparison-of-modern-graphics-apis},
  journal={Alain.xyz},
  author={Alain Galvan},
  year={2020}
}

alaingalvan / alainxyz-comments

readme