Develop a minimum WordPress theme from scratch

In this article, I would like to introduce the first step to developing a WordPress theme, develop a minimum theme. I think this article helps those who want to create their own WordPress theme for the first time. I recommend using a Development environment running on the Docker Desktop separated from the Production environment. If you are not familiar with the Docker, the previous article might help you. WordPress: 6.0 Docker Desktop : 4.9.0 mac OS: 12.4 (m1 mac) Prerequisite Just before creating the essential files, we should create the working directory on your PC which will use for the WordPress theme files. I utilize the “Dev-theme” directory for this … Read more

Install WordPress on Docker Desktop on your PC, then Migrate

In this article, I would like to introduce how to prepare the WordPress environment on the PC utilizing the Docker Desktop. Some of you might face some issues when you changed some configurations or installed some plugins. Anyway, it’s a better method to keep your WordPress clean so that you can check the visibility or feasibility of this kind of local environment in advance. I would like to explain the following in this article. Install the WordPress on the Docker Desktop Migrate the production WordPress to the Local WordPress mac OS: 12.2.1 (m1 macbook pro) Docker Desktop: 4.7.1 Install the WordPress on the Docker Desktop First, I would like to … Read more

Deploy the Vue3 Docker image to the Google Cloud Run

Through the series of the articles, I’ve introduced several preparation things, such as “Build a Docker image” or “Push the Docker image“. All these articles are the required prerequisites for the goal of this article, to deploy a Vue3 application included in the Docker image into the Google Cloud Run. It might be better to focus on which part of the entire development process. I hope the below diagram will be helpful. Of course, this article is not only for the Vue application but every Container application. But please understand that what I confirm is only for the Vue application. macOS: 12.2.1 The deploy process overview The only thing for … Read more

Push the Docker image to the Google Container Register

This article is a part of the series, “Publish the Vue3 Docker Image to Google Cloud Run“. I would like to introduce the steps from the preparation of the docker push command so that we can push the Docker image to the Google Container Register (GCR) we can deploy the container to the Google Cloud Run from there. Please see the overall deployment flow below. Since I am going to use the Docker image that has been built in advance, if you would like to know how to build the Docker image, this previous article might be helpful. mac OS: 12.3.1 (m1 mac book pro) Docker Desktop: 4.7.1 Prerequisites Before … Read more

Create the Docker Image with Vue3 for the Google Cloud Run

If we would like to develop a Vue.js application and run it locally, there would be no issue to do that for everyone. However, once we would like to publish the application to the internet, it might be an issue for someone because there are so many options or steps to achieve it. So I would like to introduce the steps to deploy a Vue3 application into the Google Cloud Run through the series of articles. These steps might be one of the most simple steps to publishing your application. In this article, I would like to introduce simple steps to create a Docker Image with the Vue3 application for … Read more

Recap the essential Docker commands

In this article, I would like to recap the essential Docker commands that will be used in the upcoming articles of this series of posts. What those essential Docker commands take part in this series is creating Docker Image that is optimized for the Google Cloud Run. I would like to explain the essential commands to achieve this focusing as little as I can. What will be covered in this article In terms of the Docker commands, we would create the “Docker image” so that the Google Cloud Run could deploy with it. Even though we have to configure a little to optimize for the Google Cloud Run, those will … Read more

[Series Index Page] Publish the Vue3 Docker Image to Google Cloud Run

Through the series of several articles, I would like to introduce how to Deploy the Vue3 project to the Google Cloud Run using Docker Container.

The articles would be started with the “Docker Installation”. If you’ve already done the steps included in the specific topic, you can skip each article.

Note that I will use the “add typescript” option during the Vue3 project creation.

Read more

Install Docker on the M1 Mac environment

In this article, I will explain the Docker installation steps on the M1 Mac PC. Actually, there are no cumbersome steps compared with the other major environments. Only we can do is follow the steps introduced on the Docker Official Site. There are several installation ways provided though, I will proceed with the installer one. macOS: 12.3.1 Docker desktop: 4.7.1 Download the installer First, download the Docker Desktop for Mac installer from the official site. Note that you should click the “Mac with Apple chip” button if you are using an M1 mac PC instead of a Mac with Intel CPU. Launch the installer Once you’ve downloaded the adequate installer, … Read more

[ SwiftUI ] Object Animation parameter behavior comparison

eye-catch

This article shows the behavior comparison regarding which parameter is indicated in the animation modifier in the Object, such as Circle, Rectangle, and so on, in SwiftUI. Since it is better for us to look at the actual behavior than the words, I will show you the movie how each animation parameter reflects the Object move behavior. Xcode: 13.2.1 iOS: 15.2 Swift: 5 Types of animation parameters in SwiftUI First, let’s confirm the official document. According to this document, there are five types of animation parameters that can be set in the animation modifier. default easeIn easeOut easeInOut linear Let’s take a look at it briefly. default Nothing is mentioned … Read more

How to use Bootstrap 5 with the newly created Vue 3 CLI project

The Bootstrap framework allows us to create a good-looking and useful UI effectively. We are able to implement the bootstrap framework by using bootstrap-vue with Vue 2 though, we are facing the error message “Uncaught TypeError: Cannot read property ‘prototype’ of undefined” if we try to same way as Vue 2 with Vue 3. As a result, we cannot see the UI as well. But don’t worry about it, we can implement the bootstrap with Vue 3 by using Bootstrap 5 directly. I will let you know how to use Bootstrap 5, using the button as a sample, with the newly created Vue 3 CLI project in this article. Bootstrap … Read more