Amerasian World migrated to Astro

Yesterday I had a disappointing day so to cheer myself up, I migrated Amerasian World to the Astro framework. I have been wanting to do this ever since SvelteKit site was broken during the routing changes. I started early afternoon and finished close to midnight.

How Amerasian World started

Amerasian World started as Salaam Central Asia in 2000. Ironically, I got into web development after I “broke” the HTML with the first side. This forced me to learn HTML. In the 23 year process of Amerasian World, I learned server management, JavaScript, and now Jamstack. You can say, it sparked my web development path.

Why switch to Astro?

So why migrate to Astro when SvelteKit is just as good, or even better? It is simple, Amerasian World is already written in HTML. Hence, it was just a static site. Something like SvelteKit was a bit overkill for this website. Astro is well known for static site generation (SSG) out of the box. Yes, SvelteKit can do the same, but for future maintenance, I felt Astro would make a great final framework for Amerasian World.

I repeat, I intend Astro to be the 9th and final framework for Amerasian World. What I like about frameworks today is that is becoming more forward compatible than past frameworks. Yes, I could have kept the site in WordPress or Ghost, but to be honest, it is just a static site. Hence Astro.

Bigger site, new challenges

Amerasian World is having a much needed update. I always wanted to add other content from my stay and travels in both East Asia and Southeast Asia. The original site has over 30 pages. I expect to create at least another 10 more pages.

The reality, for a growing site, means I will need to use different navigation bars. I used to just lump all the content with one MEGA navigation bar (navbar). Not anymore. You will see me use three different navbar for the next iteration of Amerasian World. Most likely there will be a navbar for East Asia and another for Southeast Asia.

Luckily, TailwindUI has a great navigation component that I can use to solve this issue. In the next week, I will implement this with the upgraded site.

Components and Packages used

• Astro Framework.
• Tailwind CSS Framework.
• TailwindUI - I used React for the top navigation.
• Heroicons - For those nice icons in the navbar.
• Simple Icons - For the icons you see in the footer.
• Formspree Contact Form.
• Astro JSON-LD Schema by Codiume.
• Web Analytics by Plausible.
• Partytown - Just for Plausible.
• Pagefind - I am planning to use this for the site search.

The site is hosted at Vercel and domains managed by Cloudflare.

Concluding thoughts

I am quite happy with the migration to Astro. I started another project early, using Astro. It is quite easy to use. I still need to work on better optimizing the images, especially the bigger header image. For my next project, I will manually edit the images and not let Cloudinary handle it.

Please visit Amerasian World at https://amerasianworld.com.

I appreciate any feedback you have. Send me a message to either my Twitter: @MatsunagaKevin, or at Mastodon: https://social.linux.pizza/@kevin.