【Day1424】I want to reopen website!

2022.12.28

I've always to wanted to create a website that I can customize flexibly. This website was created by WordPress and used the Theme that I bought. But there is a lot of restriction in the development of WordPress.

Thus, I try to recreate my website and write down that process!

Check requirements

First, let's check the requirement that I create a website! It is boring to only code WordPress themes for creating because I can code with Laravel, Vue.js, and some languages and frameworks.

And I want to use technologies that I've never experienced. Coding with those technologies is a good use of time.

Of course, it takes longer, but I want to try it!

So, I create the website like that.

Requirements

  • Cool Design.
  • It's easy to change language (Japanese and English).
  • Create with Next.js, TypeScript, and WordPress(Headless CMS).
  • Use Docker to ready a development environment.
  • Create auto deploy function after pushing to Github.

Initially, I thought to use Golang because Golang was the most featured programming language in 2022. But, my website is created by WordPress. And I could only get a few articles about development with Golang and Next.js. That made me give up using Golang.

Next.js is one of my most admire frameworks for me. It is excellent, and it is easy to code with TypeScript.

I've experienced Docker and Typescript in my work, but I need to learn more about them. I use them in this development.

WordPress is the only technology I often use when I think of this construction. I'm getting anxious..

Is it OK ...?

Let's start building a development environment!

Let's start building a development environment! I thought it was no problem to code docker-compose and Dockerfile for me, but it was not.

I couldn't finish writing docker-compose and Dockerfile. It was too difficult for me...

I gave up writing soon and started to google about building a development environment for Docker, Next.js, and WordPress.

I could find an excellent article about it.

I wanted to learn Tailwind.css too. I forgot it. This article is perfect for me!

I clone the git repository along this article and execute the command make start. The local server was started and displayed demo pages! I thought it was magic.

I appreciate the author of this article. I want to write helpful articles like that for someone.

Continue developing

I could build a development environment. Next, I must design and code.

I designed a few. My website design is below at the moment.

It was inspired by the Laravel 7.X default page. I hope to finish development next month.

Thank you for reading!