DEV Community: Emmanuel

Using WooCommerce as a headless Online Store

Emmanuel — Sun, 01 Nov 2020 15:16:40 +0000

Install WordPress

Watch this video and stop at step #3. Make sure you select uscentral1, useast1, or uswest1 to take advantage of google's free tier.
Enable let's encrypt by running:

     sudo /opt/bitnami/bncert-tool

Disable the Bitnami banner by running:

    sudo /opt/bitnami/apps/wordpress/bnconfig --disable_banner 1
    sudo /opt/bitnami/ctlscript.sh restart apache

Configure the server to parse Authorization headers correctly when you make a request from the front end:

    // Open the htttpd config file by running:        
    sudo nano /opt/bitnami/apps/wordpress/conf/httpd-app.conf

    // Add this to the bottom of the file:
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
    SetEnvIf Authorization "(.*)" HTTP_AUTHORIZATION=$1

    // Restart the server
    sudo  /opt/bitnami/ctlscript.sh restart apache

Install Woo-commerce plugin
Go to settings -> Permalinks and change from plain to custom: /%postname%/and product base to custom: /product/
Generate your API keys. set them to read/write
Add products (set up a test CSV file for this)
Install Axios on your front end we will use this for some basic auth stuff

Bonus Section: Connect to MySQL DB Remotely

SSH into your VM and run the following command:

sudo nano /opt/bitnami/mysql/my.cnf

comment out bind-address=127.0.0.1 and save the file.

Next create a new db user with the following command:



mysql -u root -p
# enter password
CREATE USER 'user'@'%' IDENTIFIED BY 'YOUR_PASSWORD';
GRANT ALL PRIVILEGES ON * . * TO 'user'@'%';
FLUSH PRIVILEGES;

Create a Free DB on Google Cloud

Emmanuel — Thu, 15 Oct 2020 02:45:18 +0000

Once you've created a Google Cloud Console account follow these steps to create a free DB:

Create a project
Go to the Market place and search for MYSQL Bitnami and select MYSQL packaged by Bitnami and click launch.
Configure it with the cheapest possible options. Should be $5.65 if you select SSD for storage.
Once the deployment is done take note of the Admin User and Password click SSH and enter the following command to edit your MySQL config: sudo nano /opt/bitnami/mysql/conf/my.cnf
Edit the file and change bind-address=127.0.0.1 to bind-address=0.0.0.0. This configures your MySQL installation to allow remote connections.
Restart the mysql server by running: sudo /opt/bitnami/ctlscript.sh restart mysql
Now we need a static IP address so go to VPC Networks -> External IP Addresses. For your MySQL deployment change the type from Ephemeral to Static. Fill the prompt and submit.
Next, we need to allow external IPs access our VM. So still under VPC Networks go to Firewall and Click Create Firewall rule. a. Enter the name and description b. For targets select All instances in the network c. For source IP ranges enter 0.0.0.0/0 d. For protocols and ports click Allow All e. Leave the rest as is and click Create
Now we can test our MySQL Database connection using TablePlus. a. Host will be the static IP address from step 6 b. Port is 3306 c. User and Password will be the credentials from step 4

That's it! If everything goes right then we have a Free MySQL DB that should cost almost nothing till things get really serious.

Adonis 5 db:seed command.

Emmanuel — Fri, 22 May 2020 18:58:41 +0000

I've been messing around with Adonis 5 and even though it's still in preview the framework is just awesome. Found the db:seed command in the docs but it doesn't seem to have been shipped yet so I decided to write mine pending when the command is released. I tried to make with work just like it did in version 4. Here's what I came up with:

Deploying Adonis.js 5.0 to Google App Engine From Version Control

Emmanuel — Tue, 19 May 2020 10:04:11 +0000

In the previous article, we deployed an Adonis.js 5.0 application from our local development environment to Google App Engine. In this post, I will show you how to set up Google Cloud Build to automate the deployment of our application. We'll connect a remote GitHub repository such that every time we push to the master branch our changes are deployed to Google App Engine.

To get started let's run the following commands to push our code to a remote GitHub repository.

git add .
git commit -m "first commit"

git remote add origin <your-github-repository>

git push -u origin master

Connecting Our GitHub Repository to Google Cloud

To connect our GitHub repository:

Open up Cloud Source Repositories in Google Cloud Console.
On the top right, click the Add Repository button then select the Connect external repository option.
Select your project from the dropdown menu, select GitHub from the Git provider menu and then click the Connect to GitHub button.
Once you have authorized Google Cloud on your GitHub account you can then select the required repository and click the Connect selected repository button

Now every time you push code to your GitHub repository it gets mirrored on Google Cloud Source Repositories.

Defining our Cloud Build Steps

To automate our deployment we need to tell Google Cloud Build what to do with the code it mirrored from GitHub. We do this in the cloudbuild.yaml file. For our Adonis.js 5.0 application, we will require the following steps:

Install the Node.js dependencies in our package.json file: We need to do this because we asked git to ignore the node_modules folder in the .gitignore file of our project.
Set environment variables: Adonis.js has a .env file where environment variables are stored but we also removed it from version control for security reasons. However, we will keep the .env file safe in a Google Cloud Storage Bucket. To make the .env file available in our App Engine deployment, we will need to copy it from the Google Cloud Storage bucket to the deployment folder.
Run the Adonis.js 5.0 build command: This will compile our Adonis.js 5.0 application into the build folder. You can see more details about that here.
Copy the app.yaml file into the build folder: Since we will be deploying only the contents of the build folder, we need to copy our app.yaml file into it so Google App Engine knows how to run our application.
Run the application on App Engine: In this step, we push the contents of the build folder to Google App Engine for deployment.

Here is an example of how we specify these steps in the cloudbuild.yaml file:

steps:
  # Install node.js dependencies
  - name: node
    entrypoint: npm
    args: ["install"]
  # Fetch environment variables from storage
  - name: gcr.io/cloud-builders/gsutil
    args:
      [
        "cp",
        "gs://crudecoding.appspot.com/deployment-files/${_ENV}.env",
        ".env",
      ]
  # Run build script
  - name: node
    entrypoint: node
    args: ["ace", "build", "--production"]
  # Copy app.yaml into build folder
  - name: gcr.io/cloud-builders/gsutil
    args: ["cp", "app.yaml", "build/app.yaml"]
  # Deploy application
  - name: "gcr.io/cloud-builders/gcloud"
    dir: "build"
    args: ["app", "deploy"]

What's happening in our `cloudbuild.yaml` file?

The name parameter in each step specifies the tool Google Cloud Build should use in running the step. This could be a container image from DockerHub or one provided by Google. For example, when we specified node in the Run build script step, Google Cloud Build pulls the Node.js image from DockerHub.

The entrypoint parameter specifies the command-line tool to be used and then the args parameter specify each parameter passed to the command-line tool. For example in the Install node.js dependencies step the Node.js image from DockerHub comes with npm installed so we can use it as an entry point and supply ["install"] in args so that we have the npm install, or in the Run build script step we supply ["ace", "build", "--production"] to node to get node ace build --production.

Create a Build Trigger

Once we have created the cloudbuild.yaml file in the root of our application and committed it to the remote repository, the final step is to create a trigger on Google Cloud Build. To do this:

Open the Triggers page in Google Cloud Console, select your project and click Create Trigger
Fill out the name and description.
Under Event select push to a branch.
Under Source select the repository you mirrored from GitHub earlier. Select ^master$ to trigger a build every time there's a push to the master branch.
Under Build Configuration select Cloud Build Configuration file and leave the file location as cloudbuild.yaml then click the create

That should be all. If we did everything right when we push to the master branch on our GitHub repository our application gets deployed on Google App Engine. In the next article, we'll talk about how we can connect to the database and run migrations from Google Cloud Build.

Deploying Adonis.js 5.0 to Google App Engine (Part 1)

Emmanuel — Wed, 29 Apr 2020 19:21:53 +0000

Adonis.js is a powerful Node.js framework focused around developer ergonomics and stability. Version 5.0 promises a lot of exciting improvements and since it is currently in preview, I decided to have a go at it. My biggest curiosity was how to deploy to production. I had been exploring Google Cloud Platform's App Engine and decided to try it out with Adonis.js 5.0. In this article, I will walk through my entire experience, from building out the Adonis.js 5.0 application locally to deploying and setting up a CI/CD pipeline on Google Cloud Platform. The deployment steps discussed in this article will likely apply to most Node.js applications so you should still find it helpful even if you do not use in Adonis.js. Let's get right to it.

Our Adonis.js Application

The application we'll be hosting is an API which supports CREATE, READ UPDATE and DELETE of blog posts. I have already written the code to make our blog work. You can clone the repository and follow the setup instructions:

Obapelumi / adonisjs-5-blog

Simple Adonis.js 5.0 blog hosted on Google Cloud Platform

Node.js Blog Hosted On Google Cloud Platform

Simple Adonis.js blog hosted on Google Cloud Platform

Setup

Install the adonis cli tool and run npm install or yarn install.

Once the installation is complete you will need to complete the following steps:

Create a MySQL database: This application uses MySQL for data persistence. You will need to create a MySQL database and take note of the database name and other connection parameters.
Generate your application key: Run node ace generate:key. This key is used internally by the application for encryption purposes.
Create a .env file based off .env.example file and populate its contents accordingly.
Create your database tables by running migrations: In the terminal run node ace migration:run --force

You can now run npm run dev or yarn dev to start the local development

View on GitHub

Setting Up Our Google Cloud Project

To deploy our application, we need to create a project on Google Cloud Platform or select an existing one on the Project Selector Page. We will also need to enable billing but don't worry Google Cloud offers a generous free-tier which we will not exhaust.

Deploying our Application To Google's App Engine

Now that we have a project set up on Google Cloud we need to push code to Google's App Engine and give it instructions on how to run our app. To do this we need the Google Cloud SDK which gives us access to some Command Line Tools which we need for our deployment. You can find the installer for Windows, macOS or Linux here.

Once the Cloud SDK has been successfully installed we can use it to connect to our Google Cloud Project. To do this let's open up our command-line and cd into our Adonis.js 5.0 application's directory and then run gcloud init and follow the command-line prompts.

C:\Users\Your Adonis.js Project Directory>gcloud init
Welcome! This command will take you through the configuration of gcloud.

Pick configuration to use:
 [1] Create a new configuration
Please enter your numeric choice:  1

Enter configuration name. Names start with a lower case letter and 
contain only lower case letters a-z, digits 0-9, and hyphens '-':  adonis-js-5
Your current configuration has been set to: [adonis-js-5]

Choose the account you would like to use to perform operations for 
this configuration:
 [1] Log in with a new account
Please enter your numeric choice:  1

Your browser has been opened to visit: https://accounts.google.com/o/oauth2/auth?/.....

The initialization steps will open up your browser and require you to authorize the Google Cloud SDK. Once this is done you can return to your command-line to complete the initialization.

You are logged in as: [<google-account>].

Pick cloud project to use:
 [1] voltaic-quest-274117
Please enter numeric choice or text value (must exactly match list
item):  1

Your current project has been set to: [voltaic-quest-274117].

.....
extra set up info from the google cloud SDK..
....

C:\Users\Your Adonis.js Project Directory>

Next, we need to tell Google App Engine to run our application using Node.js 10, specify environment variables and a start-up command for our application. To do this first we create an app.yaml file in the root of our application with the following content:

runtime:  nodejs10

env_variables: 
  PORT: <The Port Your Application Listens On>
  HOST: <mostly 127.0.0.1>
  NODE_ENV: <production or development>
  APP_KEY: <Your Application Key>
  DB_CONNECTION: <MySQL, Postgres or SQLite>
  DB_HOST: <Database Host IP Address>
  DB_USER: <Database User>
  DB_PASSWORD: <Database Password>
  DB_NAME: <Database Name>

Adonis.js 5.0 has a build step which compiles the TypeScript code written into JavaScript in the build directory. Therefore, the entry point for our application will be build/server.js By default, the App Engine will look for the start script in our package.json file so we can specify our start-up command there. Here's how that would look:

{
  "name": "blog",
  "scripts": {
    "build": "node ace build",
    "dev": "node ace serve --watch",
    "start": "node build/server.js"
  },
  ...
}

Now we can run the following commands to compile and deploy our application:

node ace build \\ Adonis.js 5.0 build step
gcloud app deploy

If we did everything right we can visit https://<our-project-id>.appspot.com to see the application running.

In the next article, we will set up version control for our application and see how we can up Google Cloud to deploy our application once we push to our GitHub repository's master branch.