Skip to main content

Part 1 - An Example of Using Next.js for Static Site Generation on Android with Termux

Next.js is a React framework that gives you building blocks to create web applications.

First thing I did was go to github and create an empty project. I then cloned that project in Termux. You must use the Termux storage and not shared storage unless you can find a workaround for creating symlinks. I then create a starter next.js project.

npx create-next-app --example hello-world blog-posts

I used python to extract all my blog posts titles and links from my Blogger backup and create a json file. Each entry in the json file was title and link.

Next. I followed this guide to display a listing of all my blog posts.


It uses SWR and SWR is an acronym for stale-while-revalidate. The code I got from there had some problems. Dont know why it worked for them and not for me. Maybe linux/termux/android/next.js version creates the issue. After debugging and consulting ChatGPT we figured out that:

The issue with the code you provided is that you're reading the contents of the JSON file as a string using readFile and then directly returning it as the response without parsing it as JSON. To resolve this, you need to parse the file contents as JSON before sending it as the response.

Someone tweeted "Next.js is the most frustrating, opinionated mess I've ever had to deal with. Ugh." and I could not help but agree with the little I have done so far and based on my first impressions. Made me appreciate eleventy for tasks like this.

I found a simple way to serve the statically generated docs folder by running this command in that folder. However I got an error.

php -S localhost:8000

CANNOT LINK EXECUTABLE "php": library "libicuio.so.73" not found

And I had to install that package

pkg install libicu

Now I get a new error when I run npm run build

CANNOT LINK EXECUTABLE "node": library "libicui18n.so.72" not found

I then did (in termux)

apt update
apt upgrade

I then saw and an error in the logs - API Routes cannot be used with "output: export".

Below is me asking for help on Stack Overflow.


This is the project on GitHub


And that is where I have reached. The question now is how can I get around this? How to read from a json file and iterate through it and display its content in Next.js for static site generation using output as export. I am stuck and maybe you can help.

I got a recommendation to try Astro JS. That will be next. It was also suggested to use a const array of objects instead of json. Now, I am wondering if there is a way to serve the json file without using an API route. Stay tuned for part 2. Leave a comment and let me know your thoughts.

Comments

Popular posts from this blog

Hobby project - Store and view exchange rates

The next step in my project was to test out being able store and display the rates in a database. I decided to use nodejs and supabase for this. Everything worked beautifully. Only hickup was the following error due to my package.json not being correct. SyntaxError: Cannot use import statement outside a module Added this to package.json   "type": "module" This works beautifully. Right now I am just testing fragments of what could be part of a bigger system to see what is possible and what works and how easy to code on a mobile. There is no fully functioning integrated end to end system just yet. This is also what I tested. A serverless append-only database using GitHub + Actions + Pages. That’s basically a lightweight backend system. This was the ChatGPT prompt I used. Guide me through each step. This is what I want. A manually run github actions that adds to docs/data.json with the current date and time. docs/index.html displays all the entries in data.json. Make s...

What is important

Every now and again, I get reminded of the why. Why I have handed my life over to God. It is 3:08 p.m. and I have decided to write. Honestly, I feel like I could end this blog post right here. What more is there to say? God above all else. God is our compass on this journey called life. Everything else can become a distraction. Maybe not everything, but certainly many things. You get the point. What is important? What do we prioritise? What do we make time for? The answers look different for everyone. Our lives are different. We are tested differently. We are all products of our circumstances, and those circumstances vary from person to person. Yet God is the common thread across humanity and throughout time. God always was and always will be. One day, we will answer to God. We will give account to God. We cannot live without food, water, and oxygen, but all of those things come from God. So how can we live without God? How timely. I just received a notification from the Quranly app: S...

Running php and apache on termux

This was my experience getting php and apache to run on termux apt update && apt upgrade -y apt install php-apache I was following an old blog post that used php 7 and got these errors Can't locate API module structure `php7_module' in file /data/data/com.termux/files/usr/libexec/apache2/libphp.so: undefined symbol: php7_module Cannot load /data/data/com.termux/files/usr/libexec/apache2/libphp7.so Corrected in apache config file vim $PREFIX/etc/apache2/httpd.conf LoadModule php_module /data/data/com.termux/files/usr/libexec/apache2/libphp.so Apache is running a threaded MPM, but your PHP Module is not compiled to be threadsafe.  You need to recompile PHP. Comment out mpm_worker and use mpm_prefork #LoadModule mpm_worker_module libexec/apache2/mod_mpm_worker.so LoadModule mpm_prefork_module libexec/apache2/mod_mpm_prefork.so This still does not work as apache (httpd) was failing silently. According to Chatty LoadModule php_module ...libphp.so often fails in Termux becau...