Mahlathini Development Foundation

Mahlathini Development Foundation  is a small non-profit organisation that specialises in agricultural development of smallholders in rural environments. A custom solution has been created for Mahlathini to serve their research papers and reports, manuals and training videos in an organised structure.

Their website can be viewed here .

Mahlathini provides all its research papers and manuals in either PDF or Microsoft Office format. These documents are usually information dense, and are very large. They are also formatted to a template which cannot be changed. A simple conversion from Word document to raw text would not suffice. The best solution was to convert PDF to html while keeping all formatting.

The biggest challenge with this project was performance. The project’s hosting costs needed to be low. If the server (shared hosting) was to convert the PDFs to HTML, then it would struggle. Even if just to convert files once-off would result in timeouts.

The project was initially created using a custom Node.js renderer that used Twig templates. The main alternatives at the time were WordPress and Gatsby, which couldn’t achieve what I needed. It performed well, but maintenance quickly became an issue.

I converted the project to Next.js in 2021 over a weekend. This has made structuring the site’s templates much easier. Local development is faster and easier, and I can use React instead of Twig.

I created a custom Next.js plugin for this solution. It takes a directory of files as input and recursively iterates through it. It converts each file to HTML and stores and caches assets for future builds. A hierarchical structure is automatically generated from the tree of the directory.

The project is rendered statically. The entire website’s logic sits in getStaticProps and getStaticPaths.

Due to the static nature of the website, it is incredibly fast. There is no processing involved aside from the server delivering the files to the client.